diff --git a/app/scripts/controllers/network/createPocketClient.js b/app/scripts/controllers/network/createPocketClient.js index 27a6fecde..95f98817c 100644 --- a/app/scripts/controllers/network/createPocketClient.js +++ b/app/scripts/controllers/network/createPocketClient.js @@ -8,12 +8,13 @@ const createBlockTrackerInspectorMiddleware = require('eth-json-rpc-middleware/b const providerFromMiddleware = require('eth-json-rpc-middleware/providerFromMiddleware') const createPocketMiddleware = require('json-rpc-pocket') const BlockTracker = require('eth-block-tracker') +const devid = 'DEVO7QQqPHCK2h3cGXhh2rY' module.exports = createPocketClient function createPocketClient ({ network }) { - const pocketMiddleware = createPocketMiddleware('DEVO7QQqPHCK2h3cGXhh2rY', { - netID: getNetworkIds(network).netId, + const pocketMiddleware = createPocketMiddleware(devid, { + netID: getNetworkIds({ network }).netId, }) const pocketProvider = providerFromMiddleware(pocketMiddleware) const blockTracker = new BlockTracker({ provider: pocketProvider }) @@ -33,8 +34,7 @@ function createPocketClient ({ network }) { function getNetworkIds ({ network }) { let chainId let netId - - console.log(network) + switch (network) { case 'mainnet': netId = '1' @@ -65,7 +65,7 @@ function getNetworkIds ({ network }) { } function createNetworkAndChainIdMiddleware ({ network }) { - const networkIds = getNetworkIds(network) + const networkIds = getNetworkIds({network}) return createScaffoldMiddleware({ eth_chainId: networkIds.chainId, diff --git a/app/scripts/controllers/network/network.js b/app/scripts/controllers/network/network.js index 6dcbb5989..0b4e76fec 100644 --- a/app/scripts/controllers/network/network.js +++ b/app/scripts/controllers/network/network.js @@ -10,7 +10,7 @@ const createMetamaskMiddleware = require('./createMetamaskMiddleware') const createInfuraClient = require('./createInfuraClient') const createJsonRpcClient = require('./createJsonRpcClient') const createLocalhostClient = require('./createLocalhostClient') -//const createPocketClient = require('./createPocketClient') +const createPocketClient = require('./createPocketClient') const { createSwappableProxy, createEventEmitterProxy } = require('swappable-obj-proxy') const ethNetProps = require('eth-net-props') const parse = require('url-parse') @@ -56,7 +56,8 @@ module.exports = class NetworkController extends EventEmitter { // create stores this.providerStore = new ObservableStore(providerConfig) this.networkStore = new ObservableStore('loading') - this.store = new ComposedStore({ provider: this.providerStore, network: this.networkStore, dProvider: false }) + this.dProviderStore = new ObservableStore({dProvider: false}) + this.store = new ComposedStore({ provider: this.providerStore, network: this.networkStore, dProviderStore: this.dProviderStore }) this.on('networkDidChange', this.lookupNetwork) // provider and block tracker this._provider = null @@ -154,12 +155,13 @@ module.exports = class NetworkController extends EventEmitter { } getDProvider(){ - return this.store.getState().dProvider + return this.dProviderStore.getState().dProvider } setDProvider(key){ - this.store.updateState({ - dProvider: key + console.log("UPDATING STATE TO " + key) + this.dProviderStore.updateState({ + dProvider: key, }) } @@ -178,11 +180,10 @@ module.exports = class NetworkController extends EventEmitter { // infura type-based endpoints const isInfura = INFURA_PROVIDER_TYPES.includes(type) if (isInfura) { - if (this.store.dProvider) { - // log.debug("IS POCKET") + console.log(this.dProviderStore.getState()) + if (this.dProviderStore.getState().dProvider) { this._configurePocketProvider(opts) } else { - // log.debug("IS INFURA") this._configureInfuraProvider(opts) } // other type-based rpc endpoints @@ -218,8 +219,7 @@ module.exports = class NetworkController extends EventEmitter { _configurePocketProvider ({ type }) { log.info('NetworkController - configurePocketProvider', type) - //const networkClient = createPocketClient({ network: type }) - const networkClient = createInfuraClient({ network: type }) + const networkClient = createPocketClient({ network: type }) this._setNetworkClient(networkClient) // setup networkConfig var settings = { diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js index bc3acbf27..31f573402 100644 --- a/app/scripts/metamask-controller.js +++ b/app/scripts/metamask-controller.js @@ -1757,6 +1757,7 @@ module.exports = class MetamaskController extends EventEmitter { * @param {Function} cb - A callback function called when complete. */ setDProvider (key, cb) { + console.log("SETDPROVIDER CALLED ON METAMASK CONTROLLER" + key) try { this.networkController.setDProvider(key) cb(null) diff --git a/old-ui/app/config.js b/old-ui/app/config.js index 9f0bcaf6b..3d18a8f28 100644 --- a/old-ui/app/config.js +++ b/old-ui/app/config.js @@ -1,7 +1,7 @@ +const inherits = require('util').inherits const Component = require('react').Component const h = require('react-hyperscript') const connect = require('react-redux').connect -import PropTypes from 'prop-types' const actions = require('../../ui/app/actions') const LoadingIndicator = require('./components/loading') const Web3 = require('web3') @@ -14,22 +14,18 @@ const Modal = require('../../ui/app/components/modals/index').Modal const ethNetProps = require('eth-net-props') const { networks } = require('../../app/scripts/controllers/network/util') -class ConfigScreen extends Component { +module.exports = connect(mapStateToProps)(ConfigScreen) - constructor (props) { - super(props) - this.state = { - loading: false, - } +function mapStateToProps (state) { + return { + metamask: state.metamask, + warning: state.appState.warning, } +} -<<<<<<< ef400f8d291b983ac5a95bb2d4a3287dae588f76 - static propTypes = { - dispatch: PropTypes.func, -======= inherits(ConfigScreen, Component) function ConfigScreen (props) { - if (props.metamask.dProvider){ + if (props.metamask.dProviderStore.dProvider){ this.state = { loading: false, provider: "Decentralized" @@ -39,110 +35,167 @@ function ConfigScreen (props) { loading: false, provider: "Centralized" } ->>>>>>> wip } + Component.call(this) +} - render () { - const state = this.props - const metamaskState = state.metamask - const warning = state.warning +ConfigScreen.prototype.render = function () { + const state = this.props + const metamaskState = state.metamask + const warning = state.warning - return ( - h('.flex-column.flex-grow', { + return ( + h('.flex-column.flex-grow', { + style: { + maxHeight: '585px', + overflowY: 'auto', + }, + }, [ + + h(LoadingIndicator, { + isLoading: this.state.loading, + }), + + h(Modal, {}, []), + + // subtitle and nav + h('.section-title.flex-row.flex-center', [ + h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', { + onClick: () => { + state.dispatch(actions.goHome()) + }, + style: { + position: 'absolute', + left: '30px', + }, + }), + h('h2', 'Settings'), + ]), + + h('div', { style: { - maxHeight: '585px', - overflowY: 'auto', + margin: '0 30px', }, }, [ - - h(LoadingIndicator, { - isLoading: this.state.loading, - }), - - h(Modal, {}, []), - - // subtitle and nav - h('.section-title.flex-row.flex-center', [ - h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', { - onClick: () => { - state.dispatch(actions.goHome()) - }, - style: { - position: 'absolute', - left: '30px', - }, - }), - h('h2', 'Settings'), - ]), - - h('div', { + h('.error', { style: { - margin: '0 30px', + display: warning ? 'block' : 'none', + }, + }, warning), + ]), + + // conf view + h('.flex-column.flex-justify-center.flex-grow.select-none', [ + h('.flex-space-around', { + style: { + padding: '30px', + overflow: 'auto', }, }, [ - h('.error', { - style: { - display: warning ? 'block' : 'none', - }, - }, warning), - ]), - // conf view - h('.flex-column.flex-justify-center.flex-grow.select-none', [ - h('.flex-space-around', { - style: { - padding: '30px', - overflow: 'auto', - }, - }, [ + currentProviderDisplay(metamaskState, state), - this.currentProviderDisplay(metamaskState, state), - -<<<<<<< ef400f8d291b983ac5a95bb2d4a3287dae588f76 - h('div', { style: {display: 'flex'} }, [ - h('input#new_rpc', { - placeholder: 'New RPC URL', - style: { - width: 'inherit', - flex: '1 0 auto', - height: '32px', - margin: '20px 20px 0 0', - borderRadius: '3px', - border: '1px solid #e2e2e2', - padding: '10px', - }, - onKeyPress: (event) => { - if (event.key === 'Enter') { - const element = event.target - const newRpc = element.value - this.rpcValidation(newRpc, state) - } - }, - }), - h('button', { - style: { - alignSelf: 'center', - marginTop: '20px', - }, - onClick: (event) => { - event.preventDefault() - const element = document.querySelector('input#new_rpc') + h('div', { style: {display: 'flex'} }, [ + h('input#new_rpc', { + placeholder: 'New RPC URL', + style: { + width: 'inherit', + flex: '1 0 auto', + height: '32px', + margin: '20px 20px 0 0', + borderRadius: '3px', + border: '1px solid #e2e2e2', + padding: '10px', + }, + onKeyPress: (event) => { + if (event.key === 'Enter') { + const element = event.target const newRpc = element.value this.rpcValidation(newRpc, state) - }, - }, 'Save'), - ]), - - h('hr.horizontal-line'), - - this.currentConversionInformation(metamaskState, state), - - h('hr.horizontal-line', { - style: { - marginTop: '20px', + } }, }), -======= + h('button', { + style: { + alignSelf: 'center', + marginTop: '20px', + }, + onClick: (event) => { + event.preventDefault() + const element = document.querySelector('input#new_rpc') + const newRpc = element.value + this.rpcValidation(newRpc, state) + }, + }, 'Save'), + ]), + + h('hr.horizontal-line'), + + currentConversionInformation(metamaskState, state), + + h('hr.horizontal-line', { + style: { + marginTop: '20px', + }, + }), + + h('div', { + style: { + marginTop: '20px', + }, + }, [ + h('p', { + style: { + fontFamily: 'Nunito Regular', + fontSize: '14px', + lineHeight: '18px', + }, + }, `State logs contain your public account addresses and sent transactions.`), + h('br'), + h('button', { + style: { + alignSelf: 'center', + }, + onClick (event) { + window.logStateString((err, result) => { + if (err) { + state.dispatch(actions.displayWarning('Error in retrieving state logs.')) + } else { + exportAsFile('Nifty Wallet State Logs.json', result) + } + }) + }, + }, 'Download State Logs'), + ]), + + h('hr.horizontal-line', { + style: { + marginTop: '20px', + }, + }), + + h('div', { + style: { + marginTop: '20px', + }, + }, [ + h('button', { + style: { + alignSelf: 'center', + }, + onClick (event) { + event.preventDefault() + state.dispatch(actions.revealSeedConfirmation()) + }, + }, 'Reveal Seed Words'), + ]), + + h('hr.horizontal-line', { + style: { + marginTop: '20px', + }, + }), + // POCKET NETWORK UI CHANGES START h('p', { style: { @@ -177,220 +230,137 @@ function ConfigScreen (props) { marginTop: '20px', }, }, [ ->>>>>>> wip - h('div', { + h('p', { style: { - marginTop: '20px', + fontFamily: 'Nunito Regular', + fontSize: '14px', + lineHeight: '18px', }, }, [ - h('p', { - style: { - fontFamily: 'Nunito Regular', - fontSize: '14px', - lineHeight: '18px', - }, - }, `State logs contain your public account addresses and sent transactions.`), - h('br'), - h('button', { - style: { - alignSelf: 'center', - }, - onClick (event) { - window.logStateString((err, result) => { - if (err) { - state.dispatch(actions.displayWarning('Error in retrieving state logs.')) - } else { - exportAsFile('Nifty Wallet State Logs.json', result) - } - }) - }, - }, 'Download State Logs'), + 'Resetting is for developer use only. ', ]), + h('br'), - h('hr.horizontal-line', { - style: { - marginTop: '20px', - }, - }), - - h('div', { - style: { - marginTop: '20px', - }, - }, [ - h('button', { - style: { - alignSelf: 'center', - }, - onClick (event) { - event.preventDefault() - state.dispatch(actions.revealSeedConfirmation()) - }, - }, 'Reveal Seed Words'), - ]), - - h('hr.horizontal-line', { - style: { - marginTop: '20px', - }, - }), -<<<<<<< ef400f8d291b983ac5a95bb2d4a3287dae588f76 - - h('div', { -======= h('button', { ->>>>>>> wip + style: { + alignSelf: 'center', + }, + onClick (event) { + event.preventDefault() + state.dispatch(actions.resetAccount()) + }, + }, 'Reset Account'), + + h('hr.horizontal-line', { style: { marginTop: '20px', }, - }, [ - - h('p', { - style: { - fontFamily: 'Nunito Regular', - fontSize: '14px', - lineHeight: '18px', - }, - }, [ - 'Resetting is for developer use only. ', - ]), - h('br'), - - h('button', { - style: { - alignSelf: 'center', - }, - onClick (event) { - event.preventDefault() - state.dispatch(actions.resetAccount()) - }, - }, 'Reset Account'), - - h('hr.horizontal-line', { - style: { - marginTop: '20px', - }, - }), - - h('button', { - style: { - alignSelf: 'center', - }, - onClick (event) { - event.preventDefault() - state.dispatch(actions.confirmChangePassword()) - }, - }, 'Change password'), - ]), + }), + h('button', { + style: { + alignSelf: 'center', + }, + onClick (event) { + event.preventDefault() + state.dispatch(actions.confirmChangePassword()) + }, + }, 'Change password'), ]), ]), - ]) - ) - } + ]), + ]) + ) +} -<<<<<<< ef400f8d291b983ac5a95bb2d4a3287dae588f76 - componentWillUnmount () { - this.props.dispatch(actions.displayWarning('')) - } -======= ConfigScreen.prototype.toggleProvider = function (){ - // console.log(this) + console.log(this) + console.log(this.props.metamask.provider.type) if (this.state.provider == "Centralized"){ this.setState({ provider: "Decentralized" }) this.props.dispatch(actions.setDProvider(true)) + this.props.dispatch(actions.setProviderType(this.props.metamask.provider.type)) } else { this.setState({ provider: "Centralized" }) this.props.dispatch(actions.setDProvider(false)) + this.props.dispatch(actions.setProviderType(this.props.metamask.provider.type)) } } ConfigScreen.prototype.componentWillUnmount = function () { this.props.dispatch(actions.displayWarning('')) } ->>>>>>> wip - rpcValidation (newRpc, state) { - if (validUrl.isWebUri(newRpc)) { - this.setState({ - loading: true, - }) - const web3 = new Web3(new Web3.providers.HttpProvider(newRpc)) - web3.eth.getBlockNumber((err, res) => { - if (err) { - state.dispatch(actions.displayWarning('Invalid RPC endpoint')) - } else { - state.dispatch(actions.setRpcTarget(newRpc)) - } - this.setState({ - loading: false, - }) - }) - } else { - if (!newRpc.startsWith('http')) { - state.dispatch(actions.displayWarning('URIs require the appropriate HTTP/HTTPS prefix.')) +ConfigScreen.prototype.rpcValidation = function (newRpc, state) { + if (validUrl.isWebUri(newRpc)) { + this.setState({ + loading: true, + }) + const web3 = new Web3(new Web3.providers.HttpProvider(newRpc)) + web3.eth.getBlockNumber((err, res) => { + if (err) { + state.dispatch(actions.displayWarning('Invalid RPC endpoint')) } else { - state.dispatch(actions.displayWarning('Invalid RPC URI')) + state.dispatch(actions.setRpcTarget(newRpc)) } - } - } - - currentConversionInformation (metamaskState, state) { - const currentCurrency = metamaskState.currentCurrency - const conversionDate = metamaskState.conversionDate - return h('div', [ - h('span', {style: { fontWeight: 'bold', paddingRight: '10px'}}, 'Current Conversion'), - h('span', {style: { fontWeight: 'bold', paddingRight: '10px', fontSize: '13px'}}, `Updated ${Date(conversionDate)}`), - h('select#currentCurrency', { - onChange (event) { - event.preventDefault() - const element = document.getElementById('currentCurrency') - const newCurrency = element.value - state.dispatch(actions.setCurrentCurrency(newCurrency)) - }, - defaultValue: currentCurrency, - }, infuraCurrencies.map((currency) => { - return h('option', {key: currency.quote.code, value: currency.quote.code}, `${currency.quote.code.toUpperCase()} - ${currency.quote.name}`) + this.setState({ + loading: false, }) - ), - ]) - } - - currentProviderDisplay (metamaskState, state) { - const provider = metamaskState.provider - let title, value - - if (networks[provider.type]) { - title = 'Current Network' - value = ethNetProps.props.getNetworkDisplayName(networks[provider.type].networkID) + }) + } else { + if (!newRpc.startsWith('http')) { + state.dispatch(actions.displayWarning('URIs require the appropriate HTTP/HTTPS prefix.')) } else { - title = 'Current RPC' - value = metamaskState.provider.rpcTarget + state.dispatch(actions.displayWarning('Invalid RPC URI')) } - - return h('div', [ - h('span', {style: { fontWeight: 'bold', paddingRight: '10px'}}, title), - h('span', value), - provider.type === 'rpc' && h('button', { - onClick (event) { - event.preventDefault() - state.dispatch(actions.showDeleteRPC()) - }, - }, 'Delete'), - ]) - } - -} - -function mapStateToProps (state) { - return { - metamask: state.metamask, - warning: state.appState.warning, } } -module.exports = connect(mapStateToProps)(ConfigScreen) +function currentConversionInformation (metamaskState, state) { + const currentCurrency = metamaskState.currentCurrency + const conversionDate = metamaskState.conversionDate + return h('div', [ + h('span', {style: { fontWeight: 'bold', paddingRight: '10px'}}, 'Current Conversion'), + h('span', {style: { fontWeight: 'bold', paddingRight: '10px', fontSize: '13px'}}, `Updated ${Date(conversionDate)}`), + h('select#currentCurrency', { + onChange (event) { + event.preventDefault() + const element = document.getElementById('currentCurrency') + const newCurrency = element.value + state.dispatch(actions.setCurrentCurrency(newCurrency)) + }, + defaultValue: currentCurrency, + }, infuraCurrencies.map((currency) => { + return h('option', {key: currency.quote.code, value: currency.quote.code}, `${currency.quote.code.toUpperCase()} - ${currency.quote.name}`) + }) + ), + ]) +} + +function currentProviderDisplay (metamaskState, state) { + const provider = metamaskState.provider + let title, value + + if (networks[provider.type]) { + title = 'Current Network' + value = ethNetProps.props.getNetworkDisplayName(networks[provider.type].networkID) + } else { + title = 'Current RPC' + value = metamaskState.provider.rpcTarget + } + + return h('div', [ + h('span', {style: { fontWeight: 'bold', paddingRight: '10px'}}, title), + h('span', value), + provider.type === 'rpc' && h('button', { + onClick (event) { + event.preventDefault() + state.dispatch(actions.showDeleteRPC()) + }, + }, 'Delete'), + ]) +} diff --git a/ui/app/actions.js b/ui/app/actions.js index 7ac9d89f7..fddf7c270 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -2652,10 +2652,20 @@ function updateCurrentLocale (key) { } } -function setDProvider(key){ - return { - type: actions.SET_DPROVIDER, - value: key, +function setDProvider (val) { + return (dispatch) => { + dispatch(actions.showLoadingIndication()) + log.debug(`background.setDProvider`) + background.setDProvider(val, (err) => { + dispatch(actions.hideLoadingIndication()) + if (err) { + return dispatch(actions.displayWarning(err.message)) + } + }) + dispatch({ + type: actions.SET_DPROVIDER, + value: val, + }) } } diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js index 245519776..e19baa750 100644 --- a/ui/app/reducers/metamask.js +++ b/ui/app/reducers/metamask.js @@ -356,7 +356,9 @@ function reduceMetamask (state, action) { case actions.SET_DPROVIDER: return extend(metamaskState, { - dProvider: action.value + dProviderStore: { + dProvider : action.value, + }, }) case actions.SET_CURRENT_LOCALE: