From 8ff6826903cd714dcc95919d3f033366e100185b Mon Sep 17 00:00:00 2001
From: hackyminer <hackyminer@gmail.com>
Date: Wed, 6 Jun 2018 02:45:14 +0900
Subject: [PATCH 01/19] support chainid

 * fixed custom Rpc form to support optional chainid
---
 app/_locales/en/messages.json                 |  3 ++
 app/scripts/controllers/network/network.js    | 33 ++++++++++++++-----
 app/scripts/metamask-controller.js            |  4 +--
 old-ui/app/config.js                          | 30 ++++++++++++++---
 .../app/controllers/network-contoller-test.js |  2 +-
 ui/app/actions.js                             |  4 +--
 .../components/dropdowns/network-dropdown.js  | 12 ++++---
 .../settings-tab/settings-tab.component.js    | 22 ++++++++++---
 .../settings-tab/settings-tab.container.js    |  2 +-
 9 files changed, 85 insertions(+), 27 deletions(-)

diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index bf5854a310e0..f4d0ef97bef5 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -695,6 +695,9 @@
   "newRPC": {
     "message": "New RPC URL"
   },
+  "optionalChainId": {
+    "message": "ChainId (optional)"
+  },
   "next": {
     "message": "Next"
   },
diff --git a/app/scripts/controllers/network/network.js b/app/scripts/controllers/network/network.js
index c1667d9a677d..c92e3a63c1ca 100644
--- a/app/scripts/controllers/network/network.js
+++ b/app/scripts/controllers/network/network.js
@@ -11,6 +11,7 @@ const createInfuraClient = require('./createInfuraClient')
 const createJsonRpcClient = require('./createJsonRpcClient')
 const createLocalhostClient = require('./createLocalhostClient')
 const { createSwappableProxy, createEventEmitterProxy } = require('swappable-obj-proxy')
+const networks = { networkList: {} }
 
 const {
   ROPSTEN,
@@ -51,8 +52,8 @@ module.exports = class NetworkController extends EventEmitter {
 
   initializeProvider (providerParams) {
     this._baseProviderParams = providerParams
-    const { type, rpcTarget } = this.providerStore.getState()
-    this._configureProvider({ type, rpcTarget })
+    const { type, rpcTarget, chainId } = this.providerStore.getState()
+    this._configureProvider({ type, rpcTarget, chainId })
     this.lookupNetwork()
   }
 
@@ -72,7 +73,16 @@ module.exports = class NetworkController extends EventEmitter {
     return this.networkStore.getState()
   }
 
-  setNetworkState (network) {
+  setNetworkState (network, type) {
+    if (network === 'loading') {
+      return this.networkStore.putState(network)
+    }
+
+    // type must be defined
+    if (!type) {
+      return
+    }
+    network = networks.networkList[type] && networks.networkList[type].chainId ? networks.networkList[type].chainId : network
     return this.networkStore.putState(network)
   }
 
@@ -85,18 +95,20 @@ module.exports = class NetworkController extends EventEmitter {
     if (!this._provider) {
       return log.warn('NetworkController - lookupNetwork aborted due to missing provider')
     }
+    var { type } = this.providerStore.getState()
     const ethQuery = new EthQuery(this._provider)
     ethQuery.sendAsync({ method: 'net_version' }, (err, network) => {
       if (err) return this.setNetworkState('loading')
       log.info('web3.getNetwork returned ' + network)
-      this.setNetworkState(network)
+      this.setNetworkState(network, type)
     })
   }
 
-  setRpcTarget (rpcTarget) {
+  setRpcTarget (rpcTarget, chainId) {
     const providerConfig = {
       type: 'rpc',
       rpcTarget,
+      chainId,
     }
     this.providerConfig = providerConfig
   }
@@ -132,7 +144,7 @@ module.exports = class NetworkController extends EventEmitter {
   }
 
   _configureProvider (opts) {
-    const { type, rpcTarget } = opts
+    const { type, rpcTarget, chainId } = opts
     // infura type-based endpoints
     const isInfura = INFURA_PROVIDER_TYPES.includes(type)
     if (isInfura) {
@@ -142,7 +154,7 @@ module.exports = class NetworkController extends EventEmitter {
       this._configureLocalhostProvider()
     // url-based rpc endpoints
     } else if (type === 'rpc') {
-      this._configureStandardProvider({ rpcUrl: rpcTarget })
+      this._configureStandardProvider({ rpcUrl: rpcTarget, chainId })
     } else {
       throw new Error(`NetworkController - _configureProvider - unknown type "${type}"`)
     }
@@ -160,9 +172,14 @@ module.exports = class NetworkController extends EventEmitter {
     this._setNetworkClient(networkClient)
   }
 
-  _configureStandardProvider ({ rpcUrl }) {
+  _configureStandardProvider ({ rpcUrl, chainId }) {
     log.info('NetworkController - configureStandardProvider', rpcUrl)
     const networkClient = createJsonRpcClient({ rpcUrl })
+    // hack to add a 'rpc' network with chainId
+    networks.networkList['rpc'] = {
+      chainId: chainId,
+      rpcUrl,
+    }
     this._setNetworkClient(networkClient)
   }
 
diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js
index 7913662d4033..d329ab3314a7 100644
--- a/app/scripts/metamask-controller.js
+++ b/app/scripts/metamask-controller.js
@@ -1456,8 +1456,8 @@ module.exports = class MetamaskController extends EventEmitter {
    * @param {string} rpcTarget - A URL for a valid Ethereum RPC API.
    * @returns {Promise<String>} - The RPC Target URL confirmed.
    */
-  async setCustomRpc (rpcTarget) {
-    this.networkController.setRpcTarget(rpcTarget)
+  async setCustomRpc (rpcTarget, chainId) {
+    this.networkController.setRpcTarget(rpcTarget, chainId)
     await this.preferencesController.addToFrequentRpcList(rpcTarget)
     return rpcTarget
   }
diff --git a/old-ui/app/config.js b/old-ui/app/config.js
index 392a6dba7c1b..1203524ea6d6 100644
--- a/old-ui/app/config.js
+++ b/old-ui/app/config.js
@@ -68,7 +68,7 @@ ConfigScreen.prototype.render = function () {
 
           currentProviderDisplay(metamaskState),
 
-          h('div', { style: {display: 'flex'} }, [
+          h('div', { style: {display: 'block'} }, [
             h('input#new_rpc', {
               placeholder: 'New RPC URL',
               style: {
@@ -81,7 +81,26 @@ ConfigScreen.prototype.render = function () {
                 if (event.key === 'Enter') {
                   var element = event.target
                   var newRpc = element.value
-                  rpcValidation(newRpc, state)
+                  var chainid = document.querySelector('input#chainid')
+                  rpcValidation(newRpc, chainid.value, state)
+                }
+              },
+            }),
+            h('br'),
+            h('input#chainid', {
+              placeholder: 'ChainId (optional)',
+              style: {
+                width: 'inherit',
+                flex: '1 0 auto',
+                height: '30px',
+                margin: '8px',
+              },
+              onKeyPress (event) {
+                if (event.key === 'Enter') {
+                  var element = document.querySelector('input#new_rpc')
+                  var newRpc = element.value
+                  var chainid = document.querySelector('input#chainid')
+                  rpcValidation(newRpc, chainid.value, state)
                 }
               },
             }),
@@ -93,7 +112,8 @@ ConfigScreen.prototype.render = function () {
                 event.preventDefault()
                 var element = document.querySelector('input#new_rpc')
                 var newRpc = element.value
-                rpcValidation(newRpc, state)
+                var chainid = document.querySelector('input#chainid')
+                rpcValidation(newRpc, chainid.value, state)
               },
             }, 'Save'),
           ]),
@@ -189,9 +209,9 @@ ConfigScreen.prototype.render = function () {
   )
 }
 
-function rpcValidation (newRpc, state) {
+function rpcValidation (newRpc, chainid, state) {
   if (validUrl.isWebUri(newRpc)) {
-    state.dispatch(actions.setRpcTarget(newRpc))
+    state.dispatch(actions.setRpcTarget(newRpc, chainid))
   } else {
     var appendedRpc = `http://${newRpc}`
     if (validUrl.isWebUri(appendedRpc)) {
diff --git a/test/unit/app/controllers/network-contoller-test.js b/test/unit/app/controllers/network-contoller-test.js
index 822311931e67..7959e6cc1265 100644
--- a/test/unit/app/controllers/network-contoller-test.js
+++ b/test/unit/app/controllers/network-contoller-test.js
@@ -47,7 +47,7 @@ describe('# Network Controller', function () {
 
     describe('#setNetworkState', function () {
       it('should update the network', function () {
-        networkController.setNetworkState(1)
+        networkController.setNetworkState(1, 'rpc')
         const networkState = networkController.getNetworkState()
         assert.equal(networkState, 1, 'network is 1')
       })
diff --git a/ui/app/actions.js b/ui/app/actions.js
index f8a375e2feb4..2c7f969153d2 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -1874,10 +1874,10 @@ function updateProviderType (type) {
   }
 }
 
-function setRpcTarget (newRpc) {
+function setRpcTarget (newRpc, chainId) {
   return (dispatch) => {
     log.debug(`background.setRpcTarget: ${newRpc}`)
-    background.setCustomRpc(newRpc, (err, result) => {
+    background.setCustomRpc(newRpc, chainId, (err, result) => {
       if (err) {
         log.error(err)
         return dispatch(actions.displayWarning('Had a problem changing networks!'))
diff --git a/ui/app/components/dropdowns/network-dropdown.js b/ui/app/components/dropdowns/network-dropdown.js
index b252b25d96d7..8ae724e06f36 100644
--- a/ui/app/components/dropdowns/network-dropdown.js
+++ b/ui/app/components/dropdowns/network-dropdown.js
@@ -26,6 +26,7 @@ function mapStateToProps (state) {
     provider: state.metamask.provider,
     frequentRpcList: state.metamask.frequentRpcList || [],
     networkDropdownOpen: state.appState.networkDropdownOpen,
+    network: state.metamask.network,
   }
 }
 
@@ -40,8 +41,8 @@ function mapDispatchToProps (dispatch) {
     setDefaultRpcTarget: type => {
       dispatch(actions.setDefaultRpcTarget(type))
     },
-    setRpcTarget: (target) => {
-      dispatch(actions.setRpcTarget(target))
+    setRpcTarget: (target, network) => {
+      dispatch(actions.setRpcTarget(target, network))
     },
     delRpcTarget: (target) => {
       dispatch(actions.delRpcTarget(target))
@@ -276,6 +277,8 @@ NetworkDropdown.prototype.getNetworkName = function () {
 NetworkDropdown.prototype.renderCommonRpc = function (rpcList, provider) {
   const props = this.props
   const reversedRpcList = rpcList.slice().reverse()
+  const rpcTarget = provider.rpcTarget
+  const network = props.network
 
   return reversedRpcList.map((rpc) => {
     const currentRpcTarget = provider.type === 'rpc' && rpc === provider.rpcTarget
@@ -288,7 +291,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcList, provider) {
         {
           key: `common${rpc}`,
           closeMenu: () => this.props.hideNetworkDropdown(),
-          onClick: () => props.setRpcTarget(rpc),
+          onClick: () => props.setRpcTarget(rpc, network),
           style: {
             fontSize: '16px',
             lineHeight: '20px',
@@ -319,6 +322,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcList, provider) {
 NetworkDropdown.prototype.renderCustomOption = function (provider) {
   const { rpcTarget, type } = provider
   const props = this.props
+  const network = props.network
 
   if (type !== 'rpc') return null
 
@@ -332,7 +336,7 @@ NetworkDropdown.prototype.renderCustomOption = function (provider) {
         DropdownMenuItem,
         {
           key: rpcTarget,
-          onClick: () => props.setRpcTarget(rpcTarget),
+          onClick: () => props.setRpcTarget(rpcTarget, network),
           closeMenu: () => this.props.hideNetworkDropdown(),
           style: {
             fontSize: '16px',
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
index a9e2a723e867..70a78f1f4c64 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
@@ -121,7 +121,7 @@ export default class SettingsTab extends PureComponent {
 
   renderNewRpcUrl () {
     const { t } = this.context
-    const { newRpc } = this.state
+    const { newRpc, chainId } = this.state
 
     return (
       <div className="settings-page__content-row">
@@ -144,11 +144,25 @@ export default class SettingsTab extends PureComponent {
               fullWidth
               margin="none"
             />
+            <TextField
+              type="text"
+              id="chainid"
+              placeholder={t('optionalChainId')}
+              value={chainId}
+              onChange={e => this.setState({ chainId: e.target.value })}
+              onKeyPress={e => {
+                if (e.key === 'Enter') {
+                  this.validateRpc(newRpc, chainId)
+                }
+              }}
+              fullWidth
+              margin="none"
+            />
             <div
               className="settings-tab__rpc-save-button"
               onClick={e => {
                 e.preventDefault()
-                this.validateRpc(newRpc)
+                this.validateRpc(newRpc, chainId)
               }}
             >
               { t('save') }
@@ -159,11 +173,11 @@ export default class SettingsTab extends PureComponent {
     )
   }
 
-  validateRpc (newRpc) {
+  validateRpc (newRpc, chainId) {
     const { setRpcTarget, displayWarning } = this.props
 
     if (validUrl.isWebUri(newRpc)) {
-      setRpcTarget(newRpc)
+      setRpcTarget(newRpc, chainId)
     } else {
       const appendedRpc = `http://${newRpc}`
 
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
index de30f309c64c..46ebacb2cbad 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
@@ -44,7 +44,7 @@ const mapStateToProps = state => {
 const mapDispatchToProps = dispatch => {
   return {
     setCurrentCurrency: currency => dispatch(setCurrentCurrency(currency)),
-    setRpcTarget: newRpc => dispatch(setRpcTarget(newRpc)),
+    setRpcTarget: (newRpc, chainId) => dispatch(setRpcTarget(newRpc, chainId)),
     displayWarning: warning => dispatch(displayWarning(warning)),
     revealSeedConfirmation: () => dispatch(revealSeedConfirmation()),
     setUseBlockie: value => dispatch(setUseBlockie(value)),

From 8e7fcbf17c82082013a82b72aa12cd436e4b77c0 Mon Sep 17 00:00:00 2001
From: hackyminer <hackyminer@gmail.com>
Date: Wed, 1 Aug 2018 17:05:06 +0900
Subject: [PATCH 02/19] update rpcList correctly

 * rename frequentRpcList to frequentRpcListDetail to prevent compatible issue
---
 app/scripts/controllers/preferences.js        | 27 ++++++++++---------
 app/scripts/metamask-controller.js            |  3 ++-
 old-ui/app/app.js                             |  2 +-
 old-ui/app/components/app-bar.js              | 13 ++++-----
 ui/app/app.js                                 |  8 +++---
 .../components/dropdowns/network-dropdown.js  | 17 ++++++------
 6 files changed, 37 insertions(+), 33 deletions(-)

diff --git a/app/scripts/controllers/preferences.js b/app/scripts/controllers/preferences.js
index 20b13398c31b..96e5adaecb54 100644
--- a/app/scripts/controllers/preferences.js
+++ b/app/scripts/controllers/preferences.js
@@ -25,7 +25,7 @@ class PreferencesController {
    */
   constructor (opts = {}) {
     const initState = extend({
-      frequentRpcList: [],
+      frequentRpcListDetail: [],
       currentAccountTab: 'history',
       accountTokens: {},
       assetImages: {},
@@ -392,19 +392,20 @@ class PreferencesController {
    * Adds custom RPC url to state.
    *
    * @param {string} url The RPC url to add to frequentRpcList.
+   * @param {number} chainId Optional chainId of the selected network.
    * @returns {Promise<array>} Promise resolving to updated frequentRpcList.
    *
    */
-  addToFrequentRpcList (url) {
-    const rpcList = this.getFrequentRpcList()
-    const index = rpcList.findIndex((element) => { return element === url })
+  addToFrequentRpcList (url, chainId) {
+    const rpcList = this.getFrequentRpcListDetail()
+    const index = rpcList.findIndex((element) => { return element.rpcUrl === url })
     if (index !== -1) {
       rpcList.splice(index, 1)
     }
     if (url !== 'http://localhost:8545') {
-      rpcList.push(url)
+      rpcList.push({ rpcUrl: url, chainId })
     }
-    this.store.updateState({ frequentRpcList: rpcList })
+    this.store.updateState({ frequentRpcListiDetail: rpcList })
     return Promise.resolve(rpcList)
   }
 
@@ -416,23 +417,23 @@ class PreferencesController {
    *
    */
   removeFromFrequentRpcList (url) {
-    const rpcList = this.getFrequentRpcList()
-    const index = rpcList.findIndex((element) => { return element === url })
+    const rpcList = this.getFrequentRpcListDetail()
+    const index = rpcList.findIndex((element) => { return element.rpcUrl === url })
     if (index !== -1) {
       rpcList.splice(index, 1)
     }
-    this.store.updateState({ frequentRpcList: rpcList })
+    this.store.updateState({ frequentRpcListDetail: rpcList })
     return Promise.resolve(rpcList)
   }
 
   /**
-   * Getter for the `frequentRpcList` property.
+   * Getter for the `frequentRpcListDetail` property.
    *
-   * @returns {array<string>} An array of one or two rpc urls.
+   * @returns {array<array>} An array of rpc urls.
    *
    */
-  getFrequentRpcList () {
-    return this.store.getState().frequentRpcList
+  getFrequentRpcListDetail () {
+    return this.store.getState().frequentRpcListDetail
   }
 
   /**
diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js
index d329ab3314a7..1cde99218640 100644
--- a/app/scripts/metamask-controller.js
+++ b/app/scripts/metamask-controller.js
@@ -1454,11 +1454,12 @@ module.exports = class MetamaskController extends EventEmitter {
   /**
    * A method for selecting a custom URL for an ethereum RPC provider.
    * @param {string} rpcTarget - A URL for a valid Ethereum RPC API.
+   * @param {number} chainId - The chainId of the selected network.
    * @returns {Promise<String>} - The RPC Target URL confirmed.
    */
   async setCustomRpc (rpcTarget, chainId) {
     this.networkController.setRpcTarget(rpcTarget, chainId)
-    await this.preferencesController.addToFrequentRpcList(rpcTarget)
+    await this.preferencesController.addToFrequentRpcList(rpcTarget, chainId)
     return rpcTarget
   }
 
diff --git a/old-ui/app/app.js b/old-ui/app/app.js
index 9be21ebadbd5..f5e03d4f6ffa 100644
--- a/old-ui/app/app.js
+++ b/old-ui/app/app.js
@@ -73,7 +73,7 @@ function mapStateToProps (state) {
     forgottenPassword: state.appState.forgottenPassword,
     nextUnreadNotice: state.metamask.nextUnreadNotice,
     lostAccounts: state.metamask.lostAccounts,
-    frequentRpcList: state.metamask.frequentRpcList || [],
+    frequentRpcListDetail: state.metamask.frequentRpcListDetail || [],
     featureFlags,
     suggestedTokens: state.metamask.suggestedTokens,
 
diff --git a/old-ui/app/components/app-bar.js b/old-ui/app/components/app-bar.js
index 234c06a01791..2642ffca23cb 100644
--- a/old-ui/app/components/app-bar.js
+++ b/old-ui/app/components/app-bar.js
@@ -17,7 +17,7 @@ module.exports = class AppBar extends Component {
 
   static propTypes = {
     dispatch: PropTypes.func.isRequired,
-    frequentRpcList: PropTypes.array.isRequired,
+    frequentRpcListDetail: PropTypes.array.isRequired,
     isMascara: PropTypes.bool.isRequired,
     isOnboarding: PropTypes.bool.isRequired,
     identities: PropTypes.any.isRequired,
@@ -196,7 +196,7 @@ module.exports = class AppBar extends Component {
   renderNetworkDropdown () {
     const {
       dispatch,
-      frequentRpcList: rpcList,
+      frequentRpcListDetail: rpcList,
       provider,
     } = this.props
     const {
@@ -322,7 +322,7 @@ module.exports = class AppBar extends Component {
   }
 
   renderCustomOption ({ rpcTarget, type }) {
-    const {dispatch} = this.props
+    const {dispatch, network} = this.props
 
     if (type !== 'rpc') {
       return null
@@ -340,7 +340,7 @@ module.exports = class AppBar extends Component {
       default:
         return h(DropdownMenuItem, {
           key: rpcTarget,
-          onClick: () => dispatch(actions.setRpcTarget(rpcTarget)),
+          onClick: () => dispatch(actions.setRpcTarget(rpcTarget, network)),
           closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
         }, [
           h('i.fa.fa-question-circle.fa-lg.menu-icon'),
@@ -354,7 +354,8 @@ module.exports = class AppBar extends Component {
     const {dispatch} = this.props
     const reversedRpcList = rpcList.slice().reverse()
 
-    return reversedRpcList.map((rpc) => {
+    return reversedRpcList.map((entry) => {
+      const rpc = entry.rpcUrl
       const currentRpcTarget = provider.type === 'rpc' && rpc === provider.rpcTarget
 
       if ((rpc === LOCALHOST_RPC_URL) || currentRpcTarget) {
@@ -363,7 +364,7 @@ module.exports = class AppBar extends Component {
         return h(DropdownMenuItem, {
           key: `common${rpc}`,
           closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
-          onClick: () => dispatch(actions.setRpcTarget(rpc)),
+          onClick: () => dispatch(actions.setRpcTarget(rpc, entry.chainId)),
         }, [
           h('i.fa.fa-question-circle.fa-lg.menu-icon'),
           rpc,
diff --git a/ui/app/app.js b/ui/app/app.js
index aeb3d05ee35d..b3aff1f39373 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -101,7 +101,7 @@ class App extends Component {
       network,
       isMouseUser,
       provider,
-      frequentRpcList,
+      frequentRpcListDetail,
       currentView,
       setMouseUserState,
       sidebar,
@@ -147,7 +147,7 @@ class App extends Component {
         // network dropdown
         h(NetworkDropdown, {
           provider,
-          frequentRpcList,
+          frequentRpcListDetail,
         }, []),
 
         h(AccountMenu),
@@ -230,7 +230,7 @@ App.propTypes = {
   alertMessage: PropTypes.string,
   network: PropTypes.string,
   provider: PropTypes.object,
-  frequentRpcList: PropTypes.array,
+  frequentRpcListDetail: PropTypes.array,
   currentView: PropTypes.object,
   sidebar: PropTypes.object,
   alertOpen: PropTypes.bool,
@@ -322,7 +322,7 @@ function mapStateToProps (state) {
     forgottenPassword: state.appState.forgottenPassword,
     nextUnreadNotice,
     lostAccounts,
-    frequentRpcList: state.metamask.frequentRpcList || [],
+    frequentRpcListDetail: state.metamask.frequentRpcListDetail || [],
     currentCurrency: state.metamask.currentCurrency,
     isMouseUser: state.appState.isMouseUser,
     betaUI: state.metamask.featureFlags.betaUI,
diff --git a/ui/app/components/dropdowns/network-dropdown.js b/ui/app/components/dropdowns/network-dropdown.js
index 8ae724e06f36..b9b4a9b258ee 100644
--- a/ui/app/components/dropdowns/network-dropdown.js
+++ b/ui/app/components/dropdowns/network-dropdown.js
@@ -24,7 +24,7 @@ const notToggleElementClassnames = [
 function mapStateToProps (state) {
   return {
     provider: state.metamask.provider,
-    frequentRpcList: state.metamask.frequentRpcList || [],
+    frequentRpcListDetail: state.metamask.frequentRpcListDetail || [],
     networkDropdownOpen: state.appState.networkDropdownOpen,
     network: state.metamask.network,
   }
@@ -72,7 +72,7 @@ module.exports = compose(
 NetworkDropdown.prototype.render = function () {
   const props = this.props
   const { provider: { type: providerType, rpcTarget: activeNetwork } } = props
-  const rpcList = props.frequentRpcList
+  const rpcListDetail = props.frequentRpcListDetail
   const isOpen = this.props.networkDropdownOpen
   const dropdownMenuItemStyle = {
     fontSize: '16px',
@@ -226,7 +226,7 @@ NetworkDropdown.prototype.render = function () {
     ),
 
     this.renderCustomOption(props.provider),
-    this.renderCommonRpc(rpcList, props.provider),
+    this.renderCommonRpc(rpcListDetail, props.provider),
 
     h(
       DropdownMenuItem,
@@ -274,24 +274,25 @@ NetworkDropdown.prototype.getNetworkName = function () {
   return name
 }
 
-NetworkDropdown.prototype.renderCommonRpc = function (rpcList, provider) {
+NetworkDropdown.prototype.renderCommonRpc = function (rpcListDetail, provider) {
   const props = this.props
-  const reversedRpcList = rpcList.slice().reverse()
-  const rpcTarget = provider.rpcTarget
+  const reversedRpcListDetail = rpcListDetail.slice().reverse()
   const network = props.network
 
-  return reversedRpcList.map((rpc) => {
+  return reversedRpcListDetail.map((entry) => {
+    const rpc = entry.rpcUrl
     const currentRpcTarget = provider.type === 'rpc' && rpc === provider.rpcTarget
 
     if ((rpc === 'http://localhost:8545') || currentRpcTarget) {
       return null
     } else {
+      const chainId = entry.chainId || network
       return h(
         DropdownMenuItem,
         {
           key: `common${rpc}`,
           closeMenu: () => this.props.hideNetworkDropdown(),
-          onClick: () => props.setRpcTarget(rpc, network),
+          onClick: () => props.setRpcTarget(rpc, chainId),
           style: {
             fontSize: '16px',
             lineHeight: '20px',

From fb33c45e373a557dee16f61fb4d555b53a4dc27e Mon Sep 17 00:00:00 2001
From: HackyMiner <hackyminer@gmail.com>
Date: Mon, 27 Aug 2018 23:54:34 +0900
Subject: [PATCH 03/19] customRpc with configurable ticker symbol, price info
 using https://min-api.cryptocompare.com conditionally

---
 app/_locales/en/messages.json                 |  3 ++
 app/scripts/controllers/currency.js           | 43 ++++++++++++++++---
 app/scripts/controllers/network/network.js    | 37 +++++++++++++---
 app/scripts/controllers/preferences.js        |  2 +-
 app/scripts/metamask-controller.js            | 12 ++++--
 old-ui/app/components/app-bar.js              |  6 +--
 old-ui/app/components/balance.js              | 11 ++++-
 old-ui/app/components/eth-balance.js          | 12 ++++--
 old-ui/app/config.js                          | 32 +++++++++++---
 old-ui/app/util.js                            |  8 ++--
 ui/app/actions.js                             |  6 +--
 ui/app/components/account-menu/index.js       |  2 +
 ui/app/components/balance-component.js        |  4 +-
 .../currency-display.container.js             |  5 ++-
 .../dropdowns/components/account-dropdowns.js |  6 ++-
 .../components/dropdowns/network-dropdown.js  | 11 ++---
 ui/app/components/eth-balance.js              | 12 ++++--
 .../settings-tab/settings-tab.component.js    | 26 ++++++++---
 .../settings-tab/settings-tab.container.js    |  3 +-
 ...-preferenced-currency-display.container.js |  3 +-
 ui/app/util.js                                |  8 ++--
 21 files changed, 191 insertions(+), 61 deletions(-)

diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index f4d0ef97bef5..236019de9cdc 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -698,6 +698,9 @@
   "optionalChainId": {
     "message": "ChainId (optional)"
   },
+  "optionalSymbol": {
+    "message": "Symbol (optional)"
+  },
   "next": {
     "message": "Next"
   },
diff --git a/app/scripts/controllers/currency.js b/app/scripts/controllers/currency.js
index d5bc5fe2bb9a..d6f90e1bc0ba 100644
--- a/app/scripts/controllers/currency.js
+++ b/app/scripts/controllers/currency.js
@@ -25,6 +25,7 @@ class CurrencyController {
    */
   constructor (opts = {}) {
     const initState = extend({
+      fromCurrency: 'ETH',
       currentCurrency: 'usd',
       conversionRate: 0,
       conversionDate: 'N/A',
@@ -36,6 +37,26 @@ class CurrencyController {
   // PUBLIC METHODS
   //
 
+  /**
+   * A getter for the fromCurrency property
+   *
+   * @returns {string} A 2-4 character shorthand that describes the specific currency
+   *
+   */
+  getFromCurrency () {
+    return this.store.getState().fromCurrency
+  }
+
+  /**
+   * A setter for the fromCurrency property
+   *
+   * @param {string} fromCurrency The new currency to set as the fromCurrency in the store
+   *
+   */
+  setFromCurrency (fromCurrency) {
+    this.store.updateState({ ticker: fromCurrency, fromCurrency })
+  }
+
   /**
    * A getter for the currentCurrency property
    *
@@ -104,15 +125,27 @@ class CurrencyController {
    *
    */
   async updateConversionRate () {
-    let currentCurrency
+    let currentCurrency, fromCurrency
     try {
       currentCurrency = this.getCurrentCurrency()
-      const response = await fetch(`https://api.infura.io/v1/ticker/eth${currentCurrency.toLowerCase()}`)
+      fromCurrency = this.getFromCurrency()
+      let apiUrl
+      if (fromCurrency === 'ETH') {
+        apiUrl = `https://api.infura.io/v1/ticker/eth${currentCurrency.toLowerCase()}`
+      } else {
+        apiUrl = `https://min-api.cryptocompare.com/data/price?fsym=${fromCurrency.toUpperCase()}&tsyms=${currentCurrency.toUpperCase()}`
+      }
+      const response = await fetch(apiUrl)
       const parsedResponse = await response.json()
-      this.setConversionRate(Number(parsedResponse.bid))
-      this.setConversionDate(Number(parsedResponse.timestamp))
+      if (fromCurrency === 'ETH') {
+        this.setConversionRate(Number(parsedResponse.bid))
+        this.setConversionDate(Number(parsedResponse.timestamp))
+      } else {
+        this.setConversionRate(Number(parsedResponse[currentCurrency.toUpperCase()]))
+        this.setConversionDate(parseInt((new Date()).getTime() / 1000))
+      }
     } catch (err) {
-      log.warn(`MetaMask - Failed to query currency conversion:`, currentCurrency, err)
+      log.warn(`MetaMask - Failed to query currency conversion:`, fromCurrency, currentCurrency, err)
       this.setConversionRate(0)
       this.setConversionDate('N/A')
     }
diff --git a/app/scripts/controllers/network/network.js b/app/scripts/controllers/network/network.js
index c92e3a63c1ca..45e860910189 100644
--- a/app/scripts/controllers/network/network.js
+++ b/app/scripts/controllers/network/network.js
@@ -11,6 +11,7 @@ const createInfuraClient = require('./createInfuraClient')
 const createJsonRpcClient = require('./createJsonRpcClient')
 const createLocalhostClient = require('./createLocalhostClient')
 const { createSwappableProxy, createEventEmitterProxy } = require('swappable-obj-proxy')
+const extend = require('extend')
 const networks = { networkList: {} }
 
 const {
@@ -30,6 +31,10 @@ const defaultProviderConfig = {
   type: testMode ? RINKEBY : MAINNET,
 }
 
+const defaultNetworkConfig = {
+  ticker: 'ETH',
+}
+
 module.exports = class NetworkController extends EventEmitter {
 
   constructor (opts = {}) {
@@ -40,7 +45,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 })
+    this.networkConfig = new ObservableStore(defaultNetworkConfig)
+    this.store = new ComposedStore({ provider: this.providerStore, network: this.networkStore, settings: this.networkConfig })
     this.on('networkDidChange', this.lookupNetwork)
     // provider and block tracker
     this._provider = null
@@ -52,8 +58,8 @@ module.exports = class NetworkController extends EventEmitter {
 
   initializeProvider (providerParams) {
     this._baseProviderParams = providerParams
-    const { type, rpcTarget, chainId } = this.providerStore.getState()
-    this._configureProvider({ type, rpcTarget, chainId })
+    const { type, rpcTarget, chainId, ticker } = this.providerStore.getState()
+    this._configureProvider({ type, rpcTarget, chainId, ticker })
     this.lookupNetwork()
   }
 
@@ -73,6 +79,10 @@ module.exports = class NetworkController extends EventEmitter {
     return this.networkStore.getState()
   }
 
+  getNetworkConfig () {
+    return this.networkConfig.getState()
+  }
+
   setNetworkState (network, type) {
     if (network === 'loading') {
       return this.networkStore.putState(network)
@@ -104,11 +114,12 @@ module.exports = class NetworkController extends EventEmitter {
     })
   }
 
-  setRpcTarget (rpcTarget, chainId) {
+  setRpcTarget (rpcTarget, chainId, ticker = 'ETH') {
     const providerConfig = {
       type: 'rpc',
       rpcTarget,
       chainId,
+      ticker,
     }
     this.providerConfig = providerConfig
   }
@@ -144,7 +155,7 @@ module.exports = class NetworkController extends EventEmitter {
   }
 
   _configureProvider (opts) {
-    const { type, rpcTarget, chainId } = opts
+    const { type, rpcTarget, chainId, ticker } = opts
     // infura type-based endpoints
     const isInfura = INFURA_PROVIDER_TYPES.includes(type)
     if (isInfura) {
@@ -154,7 +165,7 @@ module.exports = class NetworkController extends EventEmitter {
       this._configureLocalhostProvider()
     // url-based rpc endpoints
     } else if (type === 'rpc') {
-      this._configureStandardProvider({ rpcUrl: rpcTarget, chainId })
+      this._configureStandardProvider({ rpcUrl: rpcTarget, chainId, ticker })
     } else {
       throw new Error(`NetworkController - _configureProvider - unknown type "${type}"`)
     }
@@ -164,6 +175,11 @@ module.exports = class NetworkController extends EventEmitter {
     log.info('NetworkController - configureInfuraProvider', type)
     const networkClient = createInfuraClient({ network: type })
     this._setNetworkClient(networkClient)
+    // setup networkConfig
+    var settings = {
+      ticker: 'ETH',
+    }
+    this.networkConfig.putState(settings)
   }
 
   _configureLocalhostProvider () {
@@ -172,14 +188,21 @@ module.exports = class NetworkController extends EventEmitter {
     this._setNetworkClient(networkClient)
   }
 
-  _configureStandardProvider ({ rpcUrl, chainId }) {
+  _configureStandardProvider ({ rpcUrl, chainId, ticker }) {
     log.info('NetworkController - configureStandardProvider', rpcUrl)
     const networkClient = createJsonRpcClient({ rpcUrl })
     // hack to add a 'rpc' network with chainId
     networks.networkList['rpc'] = {
       chainId: chainId,
       rpcUrl,
+      ticker,
+    }
+    // setup networkConfig
+    var settings = {
+      network: chainId,
     }
+    settings = extend(settings, networks.networkList['rpc'])
+    this.networkConfig.putState(settings)
     this._setNetworkClient(networkClient)
   }
 
diff --git a/app/scripts/controllers/preferences.js b/app/scripts/controllers/preferences.js
index 96e5adaecb54..769f3ea22d5d 100644
--- a/app/scripts/controllers/preferences.js
+++ b/app/scripts/controllers/preferences.js
@@ -396,7 +396,7 @@ class PreferencesController {
    * @returns {Promise<array>} Promise resolving to updated frequentRpcList.
    *
    */
-  addToFrequentRpcList (url, chainId) {
+  addToFrequentRpcList (url, chainId, ticker) {
     const rpcList = this.getFrequentRpcListDetail()
     const index = rpcList.findIndex((element) => { return element.rpcUrl === url })
     if (index !== -1) {
diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js
index 1cde99218640..44afbf62aea5 100644
--- a/app/scripts/metamask-controller.js
+++ b/app/scripts/metamask-controller.js
@@ -197,6 +197,8 @@ module.exports = class MetamaskController extends EventEmitter {
     })
     this.networkController.on('networkDidChange', () => {
       this.balancesController.updateAllBalances()
+      var currentCurrency = this.currencyController.getCurrentCurrency()
+      this.setCurrentCurrency(currentCurrency, function() {})
     })
     this.balancesController.updateAllBalances()
 
@@ -1412,10 +1414,13 @@ module.exports = class MetamaskController extends EventEmitter {
    * @param {Function} cb - A callback function returning currency info.
    */
   setCurrentCurrency (currencyCode, cb) {
+    const { ticker } = this.networkController.getNetworkConfig()
     try {
+      this.currencyController.setFromCurrency(ticker)
       this.currencyController.setCurrentCurrency(currencyCode)
       this.currencyController.updateConversionRate()
       const data = {
+        fromCurrency: ticker || 'ETH',
         conversionRate: this.currencyController.getConversionRate(),
         currentCurrency: this.currencyController.getCurrentCurrency(),
         conversionDate: this.currencyController.getConversionDate(),
@@ -1455,11 +1460,12 @@ module.exports = class MetamaskController extends EventEmitter {
    * A method for selecting a custom URL for an ethereum RPC provider.
    * @param {string} rpcTarget - A URL for a valid Ethereum RPC API.
    * @param {number} chainId - The chainId of the selected network.
+   * @param {string} ticker - The ticker symbol of the selected network.
    * @returns {Promise<String>} - The RPC Target URL confirmed.
    */
-  async setCustomRpc (rpcTarget, chainId) {
-    this.networkController.setRpcTarget(rpcTarget, chainId)
-    await this.preferencesController.addToFrequentRpcList(rpcTarget, chainId)
+  async setCustomRpc (rpcTarget, chainId, ticker = 'ETH') {
+    this.networkController.setRpcTarget(rpcTarget, chainId, ticker)
+    await this.preferencesController.addToFrequentRpcList(rpcTarget, chainId, ticker)
     return rpcTarget
   }
 
diff --git a/old-ui/app/components/app-bar.js b/old-ui/app/components/app-bar.js
index 2642ffca23cb..fa8e499ed4bb 100644
--- a/old-ui/app/components/app-bar.js
+++ b/old-ui/app/components/app-bar.js
@@ -321,7 +321,7 @@ module.exports = class AppBar extends Component {
     ])
   }
 
-  renderCustomOption ({ rpcTarget, type }) {
+  renderCustomOption ({ rpcTarget, type, ticker }) {
     const {dispatch, network} = this.props
 
     if (type !== 'rpc') {
@@ -340,7 +340,7 @@ module.exports = class AppBar extends Component {
       default:
         return h(DropdownMenuItem, {
           key: rpcTarget,
-          onClick: () => dispatch(actions.setRpcTarget(rpcTarget, network)),
+          onClick: () => dispatch(actions.setRpcTarget(rpcTarget, network, ticker)),
           closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
         }, [
           h('i.fa.fa-question-circle.fa-lg.menu-icon'),
@@ -364,7 +364,7 @@ module.exports = class AppBar extends Component {
         return h(DropdownMenuItem, {
           key: `common${rpc}`,
           closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
-          onClick: () => dispatch(actions.setRpcTarget(rpc, entry.chainId)),
+          onClick: () => dispatch(actions.setRpcTarget(rpc, entry.chainId, entry.ticker)),
         }, [
           h('i.fa.fa-question-circle.fa-lg.menu-icon'),
           rpc,
diff --git a/old-ui/app/components/balance.js b/old-ui/app/components/balance.js
index 57ca845649ee..8995f961fc16 100644
--- a/old-ui/app/components/balance.js
+++ b/old-ui/app/components/balance.js
@@ -1,12 +1,18 @@
 const Component = require('react').Component
 const h = require('react-hyperscript')
+const connect = require('react-redux').connect
 const inherits = require('util').inherits
 const formatBalance = require('../util').formatBalance
 const generateBalanceObject = require('../util').generateBalanceObject
 const Tooltip = require('./tooltip.js')
 const FiatValue = require('./fiat-value.js')
 
-module.exports = EthBalanceComponent
+module.exports = connect(mapStateToProps)(EthBalanceComponent)
+function mapStateToProps (state) {
+  return {
+    ticker: state.metamask.ticker,
+  }
+}
 
 inherits(EthBalanceComponent, Component)
 function EthBalanceComponent () {
@@ -16,9 +22,10 @@ function EthBalanceComponent () {
 EthBalanceComponent.prototype.render = function () {
   var props = this.props
   let { value } = props
+  const { ticker } = props
   var style = props.style
   var needsParse = this.props.needsParse !== undefined ? this.props.needsParse : true
-  value = value ? formatBalance(value, 6, needsParse) : '...'
+  value = value ? formatBalance(value, 6, needsParse, ticker) : '...'
   var width = props.width
 
   return (
diff --git a/old-ui/app/components/eth-balance.js b/old-ui/app/components/eth-balance.js
index 4f538fd31f31..4458e6a9a5d3 100644
--- a/old-ui/app/components/eth-balance.js
+++ b/old-ui/app/components/eth-balance.js
@@ -1,12 +1,18 @@
 const Component = require('react').Component
 const h = require('react-hyperscript')
+const connect = require('react-redux').connect
 const inherits = require('util').inherits
 const formatBalance = require('../util').formatBalance
 const generateBalanceObject = require('../util').generateBalanceObject
 const Tooltip = require('./tooltip.js')
 const FiatValue = require('./fiat-value.js')
 
-module.exports = EthBalanceComponent
+module.exports = connect(mapStateToProps)(EthBalanceComponent)
+function mapStateToProps (state) {
+  return {
+    ticker: state.metamask.ticker,
+  }
+}
 
 inherits(EthBalanceComponent, Component)
 function EthBalanceComponent () {
@@ -16,9 +22,9 @@ function EthBalanceComponent () {
 EthBalanceComponent.prototype.render = function () {
   var props = this.props
   let { value } = props
-  const { style, width } = props
+  const { ticker, style, width } = props
   var needsParse = this.props.needsParse !== undefined ? this.props.needsParse : true
-  value = value ? formatBalance(value, 6, needsParse) : '...'
+  value = value ? formatBalance(value, 6, needsParse, ticker) : '...'
 
   return (
 
diff --git a/old-ui/app/config.js b/old-ui/app/config.js
index 1203524ea6d6..d556eadfb3a4 100644
--- a/old-ui/app/config.js
+++ b/old-ui/app/config.js
@@ -82,7 +82,8 @@ ConfigScreen.prototype.render = function () {
                   var element = event.target
                   var newRpc = element.value
                   var chainid = document.querySelector('input#chainid')
-                  rpcValidation(newRpc, chainid.value, state)
+                  var ticker = document.querySelector('input#ticker')
+                  rpcValidation(newRpc, chainid.value, ticker.value, state)
                 }
               },
             }),
@@ -100,7 +101,27 @@ ConfigScreen.prototype.render = function () {
                   var element = document.querySelector('input#new_rpc')
                   var newRpc = element.value
                   var chainid = document.querySelector('input#chainid')
-                  rpcValidation(newRpc, chainid.value, state)
+                  var ticker = document.querySelector('input#ticker')
+                  rpcValidation(newRpc, chainid.value, ticker.value, state)
+                }
+              },
+            }),
+            h('br'),
+            h('input#ticker', {
+              placeholder: 'Symbol (optional)',
+              style: {
+                width: 'inherit',
+                flex: '1 0 auto',
+                height: '30px',
+                margin: '8px',
+              },
+              onKeyPress (event) {
+                if (event.key === 'Enter') {
+                  var element = document.querySelector('input#new_rpc')
+                  var newRpc = element.value
+                  var chainid = document.querySelector('input#chainid')
+                  var ticker = document.querySelector('input#ticker')
+                  rpcValidation(newRpc, chainid.value, ticker.value, state)
                 }
               },
             }),
@@ -113,7 +134,8 @@ ConfigScreen.prototype.render = function () {
                 var element = document.querySelector('input#new_rpc')
                 var newRpc = element.value
                 var chainid = document.querySelector('input#chainid')
-                rpcValidation(newRpc, chainid.value, state)
+                var ticker = document.querySelector('input#ticker')
+                rpcValidation(newRpc, chainid.value, ticker.value, state)
               },
             }, 'Save'),
           ]),
@@ -209,9 +231,9 @@ ConfigScreen.prototype.render = function () {
   )
 }
 
-function rpcValidation (newRpc, chainid, state) {
+function rpcValidation (newRpc, chainid, ticker, state) {
   if (validUrl.isWebUri(newRpc)) {
-    state.dispatch(actions.setRpcTarget(newRpc, chainid))
+    state.dispatch(actions.setRpcTarget(newRpc, chainid, ticker))
   } else {
     var appendedRpc = `http://${newRpc}`
     if (validUrl.isWebUri(appendedRpc)) {
diff --git a/old-ui/app/util.js b/old-ui/app/util.js
index 962832ce7e85..40e79b88c065 100644
--- a/old-ui/app/util.js
+++ b/old-ui/app/util.js
@@ -102,7 +102,7 @@ function parseBalance (balance) {
 
 // Takes wei hex, returns an object with three properties.
 // Its "formatted" property is what we generally use to render values.
-function formatBalance (balance, decimalsToKeep, needsParse = true) {
+function formatBalance (balance, decimalsToKeep, needsParse = true, ticker = 'ETH') {
   var parsed = needsParse ? parseBalance(balance) : balance.split('.')
   var beforeDecimal = parsed[0]
   var afterDecimal = parsed[1]
@@ -112,14 +112,14 @@ function formatBalance (balance, decimalsToKeep, needsParse = true) {
       if (afterDecimal !== '0') {
         var sigFigs = afterDecimal.match(/^0*(.{2})/) // default: grabs 2 most significant digits
         if (sigFigs) { afterDecimal = sigFigs[0] }
-        formatted = '0.' + afterDecimal + ' ETH'
+        formatted = '0.' + afterDecimal + ` ${ticker}`
       }
     } else {
-      formatted = beforeDecimal + '.' + afterDecimal.slice(0, 3) + ' ETH'
+      formatted = beforeDecimal + '.' + afterDecimal.slice(0, 3) + ` ${ticker}`
     }
   } else {
     afterDecimal += Array(decimalsToKeep).join('0')
-    formatted = beforeDecimal + '.' + afterDecimal.slice(0, decimalsToKeep) + ' ETH'
+    formatted = beforeDecimal + '.' + afterDecimal.slice(0, decimalsToKeep) + ` ${ticker}`
   }
   return formatted
 }
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 2c7f969153d2..caa5a6d4ab85 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -1874,10 +1874,10 @@ function updateProviderType (type) {
   }
 }
 
-function setRpcTarget (newRpc, chainId) {
+function setRpcTarget (newRpc, chainId, ticker = 'ETH') {
   return (dispatch) => {
-    log.debug(`background.setRpcTarget: ${newRpc}`)
-    background.setCustomRpc(newRpc, chainId, (err, result) => {
+    log.debug(`background.setRpcTarget: ${newRpc} ${chainId} ${ticker}`)
+    background.setCustomRpc(newRpc, chainId, ticker, (err, result) => {
       if (err) {
         log.error(err)
         return dispatch(actions.displayWarning('Had a problem changing networks!'))
diff --git a/ui/app/components/account-menu/index.js b/ui/app/components/account-menu/index.js
index c9c5b60e15aa..0126f5686167 100644
--- a/ui/app/components/account-menu/index.js
+++ b/ui/app/components/account-menu/index.js
@@ -40,6 +40,7 @@ function mapStateToProps (state) {
     selectedAddress: state.metamask.selectedAddress,
     isAccountMenuOpen: state.metamask.isAccountMenuOpen,
     keyrings: state.metamask.keyrings,
+    ticker: state.metamask.ticker,
     identities: state.metamask.identities,
     accounts: state.metamask.accounts,
   }
@@ -152,6 +153,7 @@ AccountMenu.prototype.renderAccounts = function () {
     identities,
     accounts,
     selectedAddress,
+    ticker,
     keyrings,
     showAccountDetail,
   } = this.props
diff --git a/ui/app/components/balance-component.js b/ui/app/components/balance-component.js
index c1b713ccd209..ab8e4e959f58 100644
--- a/ui/app/components/balance-component.js
+++ b/ui/app/components/balance-component.js
@@ -21,6 +21,7 @@ function mapStateToProps (state) {
   return {
     account,
     network,
+    ticker: state.metamask.ticker,
     conversionRate: conversionRateSelector(state),
     currentCurrency: getCurrentCurrency(state),
     assetImages: getAssetImages(state),
@@ -67,9 +68,10 @@ BalanceComponent.prototype.renderTokenBalance = function () {
 BalanceComponent.prototype.renderBalance = function () {
   const props = this.props
   const { account } = props
+  const { account, ticker } = props
   const balanceValue = account && account.balance
   const needsParse = 'needsParse' in props ? props.needsParse : true
-  const formattedBalance = balanceValue ? formatBalance(balanceValue, 6, needsParse) : '...'
+  const formattedBalance = balanceValue ? formatBalance(balanceValue, 6, needsParse, ticker) : '...'
   const showFiat = 'showFiat' in props ? props.showFiat : true
 
   if (formattedBalance === 'None' || formattedBalance === '...') {
diff --git a/ui/app/components/currency-display/currency-display.container.js b/ui/app/components/currency-display/currency-display.container.js
index 1b3fe74dabdd..8feb13b10c02 100644
--- a/ui/app/components/currency-display/currency-display.container.js
+++ b/ui/app/components/currency-display/currency-display.container.js
@@ -3,16 +3,17 @@ import CurrencyDisplay from './currency-display.component'
 import { getValueFromWeiHex, formatCurrency } from '../../helpers/confirm-transaction/util'
 
 const mapStateToProps = state => {
-  const { metamask: { currentCurrency, conversionRate } } = state
+  const { metamask: { fromCurrency, currentCurrency, conversionRate } } = state
 
   return {
     currentCurrency,
     conversionRate,
+    fromCurrency,
   }
 }
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const { currentCurrency, conversionRate, ...restStateProps } = stateProps
+  const { fromCurrency, currentCurrency, conversionRate, ...restStateProps } = stateProps
   const {
     value,
     numberOfDecimals = 2,
diff --git a/ui/app/components/dropdowns/components/account-dropdowns.js b/ui/app/components/dropdowns/components/account-dropdowns.js
index b497f5c0984a..1ca92104e830 100644
--- a/ui/app/components/dropdowns/components/account-dropdowns.js
+++ b/ui/app/components/dropdowns/components/account-dropdowns.js
@@ -26,14 +26,14 @@ class AccountDropdowns extends Component {
   }
 
   renderAccounts () {
-    const { identities, accounts, selected, menuItemStyles, actions, keyrings } = this.props
+    const { identities, accounts, selected, menuItemStyles, actions, keyrings, ticker } = this.props
 
     return Object.keys(identities).map((key, index) => {
       const identity = identities[key]
       const isSelected = identity.address === selected
 
       const balanceValue = accounts[key].balance
-      const formattedBalance = balanceValue ? formatBalance(balanceValue, 6) : '...'
+      const formattedBalance = balanceValue ? formatBalance(balanceValue, 6, true, ticker) : '...'
       const simpleAddress = identity.address.substring(2).toLowerCase()
 
       const keyring = keyrings.find((kr) => {
@@ -421,6 +421,7 @@ AccountDropdowns.propTypes = {
   network: PropTypes.number,
   // actions.showExportPrivateKeyModal: ,
   style: PropTypes.object,
+  ticker: PropTypes.string,
   enableAccountsSelector: PropTypes.bool,
   enableAccountOption: PropTypes.bool,
   enableAccountOptions: PropTypes.bool,
@@ -458,6 +459,7 @@ const mapDispatchToProps = (dispatch) => {
 
 function mapStateToProps (state) {
   return {
+    ticker: state.metamask.ticker,
     keyrings: state.metamask.keyrings,
     sidebarOpen: state.appState.sidebar.isOpen,
   }
diff --git a/ui/app/components/dropdowns/network-dropdown.js b/ui/app/components/dropdowns/network-dropdown.js
index b9b4a9b258ee..2776a4610a8d 100644
--- a/ui/app/components/dropdowns/network-dropdown.js
+++ b/ui/app/components/dropdowns/network-dropdown.js
@@ -41,8 +41,8 @@ function mapDispatchToProps (dispatch) {
     setDefaultRpcTarget: type => {
       dispatch(actions.setDefaultRpcTarget(type))
     },
-    setRpcTarget: (target, network) => {
-      dispatch(actions.setRpcTarget(target, network))
+    setRpcTarget: (target, network, ticker) => {
+      dispatch(actions.setRpcTarget(target, network, ticker))
     },
     delRpcTarget: (target) => {
       dispatch(actions.delRpcTarget(target))
@@ -281,6 +281,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcListDetail, provider) {
 
   return reversedRpcListDetail.map((entry) => {
     const rpc = entry.rpcUrl
+    const ticker = entry.ticker || 'ETH'
     const currentRpcTarget = provider.type === 'rpc' && rpc === provider.rpcTarget
 
     if ((rpc === 'http://localhost:8545') || currentRpcTarget) {
@@ -292,7 +293,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcListDetail, provider) {
         {
           key: `common${rpc}`,
           closeMenu: () => this.props.hideNetworkDropdown(),
-          onClick: () => props.setRpcTarget(rpc, chainId),
+          onClick: () => props.setRpcTarget(rpc, chainId, ticker),
           style: {
             fontSize: '16px',
             lineHeight: '20px',
@@ -321,7 +322,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcListDetail, provider) {
 }
 
 NetworkDropdown.prototype.renderCustomOption = function (provider) {
-  const { rpcTarget, type } = provider
+  const { rpcTarget, type, ticker } = provider
   const props = this.props
   const network = props.network
 
@@ -337,7 +338,7 @@ NetworkDropdown.prototype.renderCustomOption = function (provider) {
         DropdownMenuItem,
         {
           key: rpcTarget,
-          onClick: () => props.setRpcTarget(rpcTarget, network),
+          onClick: () => props.setRpcTarget(rpcTarget, network, ticker),
           closeMenu: () => this.props.hideNetworkDropdown(),
           style: {
             fontSize: '16px',
diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js
index c3d084bdcb22..2f6395a2daa9 100644
--- a/ui/app/components/eth-balance.js
+++ b/ui/app/components/eth-balance.js
@@ -1,5 +1,6 @@
 const { Component } = require('react')
 const h = require('react-hyperscript')
+const connect = require('react-redux').connect
 const { inherits } = require('util')
 const {
   formatBalance,
@@ -8,7 +9,12 @@ const {
 const Tooltip = require('./tooltip.js')
 const FiatValue = require('./fiat-value.js')
 
-module.exports = EthBalanceComponent
+module.exports = connect(mapStateToProps)(EthBalanceComponent)
+function mapStateToProps (state) {
+  return {
+    ticker: state.metamask.ticker,
+  }
+}
 
 inherits(EthBalanceComponent, Component)
 function EthBalanceComponent () {
@@ -17,9 +23,9 @@ function EthBalanceComponent () {
 
 EthBalanceComponent.prototype.render = function () {
   const props = this.props
-  const { value, style, width, needsParse = true } = props
+  const { ticker, value, style, width, needsParse = true } = props
 
-  const formattedValue = value ? formatBalance(value, 6, needsParse) : '...'
+  const formattedValue = value ? formatBalance(value, 6, needsParse, ticker) : '...'
 
   return (
 
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
index 70a78f1f4c64..200cc5c22250 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
@@ -121,7 +121,7 @@ export default class SettingsTab extends PureComponent {
 
   renderNewRpcUrl () {
     const { t } = this.context
-    const { newRpc, chainId } = this.state
+    const { newRpc, chainId, ticker } = this.state
 
     return (
       <div className="settings-page__content-row">
@@ -138,7 +138,7 @@ export default class SettingsTab extends PureComponent {
               onChange={e => this.setState({ newRpc: e.target.value })}
               onKeyPress={e => {
                 if (e.key === 'Enter') {
-                  this.validateRpc(newRpc)
+                  this.validateRpc(newRpc, chainId, ticker)
                 }
               }}
               fullWidth
@@ -152,7 +152,21 @@ export default class SettingsTab extends PureComponent {
               onChange={e => this.setState({ chainId: e.target.value })}
               onKeyPress={e => {
                 if (e.key === 'Enter') {
-                  this.validateRpc(newRpc, chainId)
+                  this.validateRpc(newRpc, chainId, ticker)
+                }
+              }}
+              fullWidth
+              margin="none"
+            />
+            <TextField
+              type="text"
+              id="ticker"
+              placeholder={t('optionalSymbol')}
+              value={ticker}
+              onChange={e => this.setState({ ticker: e.target.value })}
+              onKeyPress={e => {
+                if (e.key === 'Enter') {
+                  this.validateRpc(newRpc, chainId, ticker)
                 }
               }}
               fullWidth
@@ -162,7 +176,7 @@ export default class SettingsTab extends PureComponent {
               className="settings-tab__rpc-save-button"
               onClick={e => {
                 e.preventDefault()
-                this.validateRpc(newRpc, chainId)
+                this.validateRpc(newRpc, chainId, ticker)
               }}
             >
               { t('save') }
@@ -173,11 +187,11 @@ export default class SettingsTab extends PureComponent {
     )
   }
 
-  validateRpc (newRpc, chainId) {
+  validateRpc (newRpc, chainId, ticker = 'ETH') {
     const { setRpcTarget, displayWarning } = this.props
 
     if (validUrl.isWebUri(newRpc)) {
-      setRpcTarget(newRpc, chainId)
+      setRpcTarget(newRpc, chainId, ticker)
     } else {
       const appendedRpc = `http://${newRpc}`
 
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
index 46ebacb2cbad..693dd2f8064c 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
@@ -25,6 +25,7 @@ const mapStateToProps = state => {
     provider = {},
     isMascara,
     currentLocale,
+    ticker,
   } = metamask
   const { useETHAsPrimaryCurrency } = preferencesSelector(state)
 
@@ -44,7 +45,7 @@ const mapStateToProps = state => {
 const mapDispatchToProps = dispatch => {
   return {
     setCurrentCurrency: currency => dispatch(setCurrentCurrency(currency)),
-    setRpcTarget: (newRpc, chainId) => dispatch(setRpcTarget(newRpc, chainId)),
+    setRpcTarget: (newRpc, chainId, ticker) => dispatch(setRpcTarget(newRpc, chainId, ticker)),
     displayWarning: warning => dispatch(displayWarning(warning)),
     revealSeedConfirmation: () => dispatch(revealSeedConfirmation()),
     setUseBlockie: value => dispatch(setUseBlockie(value)),
diff --git a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
index 23240c649a61..8beb335ce019 100644
--- a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
+++ b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
@@ -8,6 +8,7 @@ const mapStateToProps = (state, ownProps) => {
 
   return {
     useETHAsPrimaryCurrency,
+    fromCurrency: state.metamask.fromCurrency,
   }
 }
 
@@ -29,7 +30,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
   if (type === PRIMARY && useETHAsPrimaryCurrency ||
     type === SECONDARY && !useETHAsPrimaryCurrency) {
     // Display ETH
-    currency = ETH
+    currency = fromCurrency || ETH
     numberOfDecimals = propsNumberOfDecimals || ethNumberOfDecimals || 6
     prefix = propsPrefix || ethPrefix
   } else if (type === SECONDARY && useETHAsPrimaryCurrency ||
diff --git a/ui/app/util.js b/ui/app/util.js
index 37c0fb6982ae..b19a028cc998 100644
--- a/ui/app/util.js
+++ b/ui/app/util.js
@@ -128,7 +128,7 @@ function parseBalance (balance) {
 
 // Takes wei hex, returns an object with three properties.
 // Its "formatted" property is what we generally use to render values.
-function formatBalance (balance, decimalsToKeep, needsParse = true) {
+function formatBalance (balance, decimalsToKeep, needsParse = true, ticker = 'ETH') {
   var parsed = needsParse ? parseBalance(balance) : balance.split('.')
   var beforeDecimal = parsed[0]
   var afterDecimal = parsed[1]
@@ -138,14 +138,14 @@ function formatBalance (balance, decimalsToKeep, needsParse = true) {
       if (afterDecimal !== '0') {
         var sigFigs = afterDecimal.match(/^0*(.{2})/) // default: grabs 2 most significant digits
         if (sigFigs) { afterDecimal = sigFigs[0] }
-        formatted = '0.' + afterDecimal + ' ETH'
+        formatted = '0.' + afterDecimal + ` ${ticker}`
       }
     } else {
-      formatted = beforeDecimal + '.' + afterDecimal.slice(0, 3) + ' ETH'
+      formatted = beforeDecimal + '.' + afterDecimal.slice(0, 3) + ` ${ticker}`
     }
   } else {
     afterDecimal += Array(decimalsToKeep).join('0')
-    formatted = beforeDecimal + '.' + afterDecimal.slice(0, decimalsToKeep) + ' ETH'
+    formatted = beforeDecimal + '.' + afterDecimal.slice(0, decimalsToKeep) + ` ${ticker}`
   }
   return formatted
 }

From cd8fc98aca979c162f29802b09fdeac48021bd09 Mon Sep 17 00:00:00 2001
From: hackyminer <hackyminer@gmail.com>
Date: Sat, 20 Oct 2018 06:46:50 +0900
Subject: [PATCH 04/19] show/hide advanced options link

 * nickname added
 * use nickname in the dropdown menu
 * always set default ticker
---
 app/_locales/en/messages.json                 | 16 ++++-
 app/scripts/controllers/network/network.js    | 16 +++--
 app/scripts/controllers/preferences.js        |  6 +-
 app/scripts/metamask-controller.js            |  7 +-
 old-ui/app/config.js                          | 36 ++++++++--
 ui/app/actions.js                             |  6 +-
 .../components/dropdowns/network-dropdown.js  | 17 ++---
 .../network-display.component.js              |  4 +-
 ui/app/components/network.js                  |  5 +-
 .../pages/settings/settings-tab/index.scss    | 12 ++--
 .../settings-tab/settings-tab.component.js    | 71 ++++++++++++++-----
 .../settings-tab/settings-tab.container.js    |  2 +-
 12 files changed, 138 insertions(+), 60 deletions(-)

diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index 236019de9cdc..6eb9f18e2a13 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -692,15 +692,27 @@
   "newRecipient": {
     "message": "New Recipient"
   },
-  "newRPC": {
+  "newNetwork": {
+    "message": "New Network"
+  },
+  "rpcURL": {
     "message": "New RPC URL"
   },
+  "showAdvancedOptions": {
+    "message": "Show Advanced Options"
+  },
+  "hideAdvancedOptions": {
+    "message": "Hide Advanced Options"
+  },
   "optionalChainId": {
-    "message": "ChainId (optional)"
+    "message": "ChainID (optional)"
   },
   "optionalSymbol": {
     "message": "Symbol (optional)"
   },
+  "optionalNickname": {
+    "message": "Nickname (optional)"
+  },
   "next": {
     "message": "Next"
   },
diff --git a/app/scripts/controllers/network/network.js b/app/scripts/controllers/network/network.js
index 45e860910189..b459b8013717 100644
--- a/app/scripts/controllers/network/network.js
+++ b/app/scripts/controllers/network/network.js
@@ -58,8 +58,8 @@ module.exports = class NetworkController extends EventEmitter {
 
   initializeProvider (providerParams) {
     this._baseProviderParams = providerParams
-    const { type, rpcTarget, chainId, ticker } = this.providerStore.getState()
-    this._configureProvider({ type, rpcTarget, chainId, ticker })
+    const { type, rpcTarget, chainId, ticker, nickname } = this.providerStore.getState()
+    this._configureProvider({ type, rpcTarget, chainId, ticker, nickname })
     this.lookupNetwork()
   }
 
@@ -114,12 +114,13 @@ module.exports = class NetworkController extends EventEmitter {
     })
   }
 
-  setRpcTarget (rpcTarget, chainId, ticker = 'ETH') {
+  setRpcTarget (rpcTarget, chainId, ticker = 'ETH', nickname = '') {
     const providerConfig = {
       type: 'rpc',
       rpcTarget,
       chainId,
       ticker,
+      nickname,
     }
     this.providerConfig = providerConfig
   }
@@ -155,7 +156,7 @@ module.exports = class NetworkController extends EventEmitter {
   }
 
   _configureProvider (opts) {
-    const { type, rpcTarget, chainId, ticker } = opts
+    const { type, rpcTarget, chainId, ticker, nickname } = opts
     // infura type-based endpoints
     const isInfura = INFURA_PROVIDER_TYPES.includes(type)
     if (isInfura) {
@@ -165,7 +166,7 @@ module.exports = class NetworkController extends EventEmitter {
       this._configureLocalhostProvider()
     // url-based rpc endpoints
     } else if (type === 'rpc') {
-      this._configureStandardProvider({ rpcUrl: rpcTarget, chainId, ticker })
+      this._configureStandardProvider({ rpcUrl: rpcTarget, chainId, ticker, nickname })
     } else {
       throw new Error(`NetworkController - _configureProvider - unknown type "${type}"`)
     }
@@ -188,14 +189,15 @@ module.exports = class NetworkController extends EventEmitter {
     this._setNetworkClient(networkClient)
   }
 
-  _configureStandardProvider ({ rpcUrl, chainId, ticker }) {
+  _configureStandardProvider ({ rpcUrl, chainId, ticker, nickname }) {
     log.info('NetworkController - configureStandardProvider', rpcUrl)
     const networkClient = createJsonRpcClient({ rpcUrl })
     // hack to add a 'rpc' network with chainId
     networks.networkList['rpc'] = {
       chainId: chainId,
       rpcUrl,
-      ticker,
+      ticker: ticker || 'ETH',
+      nickname,
     }
     // setup networkConfig
     var settings = {
diff --git a/app/scripts/controllers/preferences.js b/app/scripts/controllers/preferences.js
index 769f3ea22d5d..3a7e2a489ef8 100644
--- a/app/scripts/controllers/preferences.js
+++ b/app/scripts/controllers/preferences.js
@@ -393,17 +393,19 @@ class PreferencesController {
    *
    * @param {string} url The RPC url to add to frequentRpcList.
    * @param {number} chainId Optional chainId of the selected network.
+   * @param {string} ticker   Optional ticker symbol of the selected network.
+   * @param {string} nickname Optional nickname of the selected network.
    * @returns {Promise<array>} Promise resolving to updated frequentRpcList.
    *
    */
-  addToFrequentRpcList (url, chainId, ticker) {
+  addToFrequentRpcList (url, chainId, ticker, nickname) {
     const rpcList = this.getFrequentRpcListDetail()
     const index = rpcList.findIndex((element) => { return element.rpcUrl === url })
     if (index !== -1) {
       rpcList.splice(index, 1)
     }
     if (url !== 'http://localhost:8545') {
-      rpcList.push({ rpcUrl: url, chainId })
+      rpcList.push({ rpcUrl: url, chainId, ticker, nickname })
     }
     this.store.updateState({ frequentRpcListiDetail: rpcList })
     return Promise.resolve(rpcList)
diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js
index 44afbf62aea5..fc238e4e3e6a 100644
--- a/app/scripts/metamask-controller.js
+++ b/app/scripts/metamask-controller.js
@@ -1461,11 +1461,12 @@ module.exports = class MetamaskController extends EventEmitter {
    * @param {string} rpcTarget - A URL for a valid Ethereum RPC API.
    * @param {number} chainId - The chainId of the selected network.
    * @param {string} ticker - The ticker symbol of the selected network.
+   * @param {string} nickname - Optional nickname of the selected network.
    * @returns {Promise<String>} - The RPC Target URL confirmed.
    */
-  async setCustomRpc (rpcTarget, chainId, ticker = 'ETH') {
-    this.networkController.setRpcTarget(rpcTarget, chainId, ticker)
-    await this.preferencesController.addToFrequentRpcList(rpcTarget, chainId, ticker)
+  async setCustomRpc (rpcTarget, chainId, ticker = 'ETH', nickname = '') {
+    this.networkController.setRpcTarget(rpcTarget, chainId, ticker, nickname)
+    await this.preferencesController.addToFrequentRpcList(rpcTarget, chainId, ticker, nickname)
     return rpcTarget
   }
 
diff --git a/old-ui/app/config.js b/old-ui/app/config.js
index d556eadfb3a4..7a93887a5998 100644
--- a/old-ui/app/config.js
+++ b/old-ui/app/config.js
@@ -83,7 +83,8 @@ ConfigScreen.prototype.render = function () {
                   var newRpc = element.value
                   var chainid = document.querySelector('input#chainid')
                   var ticker = document.querySelector('input#ticker')
-                  rpcValidation(newRpc, chainid.value, ticker.value, state)
+                  var nickname = document.querySelector('input#nickname')
+                  rpcValidation(newRpc, chainid.value, ticker.value, nickname.value, state)
                 }
               },
             }),
@@ -102,7 +103,8 @@ ConfigScreen.prototype.render = function () {
                   var newRpc = element.value
                   var chainid = document.querySelector('input#chainid')
                   var ticker = document.querySelector('input#ticker')
-                  rpcValidation(newRpc, chainid.value, ticker.value, state)
+                  var nickname = document.querySelector('input#nickname')
+                  rpcValidation(newRpc, chainid.value, ticker.value, nickname.value, state)
                 }
               },
             }),
@@ -121,7 +123,28 @@ ConfigScreen.prototype.render = function () {
                   var newRpc = element.value
                   var chainid = document.querySelector('input#chainid')
                   var ticker = document.querySelector('input#ticker')
-                  rpcValidation(newRpc, chainid.value, ticker.value, state)
+                  var nickname = document.querySelector('input#nickname')
+                  rpcValidation(newRpc, chainid.value, ticker.value, nickname.value, state)
+                }
+              },
+            }),
+            h('br'),
+            h('input#nickname', {
+              placeholder: 'Nickname (optional)',
+              style: {
+                width: 'inherit',
+                flex: '1 0 auto',
+                height: '30px',
+                margin: '8px',
+              },
+              onKeyPress (event) {
+                if (event.key === 'Enter') {
+                  var element = document.querySelector('input#new_rpc')
+                  var newRpc = element.value
+                  var chainid = document.querySelector('input#chainid')
+                  var ticker = document.querySelector('input#ticker')
+                  var nickname = document.querySelector('input#nickname')
+                  rpcValidation(newRpc, chainid.value, ticker.value, nickname.value, state)
                 }
               },
             }),
@@ -135,7 +158,8 @@ ConfigScreen.prototype.render = function () {
                 var newRpc = element.value
                 var chainid = document.querySelector('input#chainid')
                 var ticker = document.querySelector('input#ticker')
-                rpcValidation(newRpc, chainid.value, ticker.value, state)
+                var nickname = document.querySelector('input#nickname')
+                rpcValidation(newRpc, chainid.value, ticker.value, nickname.value, state)
               },
             }, 'Save'),
           ]),
@@ -231,9 +255,9 @@ ConfigScreen.prototype.render = function () {
   )
 }
 
-function rpcValidation (newRpc, chainid, ticker, state) {
+function rpcValidation (newRpc, chainid, ticker = 'ETH', nickname = '', state) {
   if (validUrl.isWebUri(newRpc)) {
-    state.dispatch(actions.setRpcTarget(newRpc, chainid, ticker))
+    state.dispatch(actions.setRpcTarget(newRpc, chainid, ticker, nickname))
   } else {
     var appendedRpc = `http://${newRpc}`
     if (validUrl.isWebUri(appendedRpc)) {
diff --git a/ui/app/actions.js b/ui/app/actions.js
index caa5a6d4ab85..d081a1a784c0 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -1874,10 +1874,10 @@ function updateProviderType (type) {
   }
 }
 
-function setRpcTarget (newRpc, chainId, ticker = 'ETH') {
+function setRpcTarget (newRpc, chainId, ticker = 'ETH', nickname = '') {
   return (dispatch) => {
-    log.debug(`background.setRpcTarget: ${newRpc} ${chainId} ${ticker}`)
-    background.setCustomRpc(newRpc, chainId, ticker, (err, result) => {
+    log.debug(`background.setRpcTarget: ${newRpc} ${chainId} ${ticker} ${nickname}`)
+    background.setCustomRpc(newRpc, chainId, ticker, nickname, (err, result) => {
       if (err) {
         log.error(err)
         return dispatch(actions.displayWarning('Had a problem changing networks!'))
diff --git a/ui/app/components/dropdowns/network-dropdown.js b/ui/app/components/dropdowns/network-dropdown.js
index 2776a4610a8d..d4cc695a642c 100644
--- a/ui/app/components/dropdowns/network-dropdown.js
+++ b/ui/app/components/dropdowns/network-dropdown.js
@@ -41,8 +41,8 @@ function mapDispatchToProps (dispatch) {
     setDefaultRpcTarget: type => {
       dispatch(actions.setDefaultRpcTarget(type))
     },
-    setRpcTarget: (target, network, ticker) => {
-      dispatch(actions.setRpcTarget(target, network, ticker))
+    setRpcTarget: (target, network, ticker, nickname) => {
+      dispatch(actions.setRpcTarget(target, network, ticker, nickname))
     },
     delRpcTarget: (target) => {
       dispatch(actions.delRpcTarget(target))
@@ -268,7 +268,7 @@ NetworkDropdown.prototype.getNetworkName = function () {
   } else if (providerName === 'rinkeby') {
     name = this.context.t('rinkeby')
   } else {
-    name = this.context.t('unknownNetwork')
+    name = provider.nickname || this.context.t('unknownNetwork')
   }
 
   return name
@@ -282,6 +282,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcListDetail, provider) {
   return reversedRpcListDetail.map((entry) => {
     const rpc = entry.rpcUrl
     const ticker = entry.ticker || 'ETH'
+    const nickname = entry.nickname || ''
     const currentRpcTarget = provider.type === 'rpc' && rpc === provider.rpcTarget
 
     if ((rpc === 'http://localhost:8545') || currentRpcTarget) {
@@ -293,7 +294,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcListDetail, provider) {
         {
           key: `common${rpc}`,
           closeMenu: () => this.props.hideNetworkDropdown(),
-          onClick: () => props.setRpcTarget(rpc, chainId, ticker),
+          onClick: () => props.setRpcTarget(rpc, chainId, ticker, nickname),
           style: {
             fontSize: '16px',
             lineHeight: '20px',
@@ -307,7 +308,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcListDetail, provider) {
             style: {
               color: currentRpcTarget ? '#ffffff' : '#9b9b9b',
             },
-          }, rpc),
+          }, nickname || rpc),
           h('i.fa.fa-times.delete',
           {
             onClick: (e) => {
@@ -322,7 +323,7 @@ NetworkDropdown.prototype.renderCommonRpc = function (rpcListDetail, provider) {
 }
 
 NetworkDropdown.prototype.renderCustomOption = function (provider) {
-  const { rpcTarget, type, ticker } = provider
+  const { rpcTarget, type, ticker, nickname } = provider
   const props = this.props
   const network = props.network
 
@@ -338,7 +339,7 @@ NetworkDropdown.prototype.renderCustomOption = function (provider) {
         DropdownMenuItem,
         {
           key: rpcTarget,
-          onClick: () => props.setRpcTarget(rpcTarget, network, ticker),
+          onClick: () => props.setRpcTarget(rpcTarget, network, ticker, nickname),
           closeMenu: () => this.props.hideNetworkDropdown(),
           style: {
             fontSize: '16px',
@@ -353,7 +354,7 @@ NetworkDropdown.prototype.renderCustomOption = function (provider) {
             style: {
               color: '#ffffff',
             },
-          }, rpcTarget),
+          }, nickname || rpcTarget),
         ]
       )
   }
diff --git a/ui/app/components/network-display/network-display.component.js b/ui/app/components/network-display/network-display.component.js
index 38626af20667..82f9ff9c3544 100644
--- a/ui/app/components/network-display/network-display.component.js
+++ b/ui/app/components/network-display/network-display.component.js
@@ -41,7 +41,7 @@ export default class NetworkDisplay extends Component {
   }
 
   render () {
-    const { network, provider: { type } } = this.props
+    const { network, provider: { type, nickname } } = this.props
     const networkClass = networkToClassHash[network]
 
     return (
@@ -61,7 +61,7 @@ export default class NetworkDisplay extends Component {
               />
         }
         <div className="network-display__name">
-          { this.context.t(type) }
+          { type === 'rpc' && nickname ? nickname : this.context.t(type) }
         </div>
       </div>
     )
diff --git a/ui/app/components/network.js b/ui/app/components/network.js
index 83297c4f2251..611aadb7bc47 100644
--- a/ui/app/components/network.js
+++ b/ui/app/components/network.js
@@ -23,9 +23,10 @@ Network.prototype.render = function () {
   const props = this.props
   const context = this.context
   const networkNumber = props.network
-  let providerName
+  let providerName, providerNick
   try {
     providerName = props.provider.type
+    providerNick = props.provider.nickname || ''
   } catch (e) {
     providerName = null
   }
@@ -131,7 +132,7 @@ Network.prototype.render = function () {
                 },
               }),
 
-              h('.network-name', context.t('privateNetwork')),
+              h('.network-name', providerNick || context.t('privateNetwork')),
               h('i.fa.fa-chevron-down.fa-lg.network-caret'),
             ])
         }
diff --git a/ui/app/components/pages/settings/settings-tab/index.scss b/ui/app/components/pages/settings/settings-tab/index.scss
index 3bf840c86b84..ef32b0e4ca1f 100644
--- a/ui/app/components/pages/settings/settings-tab/index.scss
+++ b/ui/app/components/pages/settings/settings-tab/index.scss
@@ -5,12 +5,9 @@
     color: $crimson;
   }
 
-  &__rpc-save-button {
-    align-self: flex-end;
-    padding: 5px;
-    text-transform: uppercase;
-    color: $dusty-gray;
-    cursor: pointer;
+  &__advanced-link {
+    color: $curious-blue;
+    padding-left: 5px;
   }
 
   &__rpc-save-button {
@@ -19,6 +16,9 @@
     text-transform: uppercase;
     color: $dusty-gray;
     cursor: pointer;
+    width: 25%;
+    min-width: 80px;
+    height: 33px;
   }
 
   &__button--red {
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
index 200cc5c22250..c90196b9ebb3 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
@@ -57,10 +57,12 @@ export default class SettingsTab extends PureComponent {
     conversionDate: PropTypes.number,
     useETHAsPrimaryCurrency: PropTypes.bool,
     setUseETHAsPrimaryCurrencyPreference: PropTypes.func,
+    ticker: PropTypes.string,
   }
 
   state = {
     newRpc: '',
+    showOptions: false,
   }
 
   renderCurrentConversion () {
@@ -121,28 +123,28 @@ export default class SettingsTab extends PureComponent {
 
   renderNewRpcUrl () {
     const { t } = this.context
-    const { newRpc, chainId, ticker } = this.state
+    const { newRpc, chainId, ticker, nickname } = this.state
 
     return (
       <div className="settings-page__content-row">
         <div className="settings-page__content-item">
-          <span>{ t('newRPC') }</span>
+          <span>{ t('newNetwork') }</span>
         </div>
         <div className="settings-page__content-item">
           <div className="settings-page__content-item-col">
             <TextField
               type="text"
               id="new-rpc"
-              placeholder={t('newRPC')}
+              placeholder={t('rpcURL')}
               value={newRpc}
               onChange={e => this.setState({ newRpc: e.target.value })}
               onKeyPress={e => {
                 if (e.key === 'Enter') {
-                  this.validateRpc(newRpc, chainId, ticker)
+                  this.validateRpc(newRpc, chainId, ticker, nickname)
                 }
               }}
               fullWidth
-              margin="none"
+              margin="dense"
             />
             <TextField
               type="text"
@@ -152,11 +154,14 @@ export default class SettingsTab extends PureComponent {
               onChange={e => this.setState({ chainId: e.target.value })}
               onKeyPress={e => {
                 if (e.key === 'Enter') {
-                  this.validateRpc(newRpc, chainId, ticker)
+                  this.validateRpc(newRpc, chainId, ticker, nickname)
                 }
               }}
+              style={{
+                display: this.state.showOptions ? null : 'none',
+              }}
               fullWidth
-              margin="none"
+              margin="dense"
             />
             <TextField
               type="text"
@@ -166,20 +171,50 @@ export default class SettingsTab extends PureComponent {
               onChange={e => this.setState({ ticker: e.target.value })}
               onKeyPress={e => {
                 if (e.key === 'Enter') {
-                  this.validateRpc(newRpc, chainId, ticker)
+                  this.validateRpc(newRpc, chainId, ticker, nickname)
                 }
               }}
+              style={{
+                display: this.state.showOptions ? null : 'none',
+              }}
               fullWidth
-              margin="none"
+              margin="dense"
             />
-            <div
-              className="settings-tab__rpc-save-button"
-              onClick={e => {
-                e.preventDefault()
-                this.validateRpc(newRpc, chainId, ticker)
+            <TextField
+              type="text"
+              id="nickname"
+              placeholder={t('optionalNickname')}
+              value={nickname}
+              onChange={e => this.setState({ nickname: e.target.value })}
+              onKeyPress={e => {
+                if (e.key === 'Enter') {
+                  this.validateRpc(newRpc, chainId, ticker, nickname)
+                }
               }}
-            >
-              { t('save') }
+              style={{
+                display: this.state.showOptions ? null : 'none',
+              }}
+              fullWidth
+              margin="dense"
+            />
+            <div className="flex-row flex-align-center space-between">
+              <span className="settings-tab__advanced-link"
+                onClick={e => {
+                  e.preventDefault()
+                  this.setState({ showOptions: !this.state.showOptions })
+                }}
+              >
+                { t(this.state.showOptions ? 'hideAdvancedOptions' : 'showAdvancedOptions') }
+              </span>
+              <button
+                className="button btn-primary settings-tab__rpc-save-button"
+                onClick={e => {
+                  e.preventDefault()
+                  this.validateRpc(newRpc, chainId, ticker, nickname)
+                }}
+              >
+                { t('save') }
+              </button>
             </div>
           </div>
         </div>
@@ -187,11 +222,11 @@ export default class SettingsTab extends PureComponent {
     )
   }
 
-  validateRpc (newRpc, chainId, ticker = 'ETH') {
+  validateRpc (newRpc, chainId, ticker = 'ETH', nickname) {
     const { setRpcTarget, displayWarning } = this.props
 
     if (validUrl.isWebUri(newRpc)) {
-      setRpcTarget(newRpc, chainId, ticker)
+      setRpcTarget(newRpc, chainId, ticker, nickname)
     } else {
       const appendedRpc = `http://${newRpc}`
 
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
index 693dd2f8064c..1a6fab6d9a9e 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
@@ -45,7 +45,7 @@ const mapStateToProps = state => {
 const mapDispatchToProps = dispatch => {
   return {
     setCurrentCurrency: currency => dispatch(setCurrentCurrency(currency)),
-    setRpcTarget: (newRpc, chainId, ticker) => dispatch(setRpcTarget(newRpc, chainId, ticker)),
+    setRpcTarget: (newRpc, chainId, ticker, nickname) => dispatch(setRpcTarget(newRpc, chainId, ticker, nickname)),
     displayWarning: warning => dispatch(displayWarning(warning)),
     revealSeedConfirmation: () => dispatch(revealSeedConfirmation()),
     setUseBlockie: value => dispatch(setUseBlockie(value)),

From 40e2b5ce31d25dbac3be55257f130dc6699e76c2 Mon Sep 17 00:00:00 2001
From: HackyMiner <hackyminer@gmail.com>
Date: Thu, 13 Sep 2018 19:35:51 +0900
Subject: [PATCH 05/19] use fromCurrency instead of 'ETH' constant

---
 .../currency-display/currency-display.component.js    |  4 ++--
 .../currency-display/currency-display.container.js    |  2 +-
 .../account-list-item/account-list-item.container.js  |  2 ++
 ui/app/components/send/send.selectors.js              |  5 +++++
 .../transaction-activity-log.component.js             | 11 ++++++-----
 .../transaction-activity-log.container.js             |  3 ++-
 .../transaction-list-item.component.js                |  3 ++-
 .../transaction-list-item.container.js                |  3 +++
 .../transaction-view-balance.component.js             |  3 ++-
 .../transaction-view-balance.container.js             |  3 ++-
 ui/app/ducks/confirm-transaction.duck.js              | 10 +++++++---
 ui/app/helpers/confirm-transaction/util.js            |  8 ++++++--
 ui/app/helpers/conversions.util.js                    | 10 ++++++----
 ui/app/selectors.js                                   |  5 +++++
 ui/app/selectors/confirm-transaction.js               |  1 +
 15 files changed, 52 insertions(+), 21 deletions(-)

diff --git a/ui/app/components/currency-display/currency-display.component.js b/ui/app/components/currency-display/currency-display.component.js
index f39e60269fc1..2d7413b57fbe 100644
--- a/ui/app/components/currency-display/currency-display.component.js
+++ b/ui/app/components/currency-display/currency-display.component.js
@@ -1,7 +1,7 @@
 import React, { PureComponent } from 'react'
 import PropTypes from 'prop-types'
 import classnames from 'classnames'
-import { ETH, GWEI } from '../../constants/common'
+import { GWEI } from '../../constants/common'
 
 export default class CurrencyDisplay extends PureComponent {
   static propTypes = {
@@ -12,7 +12,7 @@ export default class CurrencyDisplay extends PureComponent {
     style: PropTypes.object,
     suffix: PropTypes.string,
     // Used in container
-    currency: PropTypes.oneOf([ETH]),
+    currency: PropTypes.string,
     denomination: PropTypes.oneOf([GWEI]),
     value: PropTypes.string,
     numberOfDecimals: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
diff --git a/ui/app/components/currency-display/currency-display.container.js b/ui/app/components/currency-display/currency-display.container.js
index 8feb13b10c02..acc8405978e0 100644
--- a/ui/app/components/currency-display/currency-display.container.js
+++ b/ui/app/components/currency-display/currency-display.container.js
@@ -25,7 +25,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
 
   const toCurrency = currency || currentCurrency
   const convertedValue = getValueFromWeiHex({
-    value, toCurrency, conversionRate, numberOfDecimals, toDenomination: denomination,
+    value, fromCurrency, toCurrency, conversionRate, numberOfDecimals, toDenomination: denomination,
   })
   const displayValue = formatCurrency(convertedValue, toCurrency)
   const suffix = hideLabel ? undefined : toCurrency.toUpperCase()
diff --git a/ui/app/components/send/account-list-item/account-list-item.container.js b/ui/app/components/send/account-list-item/account-list-item.container.js
index 4b45192885e7..9e59e3ee04e4 100644
--- a/ui/app/components/send/account-list-item/account-list-item.container.js
+++ b/ui/app/components/send/account-list-item/account-list-item.container.js
@@ -2,6 +2,7 @@ import { connect } from 'react-redux'
 import {
     getConversionRate,
     getCurrentCurrency,
+    getFromCurrency,
 } from '../send.selectors.js'
 import AccountListItem from './account-list-item.component'
 
@@ -11,5 +12,6 @@ function mapStateToProps (state) {
   return {
     conversionRate: getConversionRate(state),
     currentCurrency: getCurrentCurrency(state),
+    fromCurrency: getFromCurrency(state),
   }
 }
diff --git a/ui/app/components/send/send.selectors.js b/ui/app/components/send/send.selectors.js
index 22e379693652..3ca5a8e248f8 100644
--- a/ui/app/components/send/send.selectors.js
+++ b/ui/app/components/send/send.selectors.js
@@ -19,6 +19,7 @@ const selectors = {
   getCurrentNetwork,
   getCurrentViewContext,
   getForceGasMin,
+  getFromCurrency,
   getGasLimit,
   getGasPrice,
   getGasPriceFromRecentBlocks,
@@ -111,6 +112,10 @@ function getCurrentCurrency (state) {
   return state.metamask.currentCurrency
 }
 
+function getFromCurrency (state) {
+  return state.metamask.fromCurrency
+}
+
 function getCurrentNetwork (state) {
   return state.metamask.network
 }
diff --git a/ui/app/components/transaction-activity-log/transaction-activity-log.component.js b/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
index c4cf57d14008..85c0e4d9c7e4 100644
--- a/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
+++ b/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
@@ -4,7 +4,6 @@ import classnames from 'classnames'
 import { getActivities } from './transaction-activity-log.util'
 import Card from '../card'
 import { getEthConversionFromWeiHex, getValueFromWeiHex } from '../../helpers/conversions.util'
-import { ETH } from '../../constants/common'
 import { formatDate } from '../../util'
 
 export default class TransactionActivityLog extends PureComponent {
@@ -16,6 +15,7 @@ export default class TransactionActivityLog extends PureComponent {
     transaction: PropTypes.object,
     className: PropTypes.string,
     conversionRate: PropTypes.number,
+    fromCurrency: PropTypes.string,
   }
 
   state = {
@@ -41,16 +41,17 @@ export default class TransactionActivityLog extends PureComponent {
   }
 
   renderActivity (activity, index) {
-    const { conversionRate } = this.props
+    const { conversionRate, fromCurrency } = this.props
     const { eventKey, value, timestamp } = activity
     const ethValue = index === 0
       ? `${getValueFromWeiHex({
         value,
-        toCurrency: ETH,
+        fromCurrency,
+        toCurrency: fromCurrency,
         conversionRate,
         numberOfDecimals: 6,
-      })} ${ETH}`
-      : getEthConversionFromWeiHex({ value, toCurrency: ETH, conversionRate })
+      })} ${fromCurrency}`
+      : getEthConversionFromWeiHex({ value, fromCurrency, toCurrency: fromCurrency, conversionRate })
     const formattedTimestamp = formatDate(timestamp)
     const activityText = this.context.t(eventKey, [ethValue, formattedTimestamp])
 
diff --git a/ui/app/components/transaction-activity-log/transaction-activity-log.container.js b/ui/app/components/transaction-activity-log/transaction-activity-log.container.js
index 4c8b6d971109..83e354c7c460 100644
--- a/ui/app/components/transaction-activity-log/transaction-activity-log.container.js
+++ b/ui/app/components/transaction-activity-log/transaction-activity-log.container.js
@@ -1,10 +1,11 @@
 import { connect } from 'react-redux'
 import TransactionActivityLog from './transaction-activity-log.component'
-import { conversionRateSelector } from '../../selectors'
+import { conversionRateSelector, getFromCurrency } from '../../selectors'
 
 const mapStateToProps = state => {
   return {
     conversionRate: conversionRateSelector(state),
+    fromCurrency: getFromCurrency(state),
   }
 }
 
diff --git a/ui/app/components/transaction-list-item/transaction-list-item.component.js b/ui/app/components/transaction-list-item/transaction-list-item.component.js
index 88573d2d5da1..62da6d5f26b0 100644
--- a/ui/app/components/transaction-list-item/transaction-list-item.component.js
+++ b/ui/app/components/transaction-list-item/transaction-list-item.component.js
@@ -25,6 +25,7 @@ export default class TransactionListItem extends PureComponent {
     showCancel: PropTypes.bool,
     showRetry: PropTypes.bool,
     showTransactionDetailsModal: PropTypes.func,
+    fromCurrency: PropTypes.string,
     token: PropTypes.object,
     tokenData: PropTypes.object,
     transaction: PropTypes.object,
@@ -92,7 +93,7 @@ export default class TransactionListItem extends PureComponent {
   }
 
   renderPrimaryCurrency () {
-    const { token, transaction: { txParams: { data } = {} } = {}, value } = this.props
+    const { token, fromCurrency, transaction: { txParams: { data } = {} } = {}, value } = this.props
 
     return token
       ? (
diff --git a/ui/app/components/transaction-list-item/transaction-list-item.container.js b/ui/app/components/transaction-list-item/transaction-list-item.container.js
index 72f5f5d618a6..e1d6e0a247e4 100644
--- a/ui/app/components/transaction-list-item/transaction-list-item.container.js
+++ b/ui/app/components/transaction-list-item/transaction-list-item.container.js
@@ -7,17 +7,20 @@ import { setSelectedToken, retryTransaction, showModal } from '../../actions'
 import { hexToDecimal } from '../../helpers/conversions.util'
 import { getTokenData } from '../../helpers/transactions.util'
 import { formatDate } from '../../util'
+import { getFromCurrency } from '../../selectors.js'
 
 const mapStateToProps = (state, ownProps) => {
   const { transaction: { txParams: { value, nonce, data } = {}, time } = {} } = ownProps
 
   const tokenData = data && getTokenData(data)
   const nonceAndDate = nonce ? `#${hexToDecimal(nonce)} - ${formatDate(time)}` : formatDate(time)
+  const fromCurrency = getFromCurrency(state)
 
   return {
     value,
     nonceAndDate,
     tokenData,
+    fromCurrency,
   }
 }
 
diff --git a/ui/app/components/transaction-view-balance/transaction-view-balance.component.js b/ui/app/components/transaction-view-balance/transaction-view-balance.component.js
index 273845c47b8f..eb407bb3ad85 100644
--- a/ui/app/components/transaction-view-balance/transaction-view-balance.component.js
+++ b/ui/app/components/transaction-view-balance/transaction-view-balance.component.js
@@ -18,11 +18,12 @@ export default class TransactionViewBalance extends PureComponent {
     history: PropTypes.object,
     network: PropTypes.string,
     balance: PropTypes.string,
+    fromCurrency: PropTypes.string,
     assetImage: PropTypes.string,
   }
 
   renderBalance () {
-    const { selectedToken, balance } = this.props
+    const { selectedToken, balance, fromCurrency } = this.props
 
     return selectedToken
       ? (
diff --git a/ui/app/components/transaction-view-balance/transaction-view-balance.container.js b/ui/app/components/transaction-view-balance/transaction-view-balance.container.js
index 30c5cab16a79..24b4ddd16f30 100644
--- a/ui/app/components/transaction-view-balance/transaction-view-balance.container.js
+++ b/ui/app/components/transaction-view-balance/transaction-view-balance.container.js
@@ -2,7 +2,7 @@ import { connect } from 'react-redux'
 import { withRouter } from 'react-router-dom'
 import { compose } from 'recompose'
 import TransactionViewBalance from './transaction-view-balance.component'
-import { getSelectedToken, getSelectedAddress, getSelectedTokenAssetImage } from '../../selectors'
+import { getSelectedToken, getSelectedAddress, getFromCurrency, getSelectedTokenAssetImage } from '../../selectors'
 import { showModal } from '../../actions'
 
 const mapStateToProps = state => {
@@ -15,6 +15,7 @@ const mapStateToProps = state => {
     selectedToken: getSelectedToken(state),
     network,
     balance,
+    fromCurrency: getFromCurrency(state),
     assetImage: getSelectedTokenAssetImage(state),
   }
 }
diff --git a/ui/app/ducks/confirm-transaction.duck.js b/ui/app/ducks/confirm-transaction.duck.js
index 2ceafbe084f7..8506f1765359 100644
--- a/ui/app/ducks/confirm-transaction.duck.js
+++ b/ui/app/ducks/confirm-transaction.duck.js
@@ -2,6 +2,7 @@ import {
   conversionRateSelector,
   currentCurrencySelector,
   unconfirmedTransactionsHashSelector,
+  getFromCurrency,
 } from '../selectors/confirm-transaction'
 
 import {
@@ -292,16 +293,17 @@ export function updateTxDataAndCalculate (txData) {
     const state = getState()
     const currentCurrency = currentCurrencySelector(state)
     const conversionRate = conversionRateSelector(state)
+    const fromCurrency = getFromCurrency(state)
 
     dispatch(updateTxData(txData))
 
     const { txParams: { value = '0x0', gas: gasLimit = '0x0', gasPrice = '0x0' } = {} } = txData
 
     const fiatTransactionAmount = getValueFromWeiHex({
-      value, toCurrency: currentCurrency, conversionRate, numberOfDecimals: 2,
+      value, fromCurrency, toCurrency: currentCurrency, conversionRate, numberOfDecimals: 2,
     })
     const ethTransactionAmount = getValueFromWeiHex({
-      value, toCurrency: 'ETH', conversionRate, numberOfDecimals: 6,
+      value, fromCurrency, toCurrency: fromCurrency, conversionRate, numberOfDecimals: 6,
     })
 
     dispatch(updateTransactionAmounts({
@@ -314,13 +316,15 @@ export function updateTxDataAndCalculate (txData) {
 
     const fiatTransactionFee = getTransactionFee({
       value: hexTransactionFee,
+      fromCurrency,
       toCurrency: currentCurrency,
       numberOfDecimals: 2,
       conversionRate,
     })
     const ethTransactionFee = getTransactionFee({
       value: hexTransactionFee,
-      toCurrency: 'ETH',
+      fromCurrency,
+      toCurrency: fromCurrency,
       numberOfDecimals: 6,
       conversionRate,
     })
diff --git a/ui/app/helpers/confirm-transaction/util.js b/ui/app/helpers/confirm-transaction/util.js
index bcac225003c8..eb334a4b8271 100644
--- a/ui/app/helpers/confirm-transaction/util.js
+++ b/ui/app/helpers/confirm-transaction/util.js
@@ -55,6 +55,7 @@ export function addFiat (...args) {
 
 export function getValueFromWeiHex ({
   value,
+  fromCurrency = 'ETH',
   toCurrency,
   conversionRate,
   numberOfDecimals,
@@ -63,7 +64,7 @@ export function getValueFromWeiHex ({
   return conversionUtil(value, {
     fromNumericBase: 'hex',
     toNumericBase: 'dec',
-    fromCurrency: 'ETH',
+    fromCurrency,
     toCurrency,
     numberOfDecimals,
     fromDenomination: 'WEI',
@@ -74,6 +75,7 @@ export function getValueFromWeiHex ({
 
 export function getTransactionFee ({
   value,
+  fromCurrency = 'ETH',
   toCurrency,
   conversionRate,
   numberOfDecimals,
@@ -82,7 +84,7 @@ export function getTransactionFee ({
     fromNumericBase: 'BN',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
-    fromCurrency: 'ETH',
+    fromCurrency,
     toCurrency,
     numberOfDecimals,
     conversionRate,
@@ -99,6 +101,7 @@ export function formatCurrency (value, currencyCode) {
 
 export function convertTokenToFiat ({
   value,
+  fromCurrency = 'ETH',
   toCurrency,
   conversionRate,
   contractExchangeRate,
@@ -108,6 +111,7 @@ export function convertTokenToFiat ({
   return conversionUtil(value, {
     fromNumericBase: 'dec',
     toNumericBase: 'dec',
+    fromCurrency,
     toCurrency,
     numberOfDecimals: 2,
     conversionRate: totalExchangeRate,
diff --git a/ui/app/helpers/conversions.util.js b/ui/app/helpers/conversions.util.js
index 777537e1e26a..cb5e1b90bf7b 100644
--- a/ui/app/helpers/conversions.util.js
+++ b/ui/app/helpers/conversions.util.js
@@ -20,8 +20,8 @@ export function decimalToHex (decimal) {
   })
 }
 
-export function getEthConversionFromWeiHex ({ value, conversionRate, numberOfDecimals = 6 }) {
-  const denominations = [ETH, GWEI, WEI]
+export function getEthConversionFromWeiHex ({ value, fromCurrency = ETH, conversionRate, numberOfDecimals = 6 }) {
+  const denominations = [fromCurrency, GWEI, WEI]
 
   let nonZeroDenomination
 
@@ -29,7 +29,8 @@ export function getEthConversionFromWeiHex ({ value, conversionRate, numberOfDec
     const convertedValue = getValueFromWeiHex({
       value,
       conversionRate,
-      toCurrency: ETH,
+      fromCurrency,
+      toCurrency: fromCurrency,
       numberOfDecimals,
       toDenomination: denominations[i],
     })
@@ -45,6 +46,7 @@ export function getEthConversionFromWeiHex ({ value, conversionRate, numberOfDec
 
 export function getValueFromWeiHex ({
   value,
+  fromCurrency = ETH,
   toCurrency,
   conversionRate,
   numberOfDecimals,
@@ -53,7 +55,7 @@ export function getValueFromWeiHex ({
   return conversionUtil(value, {
     fromNumericBase: 'hex',
     toNumericBase: 'dec',
-    fromCurrency: ETH,
+    fromCurrency,
     toCurrency,
     numberOfDecimals,
     fromDenomination: WEI,
diff --git a/ui/app/selectors.js b/ui/app/selectors.js
index 9f11551bee52..88a247fbc6b5 100644
--- a/ui/app/selectors.js
+++ b/ui/app/selectors.js
@@ -26,6 +26,7 @@ const selectors = {
   getAddressBook,
   getSendFrom,
   getCurrentCurrency,
+  getFromCurrency,
   getSendAmount,
   getSelectedTokenToFiatRate,
   getSelectedTokenContract,
@@ -143,6 +144,10 @@ function getCurrentCurrency (state) {
   return state.metamask.currentCurrency
 }
 
+function getFromCurrency (state) {
+  return state.metamask.fromCurrency
+}
+
 function getSelectedTokenToFiatRate (state) {
   const selectedTokenExchangeRate = getSelectedTokenExchangeRate(state)
   const conversionRate = conversionRateSelector(state)
diff --git a/ui/app/selectors/confirm-transaction.js b/ui/app/selectors/confirm-transaction.js
index 86b10bac396e..f7bd2c8f022d 100644
--- a/ui/app/selectors/confirm-transaction.js
+++ b/ui/app/selectors/confirm-transaction.js
@@ -93,6 +93,7 @@ export const unconfirmedTransactionsCountSelector = createSelector(
 
 export const currentCurrencySelector = state => state.metamask.currentCurrency
 export const conversionRateSelector = state => state.metamask.conversionRate
+export const getFromCurrency = state => state.metamask.fromCurrency
 
 const txDataSelector = state => state.confirmTransaction.txData
 const tokenDataSelector = state => state.confirmTransaction.tokenData

From 0a305a0c91579ed595f0f6baa755314a0b00578f Mon Sep 17 00:00:00 2001
From: HackyMiner <hackyminer@gmail.com>
Date: Thu, 13 Sep 2018 20:57:32 +0900
Subject: [PATCH 06/19] fixed testcases

---
 test/data/mock-state.json                                     | 4 +++-
 .../currency-display/tests/currency-display.component.test.js | 2 ++
 .../currency-display/tests/currency-display.container.test.js | 1 +
 ui/app/components/dropdowns/tests/network-dropdown.test.js    | 4 ++--
 .../tests/account-list-item-component.test.js                 | 1 +
 .../tests/account-list-item-container.test.js                 | 2 ++
 .../tests/transaction-activity-log.container.test.js          | 3 ++-
 7 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/test/data/mock-state.json b/test/data/mock-state.json
index 7e083c60e12a..454c5f09ef77 100644
--- a/test/data/mock-state.json
+++ b/test/data/mock-state.json
@@ -111,7 +111,9 @@
       "0x108cf70c7d384c552f42c07c41c0e1e46d77ea0d": 0.00039345803819379796,
       "0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5": 0.00008189274407698049
     },
+    "ticker": "ETH",
     "currentCurrency": "usd",
+    "fromCurrency": "ETH",
     "conversionRate": 556.12,
     "addressBook": [
       {
@@ -1248,4 +1250,4 @@
       "context": "0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/ui/app/components/currency-display/tests/currency-display.component.test.js b/ui/app/components/currency-display/tests/currency-display.component.test.js
index d9ef052f1bf2..2fbc6bd08d1f 100644
--- a/ui/app/components/currency-display/tests/currency-display.component.test.js
+++ b/ui/app/components/currency-display/tests/currency-display.component.test.js
@@ -6,6 +6,7 @@ import CurrencyDisplay from '../currency-display.component'
 describe('CurrencyDisplay Component', () => {
   it('should render text with a className', () => {
     const wrapper = shallow(<CurrencyDisplay
+      fromCurrency={'ETH'}
       displayValue="$123.45"
       className="currency-display"
     />)
@@ -16,6 +17,7 @@ describe('CurrencyDisplay Component', () => {
 
   it('should render text with a prefix', () => {
     const wrapper = shallow(<CurrencyDisplay
+      fromCurrency={'ETH'}
       displayValue="$123.45"
       className="currency-display"
       prefix="-"
diff --git a/ui/app/components/currency-display/tests/currency-display.container.test.js b/ui/app/components/currency-display/tests/currency-display.container.test.js
index fb6678776115..e7ed958b086b 100644
--- a/ui/app/components/currency-display/tests/currency-display.container.test.js
+++ b/ui/app/components/currency-display/tests/currency-display.container.test.js
@@ -20,6 +20,7 @@ describe('CurrencyDisplay container', () => {
         metamask: {
           conversionRate: 280.45,
           currentCurrency: 'usd',
+          fromCurrency: 'ETH',
         },
       }
 
diff --git a/ui/app/components/dropdowns/tests/network-dropdown.test.js b/ui/app/components/dropdowns/tests/network-dropdown.test.js
index 699b546053b5..88ad568516b3 100644
--- a/ui/app/components/dropdowns/tests/network-dropdown.test.js
+++ b/ui/app/components/dropdowns/tests/network-dropdown.test.js
@@ -45,8 +45,8 @@ describe('Network Dropdown', () => {
         provider: {
           'type': 'test',
         },
-        frequentRpcList: [
-          'http://localhost:7545',
+        frequentRpcListDetail: [
+          { rpcUrl: 'http://localhost:7545' },
         ],
       },
       appState: {
diff --git a/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js b/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
index f88c0dbd0bea..018894b61b62 100644
--- a/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
+++ b/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
@@ -28,6 +28,7 @@ describe('AccountListItem Component', function () {
       className={'mockClassName'}
       conversionRate={4}
       currentCurrency={'mockCurrentyCurrency'}
+      fromCurrency={'ETH'}
       displayAddress={false}
       displayBalance={false}
       handleClick={propsMethodSpies.handleClick}
diff --git a/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js b/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
index af0859117a94..0b4051e91a21 100644
--- a/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
+++ b/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
@@ -13,6 +13,7 @@ proxyquire('../account-list-item.container.js', {
   '../send.selectors.js': {
     getConversionRate: (s) => `mockConversionRate:${s}`,
     getCurrentCurrency: (s) => `mockCurrentCurrency:${s}`,
+    getFromCurrency: (s) => `mockFromCurrency:${s}`,
   },
 })
 
@@ -24,6 +25,7 @@ describe('account-list-item container', () => {
       assert.deepEqual(mapStateToProps('mockState'), {
         conversionRate: 'mockConversionRate:mockState',
         currentCurrency: 'mockCurrentCurrency:mockState',
+        fromCurrency: 'mockFromCurrency:mockState',
       })
     })
 
diff --git a/ui/app/components/transaction-activity-log/tests/transaction-activity-log.container.test.js b/ui/app/components/transaction-activity-log/tests/transaction-activity-log.container.test.js
index 85d56a6a2c63..c81944732635 100644
--- a/ui/app/components/transaction-activity-log/tests/transaction-activity-log.container.test.js
+++ b/ui/app/components/transaction-activity-log/tests/transaction-activity-log.container.test.js
@@ -18,10 +18,11 @@ describe('TransactionActivityLog container', () => {
       const mockState = {
         metamask: {
           conversionRate: 280.45,
+          fromCurrency: 'ETH',
         },
       }
 
-      assert.deepEqual(mapStateToProps(mockState), { conversionRate: 280.45 })
+      assert.deepEqual(mapStateToProps(mockState), { conversionRate: 280.45, fromCurrency: 'ETH' })
     })
   })
 })

From 5dee37bdc3d6c20969ef2e62f0eb220d047accd3 Mon Sep 17 00:00:00 2001
From: HackyMiner <hackyminer@gmail.com>
Date: Sat, 29 Sep 2018 05:29:28 +0900
Subject: [PATCH 07/19] fixed selectors and testcase

---
 ui/app/components/send/send.selectors.js            |  2 +-
 ui/app/components/send/tests/send-selectors.test.js | 10 ++++++++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/ui/app/components/send/send.selectors.js b/ui/app/components/send/send.selectors.js
index 3ca5a8e248f8..1cff9eaf8ccf 100644
--- a/ui/app/components/send/send.selectors.js
+++ b/ui/app/components/send/send.selectors.js
@@ -113,7 +113,7 @@ function getCurrentCurrency (state) {
 }
 
 function getFromCurrency (state) {
-  return state.metamask.fromCurrency
+  return state.metamask.fromCurrency || 'ETH'
 }
 
 function getCurrentNetwork (state) {
diff --git a/ui/app/components/send/tests/send-selectors.test.js b/ui/app/components/send/tests/send-selectors.test.js
index 1a47cd20968a..6a5ef2f531fa 100644
--- a/ui/app/components/send/tests/send-selectors.test.js
+++ b/ui/app/components/send/tests/send-selectors.test.js
@@ -12,6 +12,7 @@ const {
   getCurrentCurrency,
   getCurrentNetwork,
   getCurrentViewContext,
+  getFromCurrency,
   getForceGasMin,
   getGasLimit,
   getGasPrice,
@@ -178,6 +179,15 @@ describe('send selectors', () => {
     })
   })
 
+  describe('getFromCurrency()', () => {
+    it('should return the ticker symbol of the selected network', () => {
+      assert.equal(
+        getFromCurrency(mockState),
+        'ETH'
+      )
+    })
+  })
+
   describe('getCurrentNetwork()', () => {
     it('should return the id of the currently selected network', () => {
       assert.equal(

From 23e47721b1fc9eef92845b70ba63485ca40fbb66 Mon Sep 17 00:00:00 2001
From: HackyMiner <hackyminer@gmail.com>
Date: Sat, 29 Sep 2018 05:20:15 +0900
Subject: [PATCH 08/19] use fromCurrency

---
 ui/app/components/balance-component.js | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/ui/app/components/balance-component.js b/ui/app/components/balance-component.js
index ab8e4e959f58..4945103fd640 100644
--- a/ui/app/components/balance-component.js
+++ b/ui/app/components/balance-component.js
@@ -6,7 +6,7 @@ const TokenBalance = require('./token-balance')
 const Identicon = require('./identicon')
 import UserPreferencedCurrencyDisplay from './user-preferenced-currency-display'
 import { PRIMARY, SECONDARY } from '../constants/common'
-const { getAssetImages, conversionRateSelector, getCurrentCurrency} = require('../selectors')
+const { getFromCurrency, getAssetImages, conversionRateSelector, getCurrentCurrency} = require('../selectors')
 
 const { formatBalance } = require('../util')
 
@@ -21,7 +21,7 @@ function mapStateToProps (state) {
   return {
     account,
     network,
-    ticker: state.metamask.ticker,
+    fromCurrency: getFromCurrency(state),
     conversionRate: conversionRateSelector(state),
     currentCurrency: getCurrentCurrency(state),
     assetImages: getAssetImages(state),
@@ -67,11 +67,10 @@ BalanceComponent.prototype.renderTokenBalance = function () {
 
 BalanceComponent.prototype.renderBalance = function () {
   const props = this.props
-  const { account } = props
-  const { account, ticker } = props
+  const { account, fromCurrency } = props
   const balanceValue = account && account.balance
   const needsParse = 'needsParse' in props ? props.needsParse : true
-  const formattedBalance = balanceValue ? formatBalance(balanceValue, 6, needsParse, ticker) : '...'
+  const formattedBalance = balanceValue ? formatBalance(balanceValue, 6, needsParse, fromCurrency) : '...'
   const showFiat = 'showFiat' in props ? props.showFiat : true
 
   if (formattedBalance === 'None' || formattedBalance === '...') {

From 744592437907f725e0e476cc70ea14d52848a3d9 Mon Sep 17 00:00:00 2001
From: HackyMiner <hackyminer@gmail.com>
Date: Sat, 29 Sep 2018 10:52:52 +0900
Subject: [PATCH 09/19] check currency conversion available for a customRpc

---
 app/scripts/controllers/currency.js | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/app/scripts/controllers/currency.js b/app/scripts/controllers/currency.js
index d6f90e1bc0ba..661136296df6 100644
--- a/app/scripts/controllers/currency.js
+++ b/app/scripts/controllers/currency.js
@@ -141,8 +141,13 @@ class CurrencyController {
         this.setConversionRate(Number(parsedResponse.bid))
         this.setConversionDate(Number(parsedResponse.timestamp))
       } else {
-        this.setConversionRate(Number(parsedResponse[currentCurrency.toUpperCase()]))
-        this.setConversionDate(parseInt((new Date()).getTime() / 1000))
+        if (parsedResponse[currentCurrency.toUpperCase()]) {
+          this.setConversionRate(Number(parsedResponse[currentCurrency.toUpperCase()]))
+          this.setConversionDate(parseInt((new Date()).getTime() / 1000))
+        } else {
+          this.setConversionRate(0)
+          this.setConversionDate('N/A')
+        }
       }
     } catch (err) {
       log.warn(`MetaMask - Failed to query currency conversion:`, fromCurrency, currentCurrency, err)

From b548e5b49d989ffe569379e20caca616f355b846 Mon Sep 17 00:00:00 2001
From: HackyMiner <hackyminer@gmail.com>
Date: Thu, 18 Oct 2018 10:32:05 +0900
Subject: [PATCH 10/19] fixed conflict mistake and follow up for recent changes

---
 .../currency-display/currency-display.container.js         | 2 +-
 .../components/currency-input/currency-input.component.js  | 5 +++--
 .../components/currency-input/currency-input.container.js  | 7 ++++---
 .../pages/settings/settings-tab/settings-tab.component.js  | 4 +++-
 .../pages/settings/settings-tab/settings-tab.container.js  | 1 -
 .../user-preferenced-currency-display.component.js         | 1 +
 .../user-preferenced-currency-display.container.js         | 3 ++-
 7 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/ui/app/components/currency-display/currency-display.container.js b/ui/app/components/currency-display/currency-display.container.js
index acc8405978e0..3852985dbe93 100644
--- a/ui/app/components/currency-display/currency-display.container.js
+++ b/ui/app/components/currency-display/currency-display.container.js
@@ -23,7 +23,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
     ...restOwnProps
   } = ownProps
 
-  const toCurrency = currency || currentCurrency
+  const toCurrency = currency === 'ETH' ? fromCurrency || currency : currency || currentCurrency
   const convertedValue = getValueFromWeiHex({
     value, fromCurrency, toCurrency, conversionRate, numberOfDecimals, toDenomination: denomination,
   })
diff --git a/ui/app/components/currency-input/currency-input.component.js b/ui/app/components/currency-input/currency-input.component.js
index 54cd0e1ac5ba..ceac4e9141cb 100644
--- a/ui/app/components/currency-input/currency-input.component.js
+++ b/ui/app/components/currency-input/currency-input.component.js
@@ -14,6 +14,7 @@ export default class CurrencyInput extends PureComponent {
   static propTypes = {
     conversionRate: PropTypes.number,
     currentCurrency: PropTypes.string,
+    fromCurrency: PropTypes.string,
     onChange: PropTypes.func,
     onBlur: PropTypes.func,
     suffix: PropTypes.string,
@@ -77,13 +78,13 @@ export default class CurrencyInput extends PureComponent {
   }
 
   renderConversionComponent () {
-    const { useFiat, currentCurrency } = this.props
+    const { useFiat, currentCurrency, fromCurrency } = this.props
     const { hexValue } = this.state
     let currency, numberOfDecimals
 
     if (useFiat) {
       // Display ETH
-      currency = ETH
+      currency = fromCurrency || ETH
       numberOfDecimals = 6
     } else {
       // Display Fiat
diff --git a/ui/app/components/currency-input/currency-input.container.js b/ui/app/components/currency-input/currency-input.container.js
index 18e5533dea73..ad88b30c4c74 100644
--- a/ui/app/components/currency-input/currency-input.container.js
+++ b/ui/app/components/currency-input/currency-input.container.js
@@ -3,18 +3,19 @@ import CurrencyInput from './currency-input.component'
 import { ETH } from '../../constants/common'
 
 const mapStateToProps = state => {
-  const { metamask: { currentCurrency, conversionRate } } = state
+  const { metamask: { fromCurrency, currentCurrency, conversionRate } } = state
 
   return {
+    fromCurrency,
     currentCurrency,
     conversionRate,
   }
 }
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const { currentCurrency } = stateProps
+  const { fromCurrency, currentCurrency } = stateProps
   const { useFiat } = ownProps
-  const suffix = useFiat ? currentCurrency.toUpperCase() : ETH
+  const suffix = useFiat ? currentCurrency.toUpperCase() : fromCurrency || ETH
 
   return {
     ...stateProps,
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
index c90196b9ebb3..4639cf141f8f 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
@@ -57,12 +57,14 @@ export default class SettingsTab extends PureComponent {
     conversionDate: PropTypes.number,
     useETHAsPrimaryCurrency: PropTypes.bool,
     setUseETHAsPrimaryCurrencyPreference: PropTypes.func,
-    ticker: PropTypes.string,
   }
 
   state = {
     newRpc: '',
+    chainId: '',
     showOptions: false,
+    ticker: '',
+    nickname: '',
   }
 
   renderCurrentConversion () {
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
index 1a6fab6d9a9e..77a65b160b52 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
@@ -25,7 +25,6 @@ const mapStateToProps = state => {
     provider = {},
     isMascara,
     currentLocale,
-    ticker,
   } = metamask
   const { useETHAsPrimaryCurrency } = preferencesSelector(state)
 
diff --git a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.component.js b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.component.js
index 4d948ca6a074..be3dbe8f6716 100644
--- a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.component.js
+++ b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.component.js
@@ -21,6 +21,7 @@ export default class UserPreferencedCurrencyDisplay extends PureComponent {
     fiatPrefix: PropTypes.string,
     // From container
     currency: PropTypes.string,
+    fromCurrency: PropTypes.string,
   }
 
   renderEthLogo () {
diff --git a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
index 8beb335ce019..d84aa19fbb1c 100644
--- a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
+++ b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
@@ -13,7 +13,7 @@ const mapStateToProps = (state, ownProps) => {
 }
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const { useETHAsPrimaryCurrency, ...restStateProps } = stateProps
+  const { useETHAsPrimaryCurrency, fromCurrency, ...restStateProps } = stateProps
   const {
     type,
     numberOfDecimals: propsNumberOfDecimals,
@@ -44,6 +44,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
     ...restStateProps,
     ...dispatchProps,
     ...restOwnProps,
+    fromCurrency,
     currency,
     numberOfDecimals,
     prefix,

From 45c8171ee43ca1a4ad3a711f9a130dac7cb2aadc Mon Sep 17 00:00:00 2001
From: HackyMiner <hackyminer@gmail.com>
Date: Thu, 18 Oct 2018 10:33:08 +0900
Subject: [PATCH 11/19] fixed testcases

---
 test/unit/ui/app/actions.spec.js                 |  2 +-
 .../tests/currency-display.container.test.js     | 16 ++++++++++++++++
 .../tests/currency-input.component.test.js       | 12 ++++++++++++
 .../tests/currency-input.container.test.js       |  5 +++++
 ...referenced-currency-display.container.test.js |  2 ++
 5 files changed, 36 insertions(+), 1 deletion(-)

diff --git a/test/unit/ui/app/actions.spec.js b/test/unit/ui/app/actions.spec.js
index 748a58b32f7b..df7d2ee8f70a 100644
--- a/test/unit/ui/app/actions.spec.js
+++ b/test/unit/ui/app/actions.spec.js
@@ -1133,7 +1133,7 @@ describe('Actions', () => {
         { type: 'DISPLAY_WARNING', value: 'Had a problem changing networks!' },
       ]
 
-      setRpcTargetSpy.callsFake((newRpc, callback) => {
+      setRpcTargetSpy.callsFake((newRpc, chainId, ticker, nickname, callback) => {
         callback(new Error('error'))
       })
 
diff --git a/ui/app/components/currency-display/tests/currency-display.container.test.js b/ui/app/components/currency-display/tests/currency-display.container.test.js
index e7ed958b086b..7a422a656dea 100644
--- a/ui/app/components/currency-display/tests/currency-display.container.test.js
+++ b/ui/app/components/currency-display/tests/currency-display.container.test.js
@@ -27,6 +27,7 @@ describe('CurrencyDisplay container', () => {
       assert.deepEqual(mapStateToProps(mockState), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
+        fromCurrency: 'ETH',
       })
     })
   })
@@ -36,6 +37,7 @@ describe('CurrencyDisplay container', () => {
       const mockStateProps = {
         conversionRate: 280.45,
         currentCurrency: 'usd',
+        fromCurrency: 'ETH',
       }
 
       const tests = [
@@ -44,40 +46,48 @@ describe('CurrencyDisplay container', () => {
             value: '0x2386f26fc10000',
             numberOfDecimals: 2,
             currency: 'usd',
+            fromCurrency: 'ETH',
           },
           result: {
             displayValue: '$2.80',
             suffix: 'USD',
+            fromCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x2386f26fc10000',
+            fromCurrency: 'ETH',
           },
           result: {
             displayValue: '$2.80',
             suffix: 'USD',
+            fromCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x1193461d01595930',
             currency: 'ETH',
+            fromCurrency: 'ETH',
             numberOfDecimals: 3,
           },
           result: {
             displayValue: '1.266',
             suffix: 'ETH',
+            fromCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x1193461d01595930',
             currency: 'ETH',
+            fromCurrency: 'ETH',
             numberOfDecimals: 3,
             hideLabel: true,
           },
           result: {
+            fromCurrency: 'ETH',
             displayValue: '1.266',
             suffix: undefined,
           },
@@ -86,10 +96,12 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
+            fromCurrency: 'ETH',
             denomination: 'GWEI',
             hideLabel: true,
           },
           result: {
+            fromCurrency: 'ETH',
             displayValue: '1',
             suffix: undefined,
           },
@@ -98,10 +110,12 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
+            fromCurrency: 'ETH',
             denomination: 'WEI',
             hideLabel: true,
           },
           result: {
+            fromCurrency: 'ETH',
             displayValue: '1000000000',
             suffix: undefined,
           },
@@ -110,10 +124,12 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
+            fromCurrency: 'ETH',
             numberOfDecimals: 100,
             hideLabel: true,
           },
           result: {
+            fromCurrency: 'ETH',
             displayValue: '1e-9',
             suffix: undefined,
           },
diff --git a/ui/app/components/currency-input/tests/currency-input.component.test.js b/ui/app/components/currency-input/tests/currency-input.component.test.js
index 5db53066f6da..d774801df5a3 100644
--- a/ui/app/components/currency-input/tests/currency-input.component.test.js
+++ b/ui/app/components/currency-input/tests/currency-input.component.test.js
@@ -22,6 +22,7 @@ describe('CurrencyInput Component', () => {
     it('should render properly with a suffix', () => {
       const mockStore = {
         metamask: {
+          fromCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -32,6 +33,7 @@ describe('CurrencyInput Component', () => {
         <Provider store={store}>
           <CurrencyInput
             suffix="ETH"
+            fromCurrency="ETH"
           />
         </Provider>
       )
@@ -45,6 +47,7 @@ describe('CurrencyInput Component', () => {
     it('should render properly with an ETH value', () => {
       const mockStore = {
         metamask: {
+          fromCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -56,6 +59,7 @@ describe('CurrencyInput Component', () => {
           <CurrencyInput
             value="de0b6b3a7640000"
             suffix="ETH"
+            fromCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
           />
@@ -75,6 +79,7 @@ describe('CurrencyInput Component', () => {
     it('should render properly with a fiat value', () => {
       const mockStore = {
         metamask: {
+          fromCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -87,6 +92,7 @@ describe('CurrencyInput Component', () => {
             value="f602f2234d0ea"
             suffix="USD"
             useFiat
+            fromCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
           />
@@ -116,6 +122,7 @@ describe('CurrencyInput Component', () => {
     it('should call onChange and onBlur on input changes with the hex value for ETH', () => {
       const mockStore = {
         metamask: {
+          fromCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -127,6 +134,7 @@ describe('CurrencyInput Component', () => {
             onChange={handleChangeSpy}
             onBlur={handleBlurSpy}
             suffix="ETH"
+            fromCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
           />
@@ -160,6 +168,7 @@ describe('CurrencyInput Component', () => {
     it('should call onChange and onBlur on input changes with the hex value for fiat', () => {
       const mockStore = {
         metamask: {
+          fromCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -171,6 +180,7 @@ describe('CurrencyInput Component', () => {
             onChange={handleChangeSpy}
             onBlur={handleBlurSpy}
             suffix="USD"
+            fromCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
             useFiat
@@ -205,6 +215,7 @@ describe('CurrencyInput Component', () => {
     it('should change the state and pass in a new decimalValue when props.value changes', () => {
       const mockStore = {
         metamask: {
+          fromCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -216,6 +227,7 @@ describe('CurrencyInput Component', () => {
             onChange={handleChangeSpy}
             onBlur={handleBlurSpy}
             suffix="USD"
+            fromCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
             useFiat
diff --git a/ui/app/components/currency-input/tests/currency-input.container.test.js b/ui/app/components/currency-input/tests/currency-input.container.test.js
index e77945e4d11f..902c18571c62 100644
--- a/ui/app/components/currency-input/tests/currency-input.container.test.js
+++ b/ui/app/components/currency-input/tests/currency-input.container.test.js
@@ -20,12 +20,14 @@ describe('CurrencyInput container', () => {
         metamask: {
           conversionRate: 280.45,
           currentCurrency: 'usd',
+          fromCurrency: 'ETH',
         },
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
+        fromCurrency: 'ETH',
       })
     })
   })
@@ -35,12 +37,14 @@ describe('CurrencyInput container', () => {
       const mockStateProps = {
         conversionRate: 280.45,
         currentCurrency: 'usd',
+        fromCurrency: 'ETH',
       }
       const mockDispatchProps = {}
 
       assert.deepEqual(mergeProps(mockStateProps, mockDispatchProps, { useFiat: true }), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
+        fromCurrency: 'ETH',
         useFiat: true,
         suffix: 'USD',
       })
@@ -48,6 +52,7 @@ describe('CurrencyInput container', () => {
       assert.deepEqual(mergeProps(mockStateProps, mockDispatchProps, {}), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
+        fromCurrency: 'ETH',
         suffix: 'ETH',
       })
     })
diff --git a/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js b/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
index 41ad3b73ee22..d017b6168ba4 100644
--- a/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
+++ b/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
@@ -18,6 +18,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
     it('should return the correct props', () => {
       const mockState = {
         metamask: {
+          fromCurrency: 'ETH',
           preferences: {
             useETHAsPrimaryCurrency: true,
           },
@@ -25,6 +26,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
+        fromCurrency: 'ETH',
         useETHAsPrimaryCurrency: true,
       })
     })

From 15d538972c93ff8b8b610a53821b886c6e811924 Mon Sep 17 00:00:00 2001
From: hackyminer <hackyminer@gmail.com>
Date: Thu, 18 Oct 2018 13:28:57 +0900
Subject: [PATCH 12/19] remove unused vars

---
 ui/app/components/account-menu/index.js                        | 2 --
 .../transaction-list-item/transaction-list-item.component.js   | 3 +--
 .../transaction-list-item/transaction-list-item.container.js   | 3 ---
 .../transaction-view-balance.component.js                      | 3 +--
 4 files changed, 2 insertions(+), 9 deletions(-)

diff --git a/ui/app/components/account-menu/index.js b/ui/app/components/account-menu/index.js
index 0126f5686167..c9c5b60e15aa 100644
--- a/ui/app/components/account-menu/index.js
+++ b/ui/app/components/account-menu/index.js
@@ -40,7 +40,6 @@ function mapStateToProps (state) {
     selectedAddress: state.metamask.selectedAddress,
     isAccountMenuOpen: state.metamask.isAccountMenuOpen,
     keyrings: state.metamask.keyrings,
-    ticker: state.metamask.ticker,
     identities: state.metamask.identities,
     accounts: state.metamask.accounts,
   }
@@ -153,7 +152,6 @@ AccountMenu.prototype.renderAccounts = function () {
     identities,
     accounts,
     selectedAddress,
-    ticker,
     keyrings,
     showAccountDetail,
   } = this.props
diff --git a/ui/app/components/transaction-list-item/transaction-list-item.component.js b/ui/app/components/transaction-list-item/transaction-list-item.component.js
index 62da6d5f26b0..88573d2d5da1 100644
--- a/ui/app/components/transaction-list-item/transaction-list-item.component.js
+++ b/ui/app/components/transaction-list-item/transaction-list-item.component.js
@@ -25,7 +25,6 @@ export default class TransactionListItem extends PureComponent {
     showCancel: PropTypes.bool,
     showRetry: PropTypes.bool,
     showTransactionDetailsModal: PropTypes.func,
-    fromCurrency: PropTypes.string,
     token: PropTypes.object,
     tokenData: PropTypes.object,
     transaction: PropTypes.object,
@@ -93,7 +92,7 @@ export default class TransactionListItem extends PureComponent {
   }
 
   renderPrimaryCurrency () {
-    const { token, fromCurrency, transaction: { txParams: { data } = {} } = {}, value } = this.props
+    const { token, transaction: { txParams: { data } = {} } = {}, value } = this.props
 
     return token
       ? (
diff --git a/ui/app/components/transaction-list-item/transaction-list-item.container.js b/ui/app/components/transaction-list-item/transaction-list-item.container.js
index e1d6e0a247e4..72f5f5d618a6 100644
--- a/ui/app/components/transaction-list-item/transaction-list-item.container.js
+++ b/ui/app/components/transaction-list-item/transaction-list-item.container.js
@@ -7,20 +7,17 @@ import { setSelectedToken, retryTransaction, showModal } from '../../actions'
 import { hexToDecimal } from '../../helpers/conversions.util'
 import { getTokenData } from '../../helpers/transactions.util'
 import { formatDate } from '../../util'
-import { getFromCurrency } from '../../selectors.js'
 
 const mapStateToProps = (state, ownProps) => {
   const { transaction: { txParams: { value, nonce, data } = {}, time } = {} } = ownProps
 
   const tokenData = data && getTokenData(data)
   const nonceAndDate = nonce ? `#${hexToDecimal(nonce)} - ${formatDate(time)}` : formatDate(time)
-  const fromCurrency = getFromCurrency(state)
 
   return {
     value,
     nonceAndDate,
     tokenData,
-    fromCurrency,
   }
 }
 
diff --git a/ui/app/components/transaction-view-balance/transaction-view-balance.component.js b/ui/app/components/transaction-view-balance/transaction-view-balance.component.js
index eb407bb3ad85..273845c47b8f 100644
--- a/ui/app/components/transaction-view-balance/transaction-view-balance.component.js
+++ b/ui/app/components/transaction-view-balance/transaction-view-balance.component.js
@@ -18,12 +18,11 @@ export default class TransactionViewBalance extends PureComponent {
     history: PropTypes.object,
     network: PropTypes.string,
     balance: PropTypes.string,
-    fromCurrency: PropTypes.string,
     assetImage: PropTypes.string,
   }
 
   renderBalance () {
-    const { selectedToken, balance, fromCurrency } = this.props
+    const { selectedToken, balance } = this.props
 
     return selectedToken
       ? (

From aa4d0dfb3084ec1c262da958e1517ecd04173c22 Mon Sep 17 00:00:00 2001
From: hackyminer <hackyminer@gmail.com>
Date: Sat, 20 Oct 2018 09:19:57 +0900
Subject: [PATCH 13/19] fixed testcase after rebase

---
 app/scripts/controllers/preferences.js           |  2 +-
 .../controllers/preferences-controller-test.js   | 16 ++++++++--------
 ...referenced-currency-display.container.test.js |  8 ++++++++
 3 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/app/scripts/controllers/preferences.js b/app/scripts/controllers/preferences.js
index 3a7e2a489ef8..b610bd171a53 100644
--- a/app/scripts/controllers/preferences.js
+++ b/app/scripts/controllers/preferences.js
@@ -398,7 +398,7 @@ class PreferencesController {
    * @returns {Promise<array>} Promise resolving to updated frequentRpcList.
    *
    */
-  addToFrequentRpcList (url, chainId, ticker, nickname) {
+  addToFrequentRpcList (url, chainId, ticker = 'ETH', nickname = '') {
     const rpcList = this.getFrequentRpcListDetail()
     const index = rpcList.findIndex((element) => { return element.rpcUrl === url })
     if (index !== -1) {
diff --git a/test/unit/app/controllers/preferences-controller-test.js b/test/unit/app/controllers/preferences-controller-test.js
index 7f2804a83588..c64c47ae9834 100644
--- a/test/unit/app/controllers/preferences-controller-test.js
+++ b/test/unit/app/controllers/preferences-controller-test.js
@@ -487,20 +487,20 @@ describe('preferences controller', function () {
 
   describe('on updateFrequentRpcList', function () {
     it('should add custom RPC url to state', function () {
-      preferencesController.addToFrequentRpcList('rpc_url')
-      preferencesController.addToFrequentRpcList('http://localhost:8545')
-      assert.deepEqual(preferencesController.store.getState().frequentRpcList, ['rpc_url'])
-      preferencesController.addToFrequentRpcList('rpc_url')
-      assert.deepEqual(preferencesController.store.getState().frequentRpcList, ['rpc_url'])
+      preferencesController.addToFrequentRpcList('rpc_url', 1)
+      preferencesController.addToFrequentRpcList('http://localhost:8545', 1)
+      assert.deepEqual(preferencesController.store.getState().frequentRpcListDetail, [{ rpcUrl: 'rpc_url', chainId: 1, ticker: 'ETH', nickname: '' }] )
+      preferencesController.addToFrequentRpcList('rpc_url', 1)
+      assert.deepEqual(preferencesController.store.getState().frequentRpcListDetail, [{ rpcUrl: 'rpc_url', chainId: 1, ticker: 'ETH', nickname: '' }] )
     })
 
     it('should remove custom RPC url from state', function () {
-      preferencesController.addToFrequentRpcList('rpc_url')
-      assert.deepEqual(preferencesController.store.getState().frequentRpcList, ['rpc_url'])
+      preferencesController.addToFrequentRpcList('rpc_url', 1)
+      assert.deepEqual(preferencesController.store.getState().frequentRpcListDetail, [{ rpcUrl: 'rpc_url', chainId: 1, ticker: 'ETH', nickname: '' }] )
       preferencesController.removeFromFrequentRpcList('other_rpc_url')
       preferencesController.removeFromFrequentRpcList('http://localhost:8545')
       preferencesController.removeFromFrequentRpcList('rpc_url')
-      assert.deepEqual(preferencesController.store.getState().frequentRpcList, [])
+      assert.deepEqual(preferencesController.store.getState().frequentRpcListDetail, [])
     })
   })
 })
diff --git a/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js b/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
index d017b6168ba4..00a6079f4ca2 100644
--- a/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
+++ b/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
@@ -40,12 +40,14 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         {
           stateProps: {
             useETHAsPrimaryCurrency: true,
+            fromCurrency: 'ETH',
           },
           ownProps: {
             type: 'PRIMARY',
           },
           result: {
             currency: 'ETH',
+            fromCurrency: 'ETH',
             numberOfDecimals: 6,
             prefix: undefined,
           },
@@ -53,12 +55,14 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         {
           stateProps: {
             useETHAsPrimaryCurrency: false,
+            fromCurrency: 'ETH',
           },
           ownProps: {
             type: 'PRIMARY',
           },
           result: {
             currency: undefined,
+            fromCurrency: 'ETH',
             numberOfDecimals: 2,
             prefix: undefined,
           },
@@ -66,6 +70,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         {
           stateProps: {
             useETHAsPrimaryCurrency: true,
+            fromCurrency: 'ETH',
           },
           ownProps: {
             type: 'SECONDARY',
@@ -73,6 +78,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
             fiatPrefix: '-',
           },
           result: {
+            fromCurrency: 'ETH',
             currency: undefined,
             numberOfDecimals: 4,
             prefix: '-',
@@ -81,6 +87,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         {
           stateProps: {
             useETHAsPrimaryCurrency: false,
+            fromCurrency: 'ETH',
           },
           ownProps: {
             type: 'SECONDARY',
@@ -91,6 +98,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
           },
           result: {
             currency: 'ETH',
+            fromCurrency: 'ETH',
             numberOfDecimals: 3,
             prefix: 'b',
           },

From 47c4508cfbe125fa067514718cb40a8f4aed5cc0 Mon Sep 17 00:00:00 2001
From: Whymarrh Whitby <whymarrh.whitby@gmail.com>
Date: Thu, 25 Oct 2018 12:32:28 +0200
Subject: [PATCH 14/19] Rename fromCurrency to nativeCurrency in
 CurrencyController

---
 app/scripts/controllers/currency.js           | 32 +++++++++--------
 app/scripts/metamask-controller.js            |  8 ++---
 test/data/mock-state.json                     |  2 +-
 ui/app/components/balance-component.js        |  8 ++---
 .../currency-display.container.js             | 10 +++---
 .../tests/currency-display.component.test.js  |  4 +--
 .../tests/currency-display.container.test.js  | 34 +++++++++----------
 .../currency-input.container.js               |  8 ++---
 .../tests/currency-input.component.test.js    | 24 ++++++-------
 .../tests/currency-input.container.test.js    | 10 +++---
 .../account-list-item.container.js            |  4 +--
 .../tests/account-list-item-component.test.js |  2 +-
 .../tests/account-list-item-container.test.js |  4 +--
 ui/app/components/send/send.selectors.js      |  6 ++--
 .../send/tests/send-selectors-test-data.js    |  1 +
 .../send/tests/send-selectors.test.js         |  6 ++--
 ...transaction-activity-log.container.test.js |  4 +--
 .../transaction-activity-log.component.js     | 12 +++----
 .../transaction-activity-log.container.js     |  4 +--
 .../transaction-view-balance.container.js     |  4 +--
 ...erenced-currency-display.container.test.js | 20 +++++------
 ...-preferenced-currency-display.component.js |  2 +-
 ...-preferenced-currency-display.container.js |  8 ++---
 ui/app/ducks/confirm-transaction.duck.js      | 14 ++++----
 ui/app/selectors.js                           |  6 ++--
 ui/app/selectors/confirm-transaction.js       |  2 +-
 26 files changed, 122 insertions(+), 117 deletions(-)

diff --git a/app/scripts/controllers/currency.js b/app/scripts/controllers/currency.js
index 661136296df6..1e866d2c93d7 100644
--- a/app/scripts/controllers/currency.js
+++ b/app/scripts/controllers/currency.js
@@ -21,14 +21,15 @@ class CurrencyController {
    * since midnight of January 1, 1970
    * @property {number} conversionInterval The id of the interval created by the scheduleConversionInterval method.
    * Used to clear an existing interval on subsequent calls of that method.
+   * @property {string} nativeCurrency The ticker/symbol of the native chain currency
    *
    */
   constructor (opts = {}) {
     const initState = extend({
-      fromCurrency: 'ETH',
       currentCurrency: 'usd',
       conversionRate: 0,
       conversionDate: 'N/A',
+      nativeCurrency: 'ETH',
     }, opts.initState)
     this.store = new ObservableStore(initState)
   }
@@ -38,23 +39,26 @@ class CurrencyController {
   //
 
   /**
-   * A getter for the fromCurrency property
+   * A getter for the nativeCurrency property
    *
    * @returns {string} A 2-4 character shorthand that describes the specific currency
    *
    */
-  getFromCurrency () {
-    return this.store.getState().fromCurrency
+  getNativeCurrency () {
+    return this.store.getState().nativeCurrency
   }
 
   /**
-   * A setter for the fromCurrency property
+   * A setter for the nativeCurrency property
    *
-   * @param {string} fromCurrency The new currency to set as the fromCurrency in the store
+   * @param {string} nativeCurrency The new currency to set as the nativeCurrency in the store
    *
    */
-  setFromCurrency (fromCurrency) {
-    this.store.updateState({ ticker: fromCurrency, fromCurrency })
+  setNativeCurrency (nativeCurrency) {
+    this.store.updateState({
+      nativeCurrency,
+      ticker: nativeCurrency,
+    })
   }
 
   /**
@@ -125,19 +129,19 @@ class CurrencyController {
    *
    */
   async updateConversionRate () {
-    let currentCurrency, fromCurrency
+    let currentCurrency, nativeCurrency
     try {
       currentCurrency = this.getCurrentCurrency()
-      fromCurrency = this.getFromCurrency()
+      nativeCurrency = this.getNativeCurrency()
       let apiUrl
-      if (fromCurrency === 'ETH') {
+      if (nativeCurrency === 'ETH') {
         apiUrl = `https://api.infura.io/v1/ticker/eth${currentCurrency.toLowerCase()}`
       } else {
-        apiUrl = `https://min-api.cryptocompare.com/data/price?fsym=${fromCurrency.toUpperCase()}&tsyms=${currentCurrency.toUpperCase()}`
+        apiUrl = `https://min-api.cryptocompare.com/data/price?fsym=${nativeCurrency.toUpperCase()}&tsyms=${currentCurrency.toUpperCase()}`
       }
       const response = await fetch(apiUrl)
       const parsedResponse = await response.json()
-      if (fromCurrency === 'ETH') {
+      if (nativeCurrency === 'ETH') {
         this.setConversionRate(Number(parsedResponse.bid))
         this.setConversionDate(Number(parsedResponse.timestamp))
       } else {
@@ -150,7 +154,7 @@ class CurrencyController {
         }
       }
     } catch (err) {
-      log.warn(`MetaMask - Failed to query currency conversion:`, fromCurrency, currentCurrency, err)
+      log.warn(`MetaMask - Failed to query currency conversion:`, nativeCurrency, currentCurrency, err)
       this.setConversionRate(0)
       this.setConversionDate('N/A')
     }
diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js
index fc238e4e3e6a..3778dbdb6753 100644
--- a/app/scripts/metamask-controller.js
+++ b/app/scripts/metamask-controller.js
@@ -138,12 +138,12 @@ module.exports = class MetamaskController extends EventEmitter {
         this.accountTracker.stop()
       }
     })
-     
+
     // ensure accountTracker updates balances after network change
     this.networkController.on('networkDidChange', () => {
       this.accountTracker._updateAccounts()
     })
-      
+
     // key mgmt
     const additionalKeyrings = [TrezorKeyring, LedgerBridgeKeyring]
     this.keyringController = new KeyringController({
@@ -1416,11 +1416,11 @@ module.exports = class MetamaskController extends EventEmitter {
   setCurrentCurrency (currencyCode, cb) {
     const { ticker } = this.networkController.getNetworkConfig()
     try {
-      this.currencyController.setFromCurrency(ticker)
+      this.currencyController.setNativeCurrency(ticker)
       this.currencyController.setCurrentCurrency(currencyCode)
       this.currencyController.updateConversionRate()
       const data = {
-        fromCurrency: ticker || 'ETH',
+        nativeCurrency: ticker || 'ETH',
         conversionRate: this.currencyController.getConversionRate(),
         currentCurrency: this.currencyController.getCurrentCurrency(),
         conversionDate: this.currencyController.getConversionDate(),
diff --git a/test/data/mock-state.json b/test/data/mock-state.json
index 454c5f09ef77..8deff5531265 100644
--- a/test/data/mock-state.json
+++ b/test/data/mock-state.json
@@ -113,7 +113,7 @@
     },
     "ticker": "ETH",
     "currentCurrency": "usd",
-    "fromCurrency": "ETH",
+    "nativeCurrency": "ETH",
     "conversionRate": 556.12,
     "addressBook": [
       {
diff --git a/ui/app/components/balance-component.js b/ui/app/components/balance-component.js
index 4945103fd640..cd03539618c1 100644
--- a/ui/app/components/balance-component.js
+++ b/ui/app/components/balance-component.js
@@ -6,7 +6,7 @@ const TokenBalance = require('./token-balance')
 const Identicon = require('./identicon')
 import UserPreferencedCurrencyDisplay from './user-preferenced-currency-display'
 import { PRIMARY, SECONDARY } from '../constants/common'
-const { getFromCurrency, getAssetImages, conversionRateSelector, getCurrentCurrency} = require('../selectors')
+const { getNativeCurrency, getAssetImages, conversionRateSelector, getCurrentCurrency} = require('../selectors')
 
 const { formatBalance } = require('../util')
 
@@ -21,7 +21,7 @@ function mapStateToProps (state) {
   return {
     account,
     network,
-    fromCurrency: getFromCurrency(state),
+    nativeCurrency: getNativeCurrency(state),
     conversionRate: conversionRateSelector(state),
     currentCurrency: getCurrentCurrency(state),
     assetImages: getAssetImages(state),
@@ -67,10 +67,10 @@ BalanceComponent.prototype.renderTokenBalance = function () {
 
 BalanceComponent.prototype.renderBalance = function () {
   const props = this.props
-  const { account, fromCurrency } = props
+  const { account, nativeCurrency } = props
   const balanceValue = account && account.balance
   const needsParse = 'needsParse' in props ? props.needsParse : true
-  const formattedBalance = balanceValue ? formatBalance(balanceValue, 6, needsParse, fromCurrency) : '...'
+  const formattedBalance = balanceValue ? formatBalance(balanceValue, 6, needsParse, nativeCurrency) : '...'
   const showFiat = 'showFiat' in props ? props.showFiat : true
 
   if (formattedBalance === 'None' || formattedBalance === '...') {
diff --git a/ui/app/components/currency-display/currency-display.container.js b/ui/app/components/currency-display/currency-display.container.js
index 3852985dbe93..60e1487cc49f 100644
--- a/ui/app/components/currency-display/currency-display.container.js
+++ b/ui/app/components/currency-display/currency-display.container.js
@@ -3,17 +3,17 @@ import CurrencyDisplay from './currency-display.component'
 import { getValueFromWeiHex, formatCurrency } from '../../helpers/confirm-transaction/util'
 
 const mapStateToProps = state => {
-  const { metamask: { fromCurrency, currentCurrency, conversionRate } } = state
+  const { metamask: { nativeCurrency, currentCurrency, conversionRate } } = state
 
   return {
     currentCurrency,
     conversionRate,
-    fromCurrency,
+    nativeCurrency,
   }
 }
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const { fromCurrency, currentCurrency, conversionRate, ...restStateProps } = stateProps
+  const { nativeCurrency, currentCurrency, conversionRate, ...restStateProps } = stateProps
   const {
     value,
     numberOfDecimals = 2,
@@ -23,9 +23,9 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
     ...restOwnProps
   } = ownProps
 
-  const toCurrency = currency === 'ETH' ? fromCurrency || currency : currency || currentCurrency
+  const toCurrency = currency === 'ETH' ? nativeCurrency || currency : currency || currentCurrency
   const convertedValue = getValueFromWeiHex({
-    value, fromCurrency, toCurrency, conversionRate, numberOfDecimals, toDenomination: denomination,
+    value, nativeCurrency, toCurrency, conversionRate, numberOfDecimals, toDenomination: denomination,
   })
   const displayValue = formatCurrency(convertedValue, toCurrency)
   const suffix = hideLabel ? undefined : toCurrency.toUpperCase()
diff --git a/ui/app/components/currency-display/tests/currency-display.component.test.js b/ui/app/components/currency-display/tests/currency-display.component.test.js
index 2fbc6bd08d1f..56825829c7f1 100644
--- a/ui/app/components/currency-display/tests/currency-display.component.test.js
+++ b/ui/app/components/currency-display/tests/currency-display.component.test.js
@@ -6,7 +6,7 @@ import CurrencyDisplay from '../currency-display.component'
 describe('CurrencyDisplay Component', () => {
   it('should render text with a className', () => {
     const wrapper = shallow(<CurrencyDisplay
-      fromCurrency={'ETH'}
+      nativeCurrency={'ETH'}
       displayValue="$123.45"
       className="currency-display"
     />)
@@ -17,7 +17,7 @@ describe('CurrencyDisplay Component', () => {
 
   it('should render text with a prefix', () => {
     const wrapper = shallow(<CurrencyDisplay
-      fromCurrency={'ETH'}
+      nativeCurrency={'ETH'}
       displayValue="$123.45"
       className="currency-display"
       prefix="-"
diff --git a/ui/app/components/currency-display/tests/currency-display.container.test.js b/ui/app/components/currency-display/tests/currency-display.container.test.js
index 7a422a656dea..af07e081141b 100644
--- a/ui/app/components/currency-display/tests/currency-display.container.test.js
+++ b/ui/app/components/currency-display/tests/currency-display.container.test.js
@@ -20,14 +20,14 @@ describe('CurrencyDisplay container', () => {
         metamask: {
           conversionRate: 280.45,
           currentCurrency: 'usd',
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
         },
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
-        fromCurrency: 'ETH',
+        nativeCurrency: 'ETH',
       })
     })
   })
@@ -37,7 +37,7 @@ describe('CurrencyDisplay container', () => {
       const mockStateProps = {
         conversionRate: 280.45,
         currentCurrency: 'usd',
-        fromCurrency: 'ETH',
+        nativeCurrency: 'ETH',
       }
 
       const tests = [
@@ -46,48 +46,48 @@ describe('CurrencyDisplay container', () => {
             value: '0x2386f26fc10000',
             numberOfDecimals: 2,
             currency: 'usd',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
           result: {
             displayValue: '$2.80',
             suffix: 'USD',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x2386f26fc10000',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
           result: {
             displayValue: '$2.80',
             suffix: 'USD',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x1193461d01595930',
             currency: 'ETH',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             numberOfDecimals: 3,
           },
           result: {
             displayValue: '1.266',
             suffix: 'ETH',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x1193461d01595930',
             currency: 'ETH',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             numberOfDecimals: 3,
             hideLabel: true,
           },
           result: {
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             displayValue: '1.266',
             suffix: undefined,
           },
@@ -96,12 +96,12 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             denomination: 'GWEI',
             hideLabel: true,
           },
           result: {
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             displayValue: '1',
             suffix: undefined,
           },
@@ -110,12 +110,12 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             denomination: 'WEI',
             hideLabel: true,
           },
           result: {
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             displayValue: '1000000000',
             suffix: undefined,
           },
@@ -124,12 +124,12 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             numberOfDecimals: 100,
             hideLabel: true,
           },
           result: {
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             displayValue: '1e-9',
             suffix: undefined,
           },
diff --git a/ui/app/components/currency-input/currency-input.container.js b/ui/app/components/currency-input/currency-input.container.js
index ad88b30c4c74..1d1ed7b41597 100644
--- a/ui/app/components/currency-input/currency-input.container.js
+++ b/ui/app/components/currency-input/currency-input.container.js
@@ -3,19 +3,19 @@ import CurrencyInput from './currency-input.component'
 import { ETH } from '../../constants/common'
 
 const mapStateToProps = state => {
-  const { metamask: { fromCurrency, currentCurrency, conversionRate } } = state
+  const { metamask: { nativeCurrency, currentCurrency, conversionRate } } = state
 
   return {
-    fromCurrency,
+    nativeCurrency,
     currentCurrency,
     conversionRate,
   }
 }
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const { fromCurrency, currentCurrency } = stateProps
+  const { nativeCurrency, currentCurrency } = stateProps
   const { useFiat } = ownProps
-  const suffix = useFiat ? currentCurrency.toUpperCase() : fromCurrency || ETH
+  const suffix = useFiat ? currentCurrency.toUpperCase() : nativeCurrency || ETH
 
   return {
     ...stateProps,
diff --git a/ui/app/components/currency-input/tests/currency-input.component.test.js b/ui/app/components/currency-input/tests/currency-input.component.test.js
index d774801df5a3..a33889f94a31 100644
--- a/ui/app/components/currency-input/tests/currency-input.component.test.js
+++ b/ui/app/components/currency-input/tests/currency-input.component.test.js
@@ -22,7 +22,7 @@ describe('CurrencyInput Component', () => {
     it('should render properly with a suffix', () => {
       const mockStore = {
         metamask: {
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -33,7 +33,7 @@ describe('CurrencyInput Component', () => {
         <Provider store={store}>
           <CurrencyInput
             suffix="ETH"
-            fromCurrency="ETH"
+            nativeCurrency="ETH"
           />
         </Provider>
       )
@@ -47,7 +47,7 @@ describe('CurrencyInput Component', () => {
     it('should render properly with an ETH value', () => {
       const mockStore = {
         metamask: {
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -59,7 +59,7 @@ describe('CurrencyInput Component', () => {
           <CurrencyInput
             value="de0b6b3a7640000"
             suffix="ETH"
-            fromCurrency="ETH"
+            nativeCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
           />
@@ -79,7 +79,7 @@ describe('CurrencyInput Component', () => {
     it('should render properly with a fiat value', () => {
       const mockStore = {
         metamask: {
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -92,7 +92,7 @@ describe('CurrencyInput Component', () => {
             value="f602f2234d0ea"
             suffix="USD"
             useFiat
-            fromCurrency="ETH"
+            nativeCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
           />
@@ -122,7 +122,7 @@ describe('CurrencyInput Component', () => {
     it('should call onChange and onBlur on input changes with the hex value for ETH', () => {
       const mockStore = {
         metamask: {
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -134,7 +134,7 @@ describe('CurrencyInput Component', () => {
             onChange={handleChangeSpy}
             onBlur={handleBlurSpy}
             suffix="ETH"
-            fromCurrency="ETH"
+            nativeCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
           />
@@ -168,7 +168,7 @@ describe('CurrencyInput Component', () => {
     it('should call onChange and onBlur on input changes with the hex value for fiat', () => {
       const mockStore = {
         metamask: {
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -180,7 +180,7 @@ describe('CurrencyInput Component', () => {
             onChange={handleChangeSpy}
             onBlur={handleBlurSpy}
             suffix="USD"
-            fromCurrency="ETH"
+            nativeCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
             useFiat
@@ -215,7 +215,7 @@ describe('CurrencyInput Component', () => {
     it('should change the state and pass in a new decimalValue when props.value changes', () => {
       const mockStore = {
         metamask: {
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
           currentCurrency: 'usd',
           conversionRate: 231.06,
         },
@@ -227,7 +227,7 @@ describe('CurrencyInput Component', () => {
             onChange={handleChangeSpy}
             onBlur={handleBlurSpy}
             suffix="USD"
-            fromCurrency="ETH"
+            nativeCurrency="ETH"
             currentCurrency="usd"
             conversionRate={231.06}
             useFiat
diff --git a/ui/app/components/currency-input/tests/currency-input.container.test.js b/ui/app/components/currency-input/tests/currency-input.container.test.js
index 902c18571c62..5d72958e6549 100644
--- a/ui/app/components/currency-input/tests/currency-input.container.test.js
+++ b/ui/app/components/currency-input/tests/currency-input.container.test.js
@@ -20,14 +20,14 @@ describe('CurrencyInput container', () => {
         metamask: {
           conversionRate: 280.45,
           currentCurrency: 'usd',
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
         },
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
-        fromCurrency: 'ETH',
+        nativeCurrency: 'ETH',
       })
     })
   })
@@ -37,14 +37,14 @@ describe('CurrencyInput container', () => {
       const mockStateProps = {
         conversionRate: 280.45,
         currentCurrency: 'usd',
-        fromCurrency: 'ETH',
+        nativeCurrency: 'ETH',
       }
       const mockDispatchProps = {}
 
       assert.deepEqual(mergeProps(mockStateProps, mockDispatchProps, { useFiat: true }), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
-        fromCurrency: 'ETH',
+        nativeCurrency: 'ETH',
         useFiat: true,
         suffix: 'USD',
       })
@@ -52,7 +52,7 @@ describe('CurrencyInput container', () => {
       assert.deepEqual(mergeProps(mockStateProps, mockDispatchProps, {}), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
-        fromCurrency: 'ETH',
+        nativeCurrency: 'ETH',
         suffix: 'ETH',
       })
     })
diff --git a/ui/app/components/send/account-list-item/account-list-item.container.js b/ui/app/components/send/account-list-item/account-list-item.container.js
index 9e59e3ee04e4..f8e73d923305 100644
--- a/ui/app/components/send/account-list-item/account-list-item.container.js
+++ b/ui/app/components/send/account-list-item/account-list-item.container.js
@@ -2,7 +2,7 @@ import { connect } from 'react-redux'
 import {
     getConversionRate,
     getCurrentCurrency,
-    getFromCurrency,
+    getNativeCurrency,
 } from '../send.selectors.js'
 import AccountListItem from './account-list-item.component'
 
@@ -12,6 +12,6 @@ function mapStateToProps (state) {
   return {
     conversionRate: getConversionRate(state),
     currentCurrency: getCurrentCurrency(state),
-    fromCurrency: getFromCurrency(state),
+    nativeCurrency: getNativeCurrency(state),
   }
 }
diff --git a/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js b/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
index 018894b61b62..6ffc0b1c6795 100644
--- a/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
+++ b/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
@@ -28,7 +28,7 @@ describe('AccountListItem Component', function () {
       className={'mockClassName'}
       conversionRate={4}
       currentCurrency={'mockCurrentyCurrency'}
-      fromCurrency={'ETH'}
+      nativeCurrency={'ETH'}
       displayAddress={false}
       displayBalance={false}
       handleClick={propsMethodSpies.handleClick}
diff --git a/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js b/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
index 0b4051e91a21..7c2f5fcb258d 100644
--- a/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
+++ b/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
@@ -13,7 +13,7 @@ proxyquire('../account-list-item.container.js', {
   '../send.selectors.js': {
     getConversionRate: (s) => `mockConversionRate:${s}`,
     getCurrentCurrency: (s) => `mockCurrentCurrency:${s}`,
-    getFromCurrency: (s) => `mockFromCurrency:${s}`,
+    getNativeCurrency: (s) => `mockNativeCurrency:${s}`,
   },
 })
 
@@ -25,7 +25,7 @@ describe('account-list-item container', () => {
       assert.deepEqual(mapStateToProps('mockState'), {
         conversionRate: 'mockConversionRate:mockState',
         currentCurrency: 'mockCurrentCurrency:mockState',
-        fromCurrency: 'mockFromCurrency:mockState',
+        nativeCurrency: 'mockNativeCurrency:mockState',
       })
     })
 
diff --git a/ui/app/components/send/send.selectors.js b/ui/app/components/send/send.selectors.js
index 1cff9eaf8ccf..eb22a08b7337 100644
--- a/ui/app/components/send/send.selectors.js
+++ b/ui/app/components/send/send.selectors.js
@@ -19,7 +19,7 @@ const selectors = {
   getCurrentNetwork,
   getCurrentViewContext,
   getForceGasMin,
-  getFromCurrency,
+  getNativeCurrency,
   getGasLimit,
   getGasPrice,
   getGasPriceFromRecentBlocks,
@@ -112,8 +112,8 @@ function getCurrentCurrency (state) {
   return state.metamask.currentCurrency
 }
 
-function getFromCurrency (state) {
-  return state.metamask.fromCurrency || 'ETH'
+function getNativeCurrency (state) {
+  return state.metamask.nativeCurrency
 }
 
 function getCurrentNetwork (state) {
diff --git a/ui/app/components/send/tests/send-selectors-test-data.js b/ui/app/components/send/tests/send-selectors-test-data.js
index 8b939dadbf00..30a2666cf1c3 100644
--- a/ui/app/components/send/tests/send-selectors-test-data.js
+++ b/ui/app/components/send/tests/send-selectors-test-data.js
@@ -26,6 +26,7 @@ module.exports = {
     'currentCurrency': 'USD',
     'conversionRate': 1200.88200327,
     'conversionDate': 1489013762,
+    'nativeCurrency': 'ETH',
     'noActiveNotices': true,
     'frequentRpcList': [],
     'network': '3',
diff --git a/ui/app/components/send/tests/send-selectors.test.js b/ui/app/components/send/tests/send-selectors.test.js
index 6a5ef2f531fa..e7e901f0d431 100644
--- a/ui/app/components/send/tests/send-selectors.test.js
+++ b/ui/app/components/send/tests/send-selectors.test.js
@@ -12,7 +12,7 @@ const {
   getCurrentCurrency,
   getCurrentNetwork,
   getCurrentViewContext,
-  getFromCurrency,
+  getNativeCurrency,
   getForceGasMin,
   getGasLimit,
   getGasPrice,
@@ -179,10 +179,10 @@ describe('send selectors', () => {
     })
   })
 
-  describe('getFromCurrency()', () => {
+  describe('getNativeCurrency()', () => {
     it('should return the ticker symbol of the selected network', () => {
       assert.equal(
-        getFromCurrency(mockState),
+        getNativeCurrency(mockState),
         'ETH'
       )
     })
diff --git a/ui/app/components/transaction-activity-log/tests/transaction-activity-log.container.test.js b/ui/app/components/transaction-activity-log/tests/transaction-activity-log.container.test.js
index c81944732635..a7c35f51ecda 100644
--- a/ui/app/components/transaction-activity-log/tests/transaction-activity-log.container.test.js
+++ b/ui/app/components/transaction-activity-log/tests/transaction-activity-log.container.test.js
@@ -18,11 +18,11 @@ describe('TransactionActivityLog container', () => {
       const mockState = {
         metamask: {
           conversionRate: 280.45,
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
         },
       }
 
-      assert.deepEqual(mapStateToProps(mockState), { conversionRate: 280.45, fromCurrency: 'ETH' })
+      assert.deepEqual(mapStateToProps(mockState), { conversionRate: 280.45, nativeCurrency: 'ETH' })
     })
   })
 })
diff --git a/ui/app/components/transaction-activity-log/transaction-activity-log.component.js b/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
index 85c0e4d9c7e4..357ef626c767 100644
--- a/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
+++ b/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
@@ -15,7 +15,7 @@ export default class TransactionActivityLog extends PureComponent {
     transaction: PropTypes.object,
     className: PropTypes.string,
     conversionRate: PropTypes.number,
-    fromCurrency: PropTypes.string,
+    nativeCurrency: PropTypes.string,
   }
 
   state = {
@@ -41,17 +41,17 @@ export default class TransactionActivityLog extends PureComponent {
   }
 
   renderActivity (activity, index) {
-    const { conversionRate, fromCurrency } = this.props
+    const { conversionRate, nativeCurrency } = this.props
     const { eventKey, value, timestamp } = activity
     const ethValue = index === 0
       ? `${getValueFromWeiHex({
         value,
-        fromCurrency,
-        toCurrency: fromCurrency,
+        nativeCurrency,
+        toCurrency: nativeCurrency,
         conversionRate,
         numberOfDecimals: 6,
-      })} ${fromCurrency}`
-      : getEthConversionFromWeiHex({ value, fromCurrency, toCurrency: fromCurrency, conversionRate })
+      })} ${nativeCurrency}`
+      : getEthConversionFromWeiHex({ value, nativeCurrency, toCurrency: nativeCurrency, conversionRate })
     const formattedTimestamp = formatDate(timestamp)
     const activityText = this.context.t(eventKey, [ethValue, formattedTimestamp])
 
diff --git a/ui/app/components/transaction-activity-log/transaction-activity-log.container.js b/ui/app/components/transaction-activity-log/transaction-activity-log.container.js
index 83e354c7c460..622f77df1312 100644
--- a/ui/app/components/transaction-activity-log/transaction-activity-log.container.js
+++ b/ui/app/components/transaction-activity-log/transaction-activity-log.container.js
@@ -1,11 +1,11 @@
 import { connect } from 'react-redux'
 import TransactionActivityLog from './transaction-activity-log.component'
-import { conversionRateSelector, getFromCurrency } from '../../selectors'
+import { conversionRateSelector, getNativeCurrency } from '../../selectors'
 
 const mapStateToProps = state => {
   return {
     conversionRate: conversionRateSelector(state),
-    fromCurrency: getFromCurrency(state),
+    nativeCurrency: getNativeCurrency(state),
   }
 }
 
diff --git a/ui/app/components/transaction-view-balance/transaction-view-balance.container.js b/ui/app/components/transaction-view-balance/transaction-view-balance.container.js
index 24b4ddd16f30..cb8078ec1dd0 100644
--- a/ui/app/components/transaction-view-balance/transaction-view-balance.container.js
+++ b/ui/app/components/transaction-view-balance/transaction-view-balance.container.js
@@ -2,7 +2,7 @@ import { connect } from 'react-redux'
 import { withRouter } from 'react-router-dom'
 import { compose } from 'recompose'
 import TransactionViewBalance from './transaction-view-balance.component'
-import { getSelectedToken, getSelectedAddress, getFromCurrency, getSelectedTokenAssetImage } from '../../selectors'
+import { getSelectedToken, getSelectedAddress, getNativeCurrency, getSelectedTokenAssetImage } from '../../selectors'
 import { showModal } from '../../actions'
 
 const mapStateToProps = state => {
@@ -15,7 +15,7 @@ const mapStateToProps = state => {
     selectedToken: getSelectedToken(state),
     network,
     balance,
-    fromCurrency: getFromCurrency(state),
+    nativeCurrency: getNativeCurrency(state),
     assetImage: getSelectedTokenAssetImage(state),
   }
 }
diff --git a/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js b/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
index 00a6079f4ca2..cf06a3613d92 100644
--- a/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
+++ b/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
@@ -18,7 +18,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
     it('should return the correct props', () => {
       const mockState = {
         metamask: {
-          fromCurrency: 'ETH',
+          nativeCurrency: 'ETH',
           preferences: {
             useETHAsPrimaryCurrency: true,
           },
@@ -26,7 +26,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
-        fromCurrency: 'ETH',
+        nativeCurrency: 'ETH',
         useETHAsPrimaryCurrency: true,
       })
     })
@@ -40,14 +40,14 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         {
           stateProps: {
             useETHAsPrimaryCurrency: true,
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
           ownProps: {
             type: 'PRIMARY',
           },
           result: {
             currency: 'ETH',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             numberOfDecimals: 6,
             prefix: undefined,
           },
@@ -55,14 +55,14 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         {
           stateProps: {
             useETHAsPrimaryCurrency: false,
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
           ownProps: {
             type: 'PRIMARY',
           },
           result: {
             currency: undefined,
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             numberOfDecimals: 2,
             prefix: undefined,
           },
@@ -70,7 +70,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         {
           stateProps: {
             useETHAsPrimaryCurrency: true,
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
           ownProps: {
             type: 'SECONDARY',
@@ -78,7 +78,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
             fiatPrefix: '-',
           },
           result: {
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             currency: undefined,
             numberOfDecimals: 4,
             prefix: '-',
@@ -87,7 +87,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         {
           stateProps: {
             useETHAsPrimaryCurrency: false,
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
           },
           ownProps: {
             type: 'SECONDARY',
@@ -98,7 +98,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
           },
           result: {
             currency: 'ETH',
-            fromCurrency: 'ETH',
+            nativeCurrency: 'ETH',
             numberOfDecimals: 3,
             prefix: 'b',
           },
diff --git a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.component.js b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.component.js
index be3dbe8f6716..f2a834ea7402 100644
--- a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.component.js
+++ b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.component.js
@@ -21,7 +21,7 @@ export default class UserPreferencedCurrencyDisplay extends PureComponent {
     fiatPrefix: PropTypes.string,
     // From container
     currency: PropTypes.string,
-    fromCurrency: PropTypes.string,
+    nativeCurrency: PropTypes.string,
   }
 
   renderEthLogo () {
diff --git a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
index d84aa19fbb1c..28329b3dfd76 100644
--- a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
+++ b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
@@ -8,12 +8,12 @@ const mapStateToProps = (state, ownProps) => {
 
   return {
     useETHAsPrimaryCurrency,
-    fromCurrency: state.metamask.fromCurrency,
+    nativeCurrency: state.metamask.nativeCurrency,
   }
 }
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const { useETHAsPrimaryCurrency, fromCurrency, ...restStateProps } = stateProps
+  const { useETHAsPrimaryCurrency, nativeCurrency, ...restStateProps } = stateProps
   const {
     type,
     numberOfDecimals: propsNumberOfDecimals,
@@ -30,7 +30,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
   if (type === PRIMARY && useETHAsPrimaryCurrency ||
     type === SECONDARY && !useETHAsPrimaryCurrency) {
     // Display ETH
-    currency = fromCurrency || ETH
+    currency = nativeCurrency || ETH
     numberOfDecimals = propsNumberOfDecimals || ethNumberOfDecimals || 6
     prefix = propsPrefix || ethPrefix
   } else if (type === SECONDARY && useETHAsPrimaryCurrency ||
@@ -44,7 +44,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
     ...restStateProps,
     ...dispatchProps,
     ...restOwnProps,
-    fromCurrency,
+    nativeCurrency,
     currency,
     numberOfDecimals,
     prefix,
diff --git a/ui/app/ducks/confirm-transaction.duck.js b/ui/app/ducks/confirm-transaction.duck.js
index 8506f1765359..4d3a31c699e5 100644
--- a/ui/app/ducks/confirm-transaction.duck.js
+++ b/ui/app/ducks/confirm-transaction.duck.js
@@ -2,7 +2,7 @@ import {
   conversionRateSelector,
   currentCurrencySelector,
   unconfirmedTransactionsHashSelector,
-  getFromCurrency,
+  getNativeCurrency,
 } from '../selectors/confirm-transaction'
 
 import {
@@ -293,17 +293,17 @@ export function updateTxDataAndCalculate (txData) {
     const state = getState()
     const currentCurrency = currentCurrencySelector(state)
     const conversionRate = conversionRateSelector(state)
-    const fromCurrency = getFromCurrency(state)
+    const nativeCurrency = getNativeCurrency(state)
 
     dispatch(updateTxData(txData))
 
     const { txParams: { value = '0x0', gas: gasLimit = '0x0', gasPrice = '0x0' } = {} } = txData
 
     const fiatTransactionAmount = getValueFromWeiHex({
-      value, fromCurrency, toCurrency: currentCurrency, conversionRate, numberOfDecimals: 2,
+      value, fromCurrency: nativeCurrency, toCurrency: currentCurrency, conversionRate, numberOfDecimals: 2,
     })
     const ethTransactionAmount = getValueFromWeiHex({
-      value, fromCurrency, toCurrency: fromCurrency, conversionRate, numberOfDecimals: 6,
+      value, fromCurrency: nativeCurrency, toCurrency: nativeCurrency, conversionRate, numberOfDecimals: 6,
     })
 
     dispatch(updateTransactionAmounts({
@@ -316,15 +316,15 @@ export function updateTxDataAndCalculate (txData) {
 
     const fiatTransactionFee = getTransactionFee({
       value: hexTransactionFee,
-      fromCurrency,
+      fromCurrency: nativeCurrency,
       toCurrency: currentCurrency,
       numberOfDecimals: 2,
       conversionRate,
     })
     const ethTransactionFee = getTransactionFee({
       value: hexTransactionFee,
-      fromCurrency,
-      toCurrency: fromCurrency,
+      fromCurrency: nativeCurrency,
+      toCurrency: nativeCurrency,
       numberOfDecimals: 6,
       conversionRate,
     })
diff --git a/ui/app/selectors.js b/ui/app/selectors.js
index 88a247fbc6b5..7209f19d1f7f 100644
--- a/ui/app/selectors.js
+++ b/ui/app/selectors.js
@@ -26,7 +26,7 @@ const selectors = {
   getAddressBook,
   getSendFrom,
   getCurrentCurrency,
-  getFromCurrency,
+  getNativeCurrency,
   getSendAmount,
   getSelectedTokenToFiatRate,
   getSelectedTokenContract,
@@ -144,8 +144,8 @@ function getCurrentCurrency (state) {
   return state.metamask.currentCurrency
 }
 
-function getFromCurrency (state) {
-  return state.metamask.fromCurrency
+function getNativeCurrency (state) {
+  return state.metamask.nativeCurrency
 }
 
 function getSelectedTokenToFiatRate (state) {
diff --git a/ui/app/selectors/confirm-transaction.js b/ui/app/selectors/confirm-transaction.js
index f7bd2c8f022d..90924c036dd0 100644
--- a/ui/app/selectors/confirm-transaction.js
+++ b/ui/app/selectors/confirm-transaction.js
@@ -93,7 +93,7 @@ export const unconfirmedTransactionsCountSelector = createSelector(
 
 export const currentCurrencySelector = state => state.metamask.currentCurrency
 export const conversionRateSelector = state => state.metamask.conversionRate
-export const getFromCurrency = state => state.metamask.fromCurrency
+export const getNativeCurrency = state => state.metamask.nativeCurrency
 
 const txDataSelector = state => state.confirmTransaction.txData
 const tokenDataSelector = state => state.confirmTransaction.tokenData

From 5abfd8db6e81d2d0cbfa3156b8e611694906b910 Mon Sep 17 00:00:00 2001
From: Whymarrh Whitby <whymarrh.whitby@gmail.com>
Date: Thu, 25 Oct 2018 13:47:31 +0200
Subject: [PATCH 15/19] Rename preference for switching primary currency

---
 app/_locales/en/messages.json                 |  2 +-
 app/scripts/controllers/preferences.js        |  2 +-
 development/states/add-token.json             |  2 +-
 development/states/confirm-sig-requests.json  |  2 +-
 development/states/currency-localization.json |  2 +-
 development/states/first-time.json            |  2 +-
 development/states/send-new-ui.json           |  2 +-
 development/states/tx-list-items.json         |  2 +-
 ui/app/actions.js                             |  6 ++---
 .../settings-tab/settings-tab.component.js    | 22 +++++++++----------
 .../settings-tab/settings-tab.container.js    | 10 ++++-----
 ...erenced-currency-display.container.test.js | 12 +++++-----
 ...-preferenced-currency-display.container.js | 14 ++++++------
 ...eferenced-currency-input.component.test.js |  6 ++---
 ...eferenced-currency-input.container.test.js |  4 ++--
 ...er-preferenced-currency-input.component.js |  6 ++---
 ...er-preferenced-currency-input.container.js |  4 ++--
 ...-preferenced-token-input.component.test.js |  6 ++---
 ...-preferenced-token-input.container.test.js |  4 ++--
 .../user-preferenced-token-input.component.js |  6 ++---
 .../user-preferenced-token-input.container.js |  4 ++--
 ui/app/reducers/metamask.js                   |  2 +-
 22 files changed, 61 insertions(+), 61 deletions(-)

diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index 6eb9f18e2a13..ad28aa86e8aa 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -821,7 +821,7 @@
     "message": "Primary Currency"
   },
   "primaryCurrencySettingDescription": {
-    "message": "Select ETH to prioritize displaying values in ETH. Select Fiat to prioritize displaying values in your selected currency."
+    "message": "Select native to prioritize displaying values in the native currency of the chain (e.g. ETH). Select Fiat to prioritize displaying values in your selected fiat currency."
   },
   "privacyMsg": {
     "message": "Privacy Policy"
diff --git a/app/scripts/controllers/preferences.js b/app/scripts/controllers/preferences.js
index b610bd171a53..120801f06bf3 100644
--- a/app/scripts/controllers/preferences.js
+++ b/app/scripts/controllers/preferences.js
@@ -39,7 +39,7 @@ class PreferencesController {
       seedWords: null,
       forgottenPassword: false,
       preferences: {
-        useETHAsPrimaryCurrency: true,
+        useNativeCurrencyAsPrimaryCurrency: true,
       },
     }, opts.initState)
 
diff --git a/development/states/add-token.json b/development/states/add-token.json
index 6a525f2b3560..b59e9b7572aa 100644
--- a/development/states/add-token.json
+++ b/development/states/add-token.json
@@ -109,7 +109,7 @@
     },
     "currentLocale": "en",
     "preferences": {
-      "useETHAsPrimaryCurrency": true
+      "useNativeCurrencyAsPrimaryCurrency": true
     }
   },
   "appState": {
diff --git a/development/states/confirm-sig-requests.json b/development/states/confirm-sig-requests.json
index c7103cd13265..1ffde3938d6e 100644
--- a/development/states/confirm-sig-requests.json
+++ b/development/states/confirm-sig-requests.json
@@ -152,7 +152,7 @@
     },
     "currentLocale": "en",
     "preferences": {
-      "useETHAsPrimaryCurrency": true
+      "useNativeCurrencyAsPrimaryCurrency": true
     }
   },
   "appState": {
diff --git a/development/states/currency-localization.json b/development/states/currency-localization.json
index 7dea42adef13..ef28891a390a 100644
--- a/development/states/currency-localization.json
+++ b/development/states/currency-localization.json
@@ -110,7 +110,7 @@
     },
     "currentLocale": "en",
     "preferences": {
-      "useETHAsPrimaryCurrency": true
+      "useNativeCurrencyAsPrimaryCurrency": true
     }
   },
   "appState": {
diff --git a/development/states/first-time.json b/development/states/first-time.json
index 3206b67a3495..ff70787200f1 100644
--- a/development/states/first-time.json
+++ b/development/states/first-time.json
@@ -39,7 +39,7 @@
     "tokens": [],
     "currentLocale": "en",
     "preferences": {
-      "useETHAsPrimaryCurrency": true
+      "useNativeCurrencyAsPrimaryCurrency": true
     }
   },
   "appState": {
diff --git a/development/states/send-new-ui.json b/development/states/send-new-ui.json
index d9924dd74371..0cd2f23f2edc 100644
--- a/development/states/send-new-ui.json
+++ b/development/states/send-new-ui.json
@@ -111,7 +111,7 @@
     },
     "currentLocale": "en",
     "preferences": {
-      "useETHAsPrimaryCurrency": true
+      "useNativeCurrencyAsPrimaryCurrency": true
     }
   },
   "appState": {
diff --git a/development/states/tx-list-items.json b/development/states/tx-list-items.json
index cbffa98e530e..e83179a17daa 100644
--- a/development/states/tx-list-items.json
+++ b/development/states/tx-list-items.json
@@ -104,7 +104,7 @@
     "send": {},
     "currentLocale": "en",
     "preferences": {
-      "useETHAsPrimaryCurrency": true
+      "useNativeCurrencyAsPrimaryCurrency": true
     }
   },
   "appState": {
diff --git a/ui/app/actions.js b/ui/app/actions.js
index d081a1a784c0..a8b9189e90fb 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -309,7 +309,7 @@ var actions = {
   setPreference,
   updatePreferences,
   UPDATE_PREFERENCES: 'UPDATE_PREFERENCES',
-  setUseETHAsPrimaryCurrencyPreference,
+  setUseNativeCurrencyAsPrimaryCurrencyPreference,
 
   setMouseUserState,
   SET_MOUSE_USER_STATE: 'SET_MOUSE_USER_STATE',
@@ -2330,8 +2330,8 @@ function updatePreferences (value) {
   }
 }
 
-function setUseETHAsPrimaryCurrencyPreference (value) {
-  return setPreference('useETHAsPrimaryCurrency', value)
+function setUseNativeCurrencyAsPrimaryCurrencyPreference (value) {
+  return setPreference('useNativeCurrencyAsPrimaryCurrency', value)
 }
 
 function setNetworkNonce (networkNonce) {
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
index 4639cf141f8f..4f180fd7cf5e 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
@@ -55,8 +55,8 @@ export default class SettingsTab extends PureComponent {
     sendHexData: PropTypes.bool,
     currentCurrency: PropTypes.string,
     conversionDate: PropTypes.number,
-    useETHAsPrimaryCurrency: PropTypes.bool,
-    setUseETHAsPrimaryCurrencyPreference: PropTypes.func,
+    useNativeCurrencyAsPrimaryCurrency: PropTypes.bool,
+    setUseNativeCurrencyAsPrimaryCurrencyPreference: PropTypes.func,
   }
 
   state = {
@@ -406,9 +406,9 @@ export default class SettingsTab extends PureComponent {
     )
   }
 
-  renderUseEthAsPrimaryCurrency () {
+  renderUsePrimaryCurrencyOptions () {
     const { t } = this.context
-    const { useETHAsPrimaryCurrency, setUseETHAsPrimaryCurrencyPreference } = this.props
+    const { useNativeCurrencyAsPrimaryCurrency, setUseNativeCurrencyAsPrimaryCurrencyPreference } = this.props
 
     return (
       <div className="settings-page__content-row">
@@ -424,12 +424,12 @@ export default class SettingsTab extends PureComponent {
               <div className="settings-tab__radio-button">
                 <input
                   type="radio"
-                  id="eth-primary-currency"
-                  onChange={() => setUseETHAsPrimaryCurrencyPreference(true)}
-                  checked={Boolean(useETHAsPrimaryCurrency)}
+                  id="native-primary-currency"
+                  onChange={() => setUseNativeCurrencyAsPrimaryCurrencyPreference(true)}
+                  checked={Boolean(useNativeCurrencyAsPrimaryCurrency)}
                 />
                 <label
-                  htmlFor="eth-primary-currency"
+                  htmlFor="native-primary-currency"
                   className="settings-tab__radio-label"
                 >
                   { t('eth') }
@@ -439,8 +439,8 @@ export default class SettingsTab extends PureComponent {
                 <input
                   type="radio"
                   id="fiat-primary-currency"
-                  onChange={() => setUseETHAsPrimaryCurrencyPreference(false)}
-                  checked={!useETHAsPrimaryCurrency}
+                  onChange={() => setUseNativeCurrencyAsPrimaryCurrencyPreference(false)}
+                  checked={!useNativeCurrencyAsPrimaryCurrency}
                 />
                 <label
                   htmlFor="fiat-primary-currency"
@@ -463,7 +463,7 @@ export default class SettingsTab extends PureComponent {
       <div className="settings-page__content">
         { warning && <div className="settings-tab__error">{ warning }</div> }
         { this.renderCurrentConversion() }
-        { this.renderUseEthAsPrimaryCurrency() }
+        { this.renderUsePrimaryCurrencyOptions() }
         { this.renderCurrentLocale() }
         { this.renderNewRpcUrl() }
         { this.renderStateLogs() }
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
index 77a65b160b52..f9733c0123b8 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
@@ -11,7 +11,7 @@ import {
   updateCurrentLocale,
   setFeatureFlag,
   showModal,
-  setUseETHAsPrimaryCurrencyPreference,
+  setUseNativeCurrencyAsPrimaryCurrencyPreference,
 } from '../../../../actions'
 import { preferencesSelector } from '../../../../selectors'
 
@@ -26,7 +26,7 @@ const mapStateToProps = state => {
     isMascara,
     currentLocale,
   } = metamask
-  const { useETHAsPrimaryCurrency } = preferencesSelector(state)
+  const { useNativeCurrencyAsPrimaryCurrency } = preferencesSelector(state)
 
   return {
     warning,
@@ -37,7 +37,7 @@ const mapStateToProps = state => {
     useBlockie,
     sendHexData,
     provider,
-    useETHAsPrimaryCurrency,
+    useNativeCurrencyAsPrimaryCurrency,
   }
 }
 
@@ -54,8 +54,8 @@ const mapDispatchToProps = dispatch => {
     },
     setHexDataFeatureFlag: shouldShow => dispatch(setFeatureFlag('sendHexData', shouldShow)),
     showResetAccountConfirmationModal: () => dispatch(showModal({ name: 'CONFIRM_RESET_ACCOUNT' })),
-    setUseETHAsPrimaryCurrencyPreference: value => {
-      return dispatch(setUseETHAsPrimaryCurrencyPreference(value))
+    setUseNativeCurrencyAsPrimaryCurrencyPreference: value => {
+      return dispatch(setUseNativeCurrencyAsPrimaryCurrencyPreference(value))
     },
   }
 }
diff --git a/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js b/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
index cf06a3613d92..ba1c23d8359d 100644
--- a/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
+++ b/ui/app/components/user-preferenced-currency-display/tests/user-preferenced-currency-display.container.test.js
@@ -20,14 +20,14 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         metamask: {
           nativeCurrency: 'ETH',
           preferences: {
-            useETHAsPrimaryCurrency: true,
+            useNativeCurrencyAsPrimaryCurrency: true,
           },
         },
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
         nativeCurrency: 'ETH',
-        useETHAsPrimaryCurrency: true,
+        useNativeCurrencyAsPrimaryCurrency: true,
       })
     })
   })
@@ -39,7 +39,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
       const tests = [
         {
           stateProps: {
-            useETHAsPrimaryCurrency: true,
+            useNativeCurrencyAsPrimaryCurrency: true,
             nativeCurrency: 'ETH',
           },
           ownProps: {
@@ -54,7 +54,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         },
         {
           stateProps: {
-            useETHAsPrimaryCurrency: false,
+            useNativeCurrencyAsPrimaryCurrency: false,
             nativeCurrency: 'ETH',
           },
           ownProps: {
@@ -69,7 +69,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         },
         {
           stateProps: {
-            useETHAsPrimaryCurrency: true,
+            useNativeCurrencyAsPrimaryCurrency: true,
             nativeCurrency: 'ETH',
           },
           ownProps: {
@@ -86,7 +86,7 @@ describe('UserPreferencedCurrencyDisplay container', () => {
         },
         {
           stateProps: {
-            useETHAsPrimaryCurrency: false,
+            useNativeCurrencyAsPrimaryCurrency: false,
             nativeCurrency: 'ETH',
           },
           ownProps: {
diff --git a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
index 28329b3dfd76..7999301ad2e5 100644
--- a/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
+++ b/ui/app/components/user-preferenced-currency-display/user-preferenced-currency-display.container.js
@@ -4,16 +4,16 @@ import { preferencesSelector } from '../../selectors'
 import { ETH, PRIMARY, SECONDARY } from '../../constants/common'
 
 const mapStateToProps = (state, ownProps) => {
-  const { useETHAsPrimaryCurrency } = preferencesSelector(state)
+  const { useNativeCurrencyAsPrimaryCurrency } = preferencesSelector(state)
 
   return {
-    useETHAsPrimaryCurrency,
+    useNativeCurrencyAsPrimaryCurrency,
     nativeCurrency: state.metamask.nativeCurrency,
   }
 }
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const { useETHAsPrimaryCurrency, nativeCurrency, ...restStateProps } = stateProps
+  const { useNativeCurrencyAsPrimaryCurrency, nativeCurrency, ...restStateProps } = stateProps
   const {
     type,
     numberOfDecimals: propsNumberOfDecimals,
@@ -27,14 +27,14 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
 
   let currency, numberOfDecimals, prefix
 
-  if (type === PRIMARY && useETHAsPrimaryCurrency ||
-    type === SECONDARY && !useETHAsPrimaryCurrency) {
+  if (type === PRIMARY && useNativeCurrencyAsPrimaryCurrency ||
+    type === SECONDARY && !useNativeCurrencyAsPrimaryCurrency) {
     // Display ETH
     currency = nativeCurrency || ETH
     numberOfDecimals = propsNumberOfDecimals || ethNumberOfDecimals || 6
     prefix = propsPrefix || ethPrefix
-  } else if (type === SECONDARY && useETHAsPrimaryCurrency ||
-    type === PRIMARY && !useETHAsPrimaryCurrency) {
+  } else if (type === SECONDARY && useNativeCurrencyAsPrimaryCurrency ||
+    type === PRIMARY && !useNativeCurrencyAsPrimaryCurrency) {
     // Display Fiat
     numberOfDecimals = propsNumberOfDecimals || fiatNumberOfDecimals || 2
     prefix = propsPrefix || fiatPrefix
diff --git a/ui/app/components/user-preferenced-currency-input/tests/user-preferenced-currency-input.component.test.js b/ui/app/components/user-preferenced-currency-input/tests/user-preferenced-currency-input.component.test.js
index 0af80a03d379..710b5d5196c4 100644
--- a/ui/app/components/user-preferenced-currency-input/tests/user-preferenced-currency-input.component.test.js
+++ b/ui/app/components/user-preferenced-currency-input/tests/user-preferenced-currency-input.component.test.js
@@ -15,17 +15,17 @@ describe('UserPreferencedCurrencyInput Component', () => {
       assert.equal(wrapper.find(CurrencyInput).length, 1)
     })
 
-    it('should render useFiat for CurrencyInput based on preferences.useETHAsPrimaryCurrency', () => {
+    it('should render useFiat for CurrencyInput based on preferences.useNativeCurrencyAsPrimaryCurrency', () => {
       const wrapper = shallow(
         <UserPreferencedCurrencyInput
-          useETHAsPrimaryCurrency
+          useNativeCurrencyAsPrimaryCurrency
         />
       )
 
       assert.ok(wrapper)
       assert.equal(wrapper.find(CurrencyInput).length, 1)
       assert.equal(wrapper.find(CurrencyInput).props().useFiat, false)
-      wrapper.setProps({ useETHAsPrimaryCurrency: false })
+      wrapper.setProps({ useNativeCurrencyAsPrimaryCurrency: false })
       assert.equal(wrapper.find(CurrencyInput).props().useFiat, true)
     })
   })
diff --git a/ui/app/components/user-preferenced-currency-input/tests/user-preferenced-currency-input.container.test.js b/ui/app/components/user-preferenced-currency-input/tests/user-preferenced-currency-input.container.test.js
index d860c38da7d5..95972644391f 100644
--- a/ui/app/components/user-preferenced-currency-input/tests/user-preferenced-currency-input.container.test.js
+++ b/ui/app/components/user-preferenced-currency-input/tests/user-preferenced-currency-input.container.test.js
@@ -18,13 +18,13 @@ describe('UserPreferencedCurrencyInput container', () => {
       const mockState = {
         metamask: {
           preferences: {
-            useETHAsPrimaryCurrency: true,
+            useNativeCurrencyAsPrimaryCurrency: true,
           },
         },
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
-        useETHAsPrimaryCurrency: true,
+        useNativeCurrencyAsPrimaryCurrency: true,
       })
     })
   })
diff --git a/ui/app/components/user-preferenced-currency-input/user-preferenced-currency-input.component.js b/ui/app/components/user-preferenced-currency-input/user-preferenced-currency-input.component.js
index 6e0e00a1d300..463e66b80753 100644
--- a/ui/app/components/user-preferenced-currency-input/user-preferenced-currency-input.component.js
+++ b/ui/app/components/user-preferenced-currency-input/user-preferenced-currency-input.component.js
@@ -4,16 +4,16 @@ import CurrencyInput from '../currency-input'
 
 export default class UserPreferencedCurrencyInput extends PureComponent {
   static propTypes = {
-    useETHAsPrimaryCurrency: PropTypes.bool,
+    useNativeCurrencyAsPrimaryCurrency: PropTypes.bool,
   }
 
   render () {
-    const { useETHAsPrimaryCurrency, ...restProps } = this.props
+    const { useNativeCurrencyAsPrimaryCurrency, ...restProps } = this.props
 
     return (
       <CurrencyInput
         {...restProps}
-        useFiat={!useETHAsPrimaryCurrency}
+        useFiat={!useNativeCurrencyAsPrimaryCurrency}
       />
     )
   }
diff --git a/ui/app/components/user-preferenced-currency-input/user-preferenced-currency-input.container.js b/ui/app/components/user-preferenced-currency-input/user-preferenced-currency-input.container.js
index 397cdc7cc349..0b88eb5a7523 100644
--- a/ui/app/components/user-preferenced-currency-input/user-preferenced-currency-input.container.js
+++ b/ui/app/components/user-preferenced-currency-input/user-preferenced-currency-input.container.js
@@ -3,10 +3,10 @@ import UserPreferencedCurrencyInput from './user-preferenced-currency-input.comp
 import { preferencesSelector } from '../../selectors'
 
 const mapStateToProps = state => {
-  const { useETHAsPrimaryCurrency } = preferencesSelector(state)
+  const { useNativeCurrencyAsPrimaryCurrency } = preferencesSelector(state)
 
   return {
-    useETHAsPrimaryCurrency,
+    useNativeCurrencyAsPrimaryCurrency,
   }
 }
 
diff --git a/ui/app/components/user-preferenced-token-input/tests/user-preferenced-token-input.component.test.js b/ui/app/components/user-preferenced-token-input/tests/user-preferenced-token-input.component.test.js
index 910c7089f2a7..d85bddeebbc4 100644
--- a/ui/app/components/user-preferenced-token-input/tests/user-preferenced-token-input.component.test.js
+++ b/ui/app/components/user-preferenced-token-input/tests/user-preferenced-token-input.component.test.js
@@ -15,17 +15,17 @@ describe('UserPreferencedCurrencyInput Component', () => {
       assert.equal(wrapper.find(TokenInput).length, 1)
     })
 
-    it('should render showFiat for TokenInput based on preferences.useETHAsPrimaryCurrency', () => {
+    it('should render showFiat for TokenInput based on preferences.useNativeCurrencyAsPrimaryCurrency', () => {
       const wrapper = shallow(
         <UserPreferencedTokenInput
-          useETHAsPrimaryCurrency
+          useNativeCurrencyAsPrimaryCurrency
         />
       )
 
       assert.ok(wrapper)
       assert.equal(wrapper.find(TokenInput).length, 1)
       assert.equal(wrapper.find(TokenInput).props().showFiat, false)
-      wrapper.setProps({ useETHAsPrimaryCurrency: false })
+      wrapper.setProps({ useNativeCurrencyAsPrimaryCurrency: false })
       assert.equal(wrapper.find(TokenInput).props().showFiat, true)
     })
   })
diff --git a/ui/app/components/user-preferenced-token-input/tests/user-preferenced-token-input.container.test.js b/ui/app/components/user-preferenced-token-input/tests/user-preferenced-token-input.container.test.js
index e3509149ae5e..2f89fba9050c 100644
--- a/ui/app/components/user-preferenced-token-input/tests/user-preferenced-token-input.container.test.js
+++ b/ui/app/components/user-preferenced-token-input/tests/user-preferenced-token-input.container.test.js
@@ -18,13 +18,13 @@ describe('UserPreferencedTokenInput container', () => {
       const mockState = {
         metamask: {
           preferences: {
-            useETHAsPrimaryCurrency: true,
+            useNativeCurrencyAsPrimaryCurrency: true,
           },
         },
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
-        useETHAsPrimaryCurrency: true,
+        useNativeCurrencyAsPrimaryCurrency: true,
       })
     })
   })
diff --git a/ui/app/components/user-preferenced-token-input/user-preferenced-token-input.component.js b/ui/app/components/user-preferenced-token-input/user-preferenced-token-input.component.js
index f2b537f11804..8f14231ac8cc 100644
--- a/ui/app/components/user-preferenced-token-input/user-preferenced-token-input.component.js
+++ b/ui/app/components/user-preferenced-token-input/user-preferenced-token-input.component.js
@@ -4,16 +4,16 @@ import TokenInput from '../token-input'
 
 export default class UserPreferencedTokenInput extends PureComponent {
   static propTypes = {
-    useETHAsPrimaryCurrency: PropTypes.bool,
+    useNativeCurrencyAsPrimaryCurrency: PropTypes.bool,
   }
 
   render () {
-    const { useETHAsPrimaryCurrency, ...restProps } = this.props
+    const { useNativeCurrencyAsPrimaryCurrency, ...restProps } = this.props
 
     return (
       <TokenInput
         {...restProps}
-        showFiat={!useETHAsPrimaryCurrency}
+        showFiat={!useNativeCurrencyAsPrimaryCurrency}
       />
     )
   }
diff --git a/ui/app/components/user-preferenced-token-input/user-preferenced-token-input.container.js b/ui/app/components/user-preferenced-token-input/user-preferenced-token-input.container.js
index 416d069dd704..3305d4e29579 100644
--- a/ui/app/components/user-preferenced-token-input/user-preferenced-token-input.container.js
+++ b/ui/app/components/user-preferenced-token-input/user-preferenced-token-input.container.js
@@ -3,10 +3,10 @@ import UserPreferencedTokenInput from './user-preferenced-token-input.component'
 import { preferencesSelector } from '../../selectors'
 
 const mapStateToProps = state => {
-  const { useETHAsPrimaryCurrency } = preferencesSelector(state)
+  const { useNativeCurrencyAsPrimaryCurrency } = preferencesSelector(state)
 
   return {
-    useETHAsPrimaryCurrency,
+    useNativeCurrencyAsPrimaryCurrency,
   }
 }
 
diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js
index 37d8a9187399..22fa5309845d 100644
--- a/ui/app/reducers/metamask.js
+++ b/ui/app/reducers/metamask.js
@@ -52,7 +52,7 @@ function reduceMetamask (state, action) {
     welcomeScreenSeen: false,
     currentLocale: '',
     preferences: {
-      useETHAsPrimaryCurrency: true,
+      useNativeCurrencyAsPrimaryCurrency: true,
     },
   }, state.metamask)
 

From b55182206335da1cb03661aa7e50df8a283b1530 Mon Sep 17 00:00:00 2001
From: Whymarrh Whitby <whymarrh.whitby@gmail.com>
Date: Thu, 25 Oct 2018 13:58:30 +0200
Subject: [PATCH 16/19] Show native currency symbol for custom chains

---
 .../settings/settings-tab/settings-tab.component.js      | 9 +++++++--
 .../settings/settings-tab/settings-tab.container.js      | 2 ++
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
index 4f180fd7cf5e..cd81491a8538 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
@@ -55,6 +55,7 @@ export default class SettingsTab extends PureComponent {
     sendHexData: PropTypes.bool,
     currentCurrency: PropTypes.string,
     conversionDate: PropTypes.number,
+    nativeCurrency: PropTypes.string,
     useNativeCurrencyAsPrimaryCurrency: PropTypes.bool,
     setUseNativeCurrencyAsPrimaryCurrencyPreference: PropTypes.func,
   }
@@ -408,7 +409,11 @@ export default class SettingsTab extends PureComponent {
 
   renderUsePrimaryCurrencyOptions () {
     const { t } = this.context
-    const { useNativeCurrencyAsPrimaryCurrency, setUseNativeCurrencyAsPrimaryCurrencyPreference } = this.props
+    const {
+      nativeCurrency,
+      setUseNativeCurrencyAsPrimaryCurrencyPreference,
+      useNativeCurrencyAsPrimaryCurrency,
+    } = this.props
 
     return (
       <div className="settings-page__content-row">
@@ -432,7 +437,7 @@ export default class SettingsTab extends PureComponent {
                   htmlFor="native-primary-currency"
                   className="settings-tab__radio-label"
                 >
-                  { t('eth') }
+                  { nativeCurrency }
                 </label>
               </div>
               <div className="settings-tab__radio-button">
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
index f9733c0123b8..f4110207ec12 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
@@ -20,6 +20,7 @@ const mapStateToProps = state => {
   const {
     currentCurrency,
     conversionDate,
+    nativeCurrency,
     useBlockie,
     featureFlags: { sendHexData } = {},
     provider = {},
@@ -34,6 +35,7 @@ const mapStateToProps = state => {
     currentLocale,
     currentCurrency,
     conversionDate,
+    nativeCurrency,
     useBlockie,
     sendHexData,
     provider,

From 99acde4fb83bd9df5fe28825006558b1c0c4acbc Mon Sep 17 00:00:00 2001
From: Whymarrh Whitby <whymarrh.whitby@gmail.com>
Date: Thu, 25 Oct 2018 14:57:35 +0200
Subject: [PATCH 17/19] Remove changes from CurrencyDisplay component

---
 .../currency-display.container.js               |  9 ++++-----
 .../tests/currency-display.component.test.js    |  2 --
 .../tests/currency-display.container.test.js    | 17 -----------------
 .../components/transaction-breakdown/index.js   |  2 +-
 .../transaction-breakdown.component.js          |  7 ++++---
 .../transaction-breakdown.container.js          | 11 +++++++++++
 6 files changed, 20 insertions(+), 28 deletions(-)
 create mode 100644 ui/app/components/transaction-breakdown/transaction-breakdown.container.js

diff --git a/ui/app/components/currency-display/currency-display.container.js b/ui/app/components/currency-display/currency-display.container.js
index 60e1487cc49f..1b3fe74dabdd 100644
--- a/ui/app/components/currency-display/currency-display.container.js
+++ b/ui/app/components/currency-display/currency-display.container.js
@@ -3,17 +3,16 @@ import CurrencyDisplay from './currency-display.component'
 import { getValueFromWeiHex, formatCurrency } from '../../helpers/confirm-transaction/util'
 
 const mapStateToProps = state => {
-  const { metamask: { nativeCurrency, currentCurrency, conversionRate } } = state
+  const { metamask: { currentCurrency, conversionRate } } = state
 
   return {
     currentCurrency,
     conversionRate,
-    nativeCurrency,
   }
 }
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const { nativeCurrency, currentCurrency, conversionRate, ...restStateProps } = stateProps
+  const { currentCurrency, conversionRate, ...restStateProps } = stateProps
   const {
     value,
     numberOfDecimals = 2,
@@ -23,9 +22,9 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
     ...restOwnProps
   } = ownProps
 
-  const toCurrency = currency === 'ETH' ? nativeCurrency || currency : currency || currentCurrency
+  const toCurrency = currency || currentCurrency
   const convertedValue = getValueFromWeiHex({
-    value, nativeCurrency, toCurrency, conversionRate, numberOfDecimals, toDenomination: denomination,
+    value, toCurrency, conversionRate, numberOfDecimals, toDenomination: denomination,
   })
   const displayValue = formatCurrency(convertedValue, toCurrency)
   const suffix = hideLabel ? undefined : toCurrency.toUpperCase()
diff --git a/ui/app/components/currency-display/tests/currency-display.component.test.js b/ui/app/components/currency-display/tests/currency-display.component.test.js
index 56825829c7f1..d9ef052f1bf2 100644
--- a/ui/app/components/currency-display/tests/currency-display.component.test.js
+++ b/ui/app/components/currency-display/tests/currency-display.component.test.js
@@ -6,7 +6,6 @@ import CurrencyDisplay from '../currency-display.component'
 describe('CurrencyDisplay Component', () => {
   it('should render text with a className', () => {
     const wrapper = shallow(<CurrencyDisplay
-      nativeCurrency={'ETH'}
       displayValue="$123.45"
       className="currency-display"
     />)
@@ -17,7 +16,6 @@ describe('CurrencyDisplay Component', () => {
 
   it('should render text with a prefix', () => {
     const wrapper = shallow(<CurrencyDisplay
-      nativeCurrency={'ETH'}
       displayValue="$123.45"
       className="currency-display"
       prefix="-"
diff --git a/ui/app/components/currency-display/tests/currency-display.container.test.js b/ui/app/components/currency-display/tests/currency-display.container.test.js
index af07e081141b..fb6678776115 100644
--- a/ui/app/components/currency-display/tests/currency-display.container.test.js
+++ b/ui/app/components/currency-display/tests/currency-display.container.test.js
@@ -20,14 +20,12 @@ describe('CurrencyDisplay container', () => {
         metamask: {
           conversionRate: 280.45,
           currentCurrency: 'usd',
-          nativeCurrency: 'ETH',
         },
       }
 
       assert.deepEqual(mapStateToProps(mockState), {
         conversionRate: 280.45,
         currentCurrency: 'usd',
-        nativeCurrency: 'ETH',
       })
     })
   })
@@ -37,7 +35,6 @@ describe('CurrencyDisplay container', () => {
       const mockStateProps = {
         conversionRate: 280.45,
         currentCurrency: 'usd',
-        nativeCurrency: 'ETH',
       }
 
       const tests = [
@@ -46,48 +43,40 @@ describe('CurrencyDisplay container', () => {
             value: '0x2386f26fc10000',
             numberOfDecimals: 2,
             currency: 'usd',
-            nativeCurrency: 'ETH',
           },
           result: {
             displayValue: '$2.80',
             suffix: 'USD',
-            nativeCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x2386f26fc10000',
-            nativeCurrency: 'ETH',
           },
           result: {
             displayValue: '$2.80',
             suffix: 'USD',
-            nativeCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x1193461d01595930',
             currency: 'ETH',
-            nativeCurrency: 'ETH',
             numberOfDecimals: 3,
           },
           result: {
             displayValue: '1.266',
             suffix: 'ETH',
-            nativeCurrency: 'ETH',
           },
         },
         {
           props: {
             value: '0x1193461d01595930',
             currency: 'ETH',
-            nativeCurrency: 'ETH',
             numberOfDecimals: 3,
             hideLabel: true,
           },
           result: {
-            nativeCurrency: 'ETH',
             displayValue: '1.266',
             suffix: undefined,
           },
@@ -96,12 +85,10 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
-            nativeCurrency: 'ETH',
             denomination: 'GWEI',
             hideLabel: true,
           },
           result: {
-            nativeCurrency: 'ETH',
             displayValue: '1',
             suffix: undefined,
           },
@@ -110,12 +97,10 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
-            nativeCurrency: 'ETH',
             denomination: 'WEI',
             hideLabel: true,
           },
           result: {
-            nativeCurrency: 'ETH',
             displayValue: '1000000000',
             suffix: undefined,
           },
@@ -124,12 +109,10 @@ describe('CurrencyDisplay container', () => {
           props: {
             value: '0x3b9aca00',
             currency: 'ETH',
-            nativeCurrency: 'ETH',
             numberOfDecimals: 100,
             hideLabel: true,
           },
           result: {
-            nativeCurrency: 'ETH',
             displayValue: '1e-9',
             suffix: undefined,
           },
diff --git a/ui/app/components/transaction-breakdown/index.js b/ui/app/components/transaction-breakdown/index.js
index c887f504f192..4a5b526639c6 100644
--- a/ui/app/components/transaction-breakdown/index.js
+++ b/ui/app/components/transaction-breakdown/index.js
@@ -1 +1 @@
-export { default } from './transaction-breakdown.component'
+export { default } from './transaction-breakdown.container'
diff --git a/ui/app/components/transaction-breakdown/transaction-breakdown.component.js b/ui/app/components/transaction-breakdown/transaction-breakdown.component.js
index 77bedcad734f..3a76478737d3 100644
--- a/ui/app/components/transaction-breakdown/transaction-breakdown.component.js
+++ b/ui/app/components/transaction-breakdown/transaction-breakdown.component.js
@@ -6,7 +6,7 @@ import Card from '../card'
 import CurrencyDisplay from '../currency-display'
 import UserPreferencedCurrencyDisplay from '../user-preferenced-currency-display'
 import HexToDecimal from '../hex-to-decimal'
-import { ETH, GWEI, PRIMARY, SECONDARY } from '../../constants/common'
+import { GWEI, PRIMARY, SECONDARY } from '../../constants/common'
 import { getHexGasTotal } from '../../helpers/confirm-transaction/util'
 import { sumHexes } from '../../helpers/transactions.util'
 
@@ -18,6 +18,7 @@ export default class TransactionBreakdown extends PureComponent {
   static propTypes = {
     transaction: PropTypes.object,
     className: PropTypes.string,
+    nativeCurrency: PropTypes.string.isRequired,
   }
 
   static defaultProps = {
@@ -26,7 +27,7 @@ export default class TransactionBreakdown extends PureComponent {
 
   render () {
     const { t } = this.context
-    const { transaction, className } = this.props
+    const { transaction, className, nativeCurrency } = this.props
     const { txParams: { gas, gasPrice, value } = {}, txReceipt: { gasUsed } = {} } = transaction
 
     const gasLimit = typeof gasUsed === 'string' ? gasUsed : gas
@@ -72,7 +73,7 @@ export default class TransactionBreakdown extends PureComponent {
           <TransactionBreakdownRow title={t('gasPrice')}>
             <CurrencyDisplay
               className="transaction-breakdown__value"
-              currency={ETH}
+              currency={nativeCurrency}
               denomination={GWEI}
               value={gasPrice}
               hideLabel
diff --git a/ui/app/components/transaction-breakdown/transaction-breakdown.container.js b/ui/app/components/transaction-breakdown/transaction-breakdown.container.js
new file mode 100644
index 000000000000..ed2708e037b6
--- /dev/null
+++ b/ui/app/components/transaction-breakdown/transaction-breakdown.container.js
@@ -0,0 +1,11 @@
+import { connect } from 'react-redux'
+import TransactionBreakdown from './transaction-breakdown.component'
+import { getNativeCurrency } from '../../selectors'
+
+const mapStateToProps = (state) => {
+  return {
+    nativeCurrency: getNativeCurrency(state),
+  }
+}
+
+export default connect(mapStateToProps)(TransactionBreakdown)

From 4aae804bf01ecb29513e7d5a18eea1923ee8acfa Mon Sep 17 00:00:00 2001
From: Whymarrh Whitby <whymarrh.whitby@gmail.com>
Date: Fri, 26 Oct 2018 09:09:36 +0200
Subject: [PATCH 18/19] Fix parameter names for conversion utils

---
 .../transaction-activity-log.component.js                     | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ui/app/components/transaction-activity-log/transaction-activity-log.component.js b/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
index 357ef626c767..a2b69daf6f62 100644
--- a/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
+++ b/ui/app/components/transaction-activity-log/transaction-activity-log.component.js
@@ -46,12 +46,12 @@ export default class TransactionActivityLog extends PureComponent {
     const ethValue = index === 0
       ? `${getValueFromWeiHex({
         value,
-        nativeCurrency,
+        fromCurrency: nativeCurrency,
         toCurrency: nativeCurrency,
         conversionRate,
         numberOfDecimals: 6,
       })} ${nativeCurrency}`
-      : getEthConversionFromWeiHex({ value, nativeCurrency, toCurrency: nativeCurrency, conversionRate })
+      : getEthConversionFromWeiHex({ value, fromCurrency: nativeCurrency, conversionRate })
     const formattedTimestamp = formatDate(timestamp)
     const activityText = this.context.t(eventKey, [ethValue, formattedTimestamp])
 

From 2b7d4abac55d0519805308f60acb6d5eed9eb9fa Mon Sep 17 00:00:00 2001
From: Whymarrh Whitby <whymarrh.whitby@gmail.com>
Date: Fri, 26 Oct 2018 09:43:52 +0200
Subject: [PATCH 19/19] Fix fromCurrency prop passed to CurrencyInput

---
 .../components/currency-input/currency-input.component.js   | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/ui/app/components/currency-input/currency-input.component.js b/ui/app/components/currency-input/currency-input.component.js
index ceac4e9141cb..0761a75c5efe 100644
--- a/ui/app/components/currency-input/currency-input.component.js
+++ b/ui/app/components/currency-input/currency-input.component.js
@@ -14,7 +14,7 @@ export default class CurrencyInput extends PureComponent {
   static propTypes = {
     conversionRate: PropTypes.number,
     currentCurrency: PropTypes.string,
-    fromCurrency: PropTypes.string,
+    nativeCurrency: PropTypes.string,
     onChange: PropTypes.func,
     onBlur: PropTypes.func,
     suffix: PropTypes.string,
@@ -78,13 +78,13 @@ export default class CurrencyInput extends PureComponent {
   }
 
   renderConversionComponent () {
-    const { useFiat, currentCurrency, fromCurrency } = this.props
+    const { useFiat, currentCurrency, nativeCurrency } = this.props
     const { hexValue } = this.state
     let currency, numberOfDecimals
 
     if (useFiat) {
       // Display ETH
-      currency = fromCurrency || ETH
+      currency = nativeCurrency || ETH
       numberOfDecimals = 6
     } else {
       // Display Fiat