Merge pull request #2399 from danjm/MM-128-get-currentCurrency-from-state

[NewUI] Get currentCurrency from state, allows other fiats

ui/app/app.js

@@ -76,6 +76,7 @@ function mapStateToProps (state) {
     lastUnreadNotice: state.metamask.lastUnreadNotice,
     lostAccounts: state.metamask.lostAccounts,
     frequentRpcList: state.metamask.frequentRpcList || [],
+    currentCurrency: state.metamask.currentCurrency,
 
     // state needed to get account dropdown temporarily rendering from app bar
     identities,
@@ -96,7 +97,9 @@ function mapDispatchToProps (dispatch, ownProps) {
 }
 
 App.prototype.componentWillMount = function () {
+  if (!this.props.currentCurrency) {
     this.props.setCurrentCurrencyToUSD()
+  }
 }
 
 App.prototype.render = function () {

ui/app/components/pending-tx/confirm-deploy-contract.js

@@ -21,10 +21,12 @@ function mapStateToProps (state) {
   const {
     conversionRate,
     identities,
+    currentCurrency,
   } = state.metamask
   const accounts = state.metamask.accounts
   const selectedAddress = state.metamask.selectedAddress || Object.keys(accounts)[0]
   return {
+    currentCurrency,
     conversionRate,
     identities,
     selectedAddress,
@@ -124,15 +126,15 @@ ConfirmDeployContract.prototype.getData = function () {
 }
 
 ConfirmDeployContract.prototype.getAmount = function () {
-  const { conversionRate } = this.props
+  const { conversionRate, currentCurrency } = this.props
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
 
-  const USD = conversionUtil(txParams.value, {
+  const FIAT = conversionUtil(txParams.value, {
     fromNumericBase: 'hex',
     toNumericBase: 'dec',
     fromCurrency: 'ETH',
-    toCurrency: 'USD',
+    toCurrency: currentCurrency,
     numberOfDecimals: 2,
     fromDenomination: 'WEI',
     conversionRate,
@@ -148,14 +150,14 @@ ConfirmDeployContract.prototype.getAmount = function () {
   })
 
   return {
-    fiat: Number(USD),
+    fiat: Number(FIAT),
     token: Number(ETH),
   }
 
 }
 
 ConfirmDeployContract.prototype.getGasFee = function () {
-  const { conversionRate } = this.props
+  const { conversionRate, currentCurrency } = this.props
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
 
@@ -169,12 +171,12 @@ ConfirmDeployContract.prototype.getGasFee = function () {
 
   const txFeeBn = gasBn.mul(gasPriceBn)
 
-  const USD = conversionUtil(txFeeBn, {
+  const FIAT = conversionUtil(txFeeBn, {
     fromNumericBase: 'BN',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
     fromCurrency: 'ETH',
-    toCurrency: 'USD',
+    toCurrency: currentCurrency,
     numberOfDecimals: 2,
     conversionRate,
   })
@@ -189,7 +191,7 @@ ConfirmDeployContract.prototype.getGasFee = function () {
   })
 
   return {
-    fiat: Number(USD),
+    fiat: Number(FIAT),
     eth: Number(ETH),
   }
 }
@@ -200,7 +202,7 @@ ConfirmDeployContract.prototype.renderGasFee = function () {
     h('section.flex-row.flex-center.confirm-screen-row', [
       h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]),
       h('div.confirm-screen-section-column', [
-        h('div.confirm-screen-row-info', `$${fiatGas} USD`),
+        h('div.confirm-screen-row-info', `${fiatGas} FIAT`),
 
         h(
           'div.confirm-screen-row-detail',
@@ -212,6 +214,7 @@ ConfirmDeployContract.prototype.renderGasFee = function () {
 }
 
 ConfirmDeployContract.prototype.renderHeroAmount = function () {
+  const { currentCurrency } = this.props
   const { fiat: fiatAmount } = this.getAmount()
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
@@ -219,8 +222,8 @@ ConfirmDeployContract.prototype.renderHeroAmount = function () {
 
   return (
     h('div.confirm-send-token__hero-amount-wrapper', [
-      h('h3.flex-center.confirm-screen-send-amount', `$${fiatAmount}`),
+      h('h3.flex-center.confirm-screen-send-amount', `${fiatAmount}`),
-      h('h3.flex-center.confirm-screen-send-amount-currency', 'USD'),
+      h('h3.flex-center.confirm-screen-send-amount-currency', currentCurrency.toUpperCase()),
       h('div.flex-center.confirm-memo-wrapper', [
         h('h3.confirm-screen-send-memo', memo),
       ]),
@@ -229,6 +232,7 @@ ConfirmDeployContract.prototype.renderHeroAmount = function () {
 }
 
 ConfirmDeployContract.prototype.renderTotalPlusGas = function () {
+  const { currentCurrency } = this.props
   const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
   const { fiat: fiatGas, eth: ethGas } = this.getGasFee()
 
@@ -240,7 +244,7 @@ ConfirmDeployContract.prototype.renderTotalPlusGas = function () {
       ]),
 
       h('div.confirm-screen-section-column', [
-        h('div.confirm-screen-row-info', `$${fiatAmount + fiatGas} USD`),
+        h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency.toUpperCase()}`),
         h('div.confirm-screen-row-detail', `${tokenAmount + ethGas} ETH`),
       ]),
     ])

ui/app/components/pending-tx/confirm-send-ether.js

@@ -20,6 +20,7 @@ function mapStateToProps (state) {
   const {
     conversionRate,
     identities,
+    currentCurrency,
   } = state.metamask
   const accounts = state.metamask.accounts
   const selectedAddress = state.metamask.selectedAddress || Object.keys(accounts)[0]
@@ -27,6 +28,7 @@ function mapStateToProps (state) {
     conversionRate,
     identities,
     selectedAddress,
+    currentCurrency,
   }
 }
 
@@ -45,15 +47,15 @@ function ConfirmSendEther () {
 }
 
 ConfirmSendEther.prototype.getAmount = function () {
-  const { conversionRate } = this.props
+  const { conversionRate, currentCurrency } = this.props
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
-  console.log(txParams)
+  console.log(`conversionRate, currentCurrency`, conversionRate, currentCurrency);
-  const USD = conversionUtil(txParams.value, {
+  const FIAT = conversionUtil(txParams.value, {
     fromNumericBase: 'hex',
     toNumericBase: 'dec',
     fromCurrency: 'ETH',
-    toCurrency: 'USD',
+    toCurrency: currentCurrency,
     numberOfDecimals: 2,
     fromDenomination: 'WEI',
     conversionRate,
@@ -69,14 +71,14 @@ ConfirmSendEther.prototype.getAmount = function () {
   })
 
   return {
-    USD,
+    FIAT,
     ETH,
   }
 
 }
 
 ConfirmSendEther.prototype.getGasFee = function () {
-  const { conversionRate } = this.props
+  const { conversionRate, currentCurrency } = this.props
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
 
@@ -96,12 +98,12 @@ ConfirmSendEther.prototype.getGasFee = function () {
 
   const txFeeBn = gasBn.mul(gasPriceBn)
 
-  const USD = conversionUtil(txFeeBn, {
+  const FIAT = conversionUtil(txFeeBn, {
     fromNumericBase: 'BN',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
     fromCurrency: 'ETH',
-    toCurrency: 'USD',
+    toCurrency: currentCurrency,
     numberOfDecimals: 2,
     conversionRate,
   })
@@ -116,7 +118,7 @@ ConfirmSendEther.prototype.getGasFee = function () {
   })
 
   return {
-    USD,
+    FIAT,
     ETH,
   }
 }
@@ -125,10 +127,10 @@ ConfirmSendEther.prototype.getData = function () {
   const { identities } = this.props
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
-  const { USD: gasFeeInUSD, ETH: gasFeeInETH } = this.getGasFee()
+  const { FIAT: gasFeeInFIAT, ETH: gasFeeInETH } = this.getGasFee()
-  const { USD: amountInUSD, ETH: amountInETH } = this.getAmount()
+  const { FIAT: amountInFIAT, ETH: amountInETH } = this.getAmount()
 
-  const totalInUSD = addCurrencies(gasFeeInUSD, amountInUSD, {
+  const totalInFIAT = addCurrencies(gasFeeInFIAT, amountInFIAT, {
     toNumericBase: 'dec',
     numberOfDecimals: 2,
   })
@@ -147,17 +149,17 @@ ConfirmSendEther.prototype.getData = function () {
       name: identities[txParams.to] ? identities[txParams.to].name : 'New Recipient',
     },
     memo: txParams.memo || '',
-    gasFeeInUSD,
+    gasFeeInFIAT,
     gasFeeInETH,
-    amountInUSD,
+    amountInFIAT,
     amountInETH,
-    totalInUSD,
+    totalInFIAT,
     totalInETH,
   }
 }
 
 ConfirmSendEther.prototype.render = function () {
-  const { backToAccountDetail, selectedAddress } = this.props
+  const { backToAccountDetail, selectedAddress, currentCurrency } = this.props
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
 
@@ -171,10 +173,10 @@ ConfirmSendEther.prototype.render = function () {
       name: toName,
     },
     memo,
-    gasFeeInUSD,
+    gasFeeInFIAT,
     gasFeeInETH,
-    amountInUSD,
+    amountInFIAT,
-    totalInUSD,
+    totalInFIAT,
     totalInETH,
   } = this.getData()
 
@@ -239,8 +241,8 @@ ConfirmSendEther.prototype.render = function () {
         //   `You're sending to Recipient ...${toAddress.slice(toAddress.length - 4)}`,
         // ]),
 
-        h('h3.flex-center.confirm-screen-send-amount', [`$${amountInUSD}`]),
+        h('h3.flex-center.confirm-screen-send-amount', [`$${amountInFIAT}`]),
-        h('h3.flex-center.confirm-screen-send-amount-currency', [ 'USD' ]),
+        h('h3.flex-center.confirm-screen-send-amount-currency', [ currentCurrency.toUpperCase() ]),
         h('div.flex-center.confirm-memo-wrapper', [
           h('h3.confirm-screen-send-memo', [ memo ? `"${memo}"` : '' ]),
         ]),
@@ -265,7 +267,7 @@ ConfirmSendEther.prototype.render = function () {
           h('section.flex-row.flex-center.confirm-screen-row', [
             h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]),
             h('div.confirm-screen-section-column', [
-              h('div.confirm-screen-row-info', `$${gasFeeInUSD} USD`),
+              h('div.confirm-screen-row-info', `${gasFeeInFIAT} ${currentCurrency.toUpperCase()}`),
 
               h('div.confirm-screen-row-detail', `${gasFeeInETH} ETH`),
             ]),
@@ -279,7 +281,7 @@ ConfirmSendEther.prototype.render = function () {
             ]),
 
             h('div.confirm-screen-section-column', [
-              h('div.confirm-screen-row-info', `$${totalInUSD} USD`),
+              h('div.confirm-screen-row-info', `${totalInFIAT} ${currentCurrency.toUpperCase()}`),
               h('div.confirm-screen-row-detail', `${totalInETH} ETH`),
             ]),
           ]),

ui/app/components/pending-tx/confirm-send-token.js

@@ -89,7 +89,7 @@ ConfirmSendToken.prototype.getAmount = function () {
 }
 
 ConfirmSendToken.prototype.getGasFee = function () {
-  const { conversionRate, tokenExchangeRate, token } = this.props
+  const { conversionRate, tokenExchangeRate, token, currentCurrency } = this.props
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
   const { decimals } = token
@@ -101,12 +101,12 @@ ConfirmSendToken.prototype.getGasFee = function () {
     multiplierBase: 16,
   })
 
-  const USD = conversionUtil(gasTotal, {
+  const FIAT = conversionUtil(txFeeBn, {
     fromNumericBase: 'BN',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
     fromCurrency: 'ETH',
-    toCurrency: 'USD',
+    toCurrency: currentCurrency,
     numberOfDecimals: 2,
     conversionRate,
   })
@@ -131,7 +131,7 @@ ConfirmSendToken.prototype.getGasFee = function () {
   })
 
   return {
-    fiat: +Number(USD).toFixed(2),
+    fiat: +Number(FIAT).toFixed(2),
     eth: ETH,
     token: tokenExchangeRate
       ? tokenGas
@@ -160,7 +160,7 @@ ConfirmSendToken.prototype.getData = function () {
 }
 
 ConfirmSendToken.prototype.renderHeroAmount = function () {
-  const { token: { symbol } } = this.props
+  const { token: { symbol }, currentCurrency } = this.props
   const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
@@ -169,8 +169,8 @@ ConfirmSendToken.prototype.renderHeroAmount = function () {
   return fiatAmount
     ? (
       h('div.confirm-send-token__hero-amount-wrapper', [
-        h('h3.flex-center.confirm-screen-send-amount', `$${fiatAmount}`),
+        h('h3.flex-center.confirm-screen-send-amount', `${fiatAmount}`),
-        h('h3.flex-center.confirm-screen-send-amount-currency', 'USD'),
+        h('h3.flex-center.confirm-screen-send-amount-currency', currentCurrency),
         h('div.flex-center.confirm-memo-wrapper', [
           h('h3.confirm-screen-send-memo', [ memo ? `"${memo}"` : '' ]),
         ]),
@@ -188,14 +188,14 @@ ConfirmSendToken.prototype.renderHeroAmount = function () {
 }
 
 ConfirmSendToken.prototype.renderGasFee = function () {
-  const { token: { symbol } } = this.props
+  const { token: { symbol }, currentCurrency } = this.props
   const { fiat: fiatGas, token: tokenGas, eth: ethGas } = this.getGasFee()
 
   return (
     h('section.flex-row.flex-center.confirm-screen-row', [
       h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]),
       h('div.confirm-screen-section-column', [
-        h('div.confirm-screen-row-info', `$${fiatGas} USD`),
+        h('div.confirm-screen-row-info', `${fiatGas} ${currentCurrency}`),
 
         h(
           'div.confirm-screen-row-detail',
@@ -207,7 +207,7 @@ ConfirmSendToken.prototype.renderGasFee = function () {
 }
 
 ConfirmSendToken.prototype.renderTotalPlusGas = function () {
-  const { token: { symbol } } = this.props
+  const { token: { symbol }, currentCurrency } = this.props
   const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
   const { fiat: fiatGas, token: tokenGas } = this.getGasFee()
 
@@ -222,8 +222,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
         ]),
 
         h('div.confirm-screen-section-column', [
-          h('div.confirm-screen-row-info', `$${fiatAmount + fiatGas} USD`),
+          h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency}`),
-          h('div.confirm-screen-row-detail', `${tokenTotal} ${symbol}`),
+          h('div.confirm-screen-row-detail', `${tokenAmount + tokenGas} ${symbol}`),
         ]),
       ])
     )
@@ -236,7 +236,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
 
         h('div.confirm-screen-section-column', [
           h('div.confirm-screen-row-info', `${tokenAmount} ${symbol}`),
-          h('div.confirm-screen-row-detail', `+ ${fiatGas} USD Gas`),
+          h('div.confirm-screen-row-detail', `+ ${fiatGas} ${currentCurrency} Gas`),
         ]),
       ])
     )

ui/app/components/pending-tx/index.js

@@ -36,7 +36,6 @@ function mapStateToProps (state) {
 
 function mapDispatchToProps (dispatch) {
   return {
-    setCurrentCurrencyToUSD: () => dispatch(actions.setCurrentCurrency('usd')),
     backToAccountDetail: address => dispatch(actions.backToAccountDetail(address)),
     cancelTransaction: ({ id }) => dispatch(actions.cancelTx({ id })),
   }
@@ -58,8 +57,6 @@ PendingTx.prototype.componentWillMount = async function () {
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
 
-  this.props.setCurrentCurrencyToUSD()
-
   if (!txParams.to) {
     return this.setState({
       transactionType: TX_TYPES.DEPLOY_CONTRACT,

ui/app/components/send/account-list-item.js

@@ -4,7 +4,7 @@ const inherits = require('util').inherits
 const connect = require('react-redux').connect
 const Identicon = require('../identicon')
 const CurrencyDisplay = require('./currency-display')
-const { conversionRateSelector } = require('../../selectors')
+const { conversionRateSelector, getCurrentCurrency } = require('../../selectors')
 
 inherits(AccountListItem, Component)
 function AccountListItem () {
@@ -13,7 +13,8 @@ function AccountListItem () {
 
 function mapStateToProps(state) {
   return {
-    conversionRate: conversionRateSelector(state)
+    conversionRate: conversionRateSelector(state),
+    currentCurrency: getCurrentCurrency(state),
   }
 }
 
@@ -25,6 +26,7 @@ AccountListItem.prototype.render = function () {
     handleClick, 
     icon = null,
     conversionRate,
+    currentCurrency,
   } = this.props
 
   const { name, address, balance } = account
@@ -52,10 +54,9 @@ AccountListItem.prototype.render = function () {
 
     h(CurrencyDisplay, {
       primaryCurrency: 'ETH',
-      convertedCurrency: 'USD',
+      convertedCurrency: currentCurrency,
       value: balance,
       conversionRate,
-      convertedPrefix: '$',
       readOnly: true,
       className: 'account-list-item__account-balances',
       primaryBalanceClassName: 'account-list-item__account-primary-balance',

ui/app/components/send/currency-display.js

@@ -118,7 +118,7 @@ CurrencyDisplay.prototype.render = function () {
 
     h('div', {
       className: convertedBalanceClassName,
-    }, `${convertedPrefix}${convertedValue} ${convertedCurrency}`),
+    }, `${convertedValue} ${convertedCurrency.toUpperCase()}`),
 
   ])
     

ui/app/components/send/gas-fee-display-v2.js

@@ -15,6 +15,8 @@ GasFeeDisplay.prototype.render = function () {
     conversionRate,
     gasTotal,
     onClick,
+    primaryCurrency = 'ETH',
+    convertedCurrency,
   } = this.props
 
   return h('div.send-v2__gas-fee-display', [
@@ -22,7 +24,7 @@ GasFeeDisplay.prototype.render = function () {
     gasTotal
       ? h(CurrencyDisplay, {
         primaryCurrency: 'ETH',
-        convertedCurrency: 'USD',
+        convertedCurrency,
         value: gasTotal,
         conversionRate,
         convertedPrefix: '$',

ui/app/components/send/send-v2-container.js

@@ -16,6 +16,7 @@ const {
   getGasLimit,
   getAddressBook,
   getSendFrom,
+  getCurrentCurrency,
 } = require('../../selectors')
 
 module.exports = connect(mapStateToProps, mapDispatchToProps)(SendEther)
@@ -30,7 +31,7 @@ function mapStateToProps (state) {
 
   let data;
   let primaryCurrency;
-  let tokenToUSDRate;
+  let tokenToFiatRate;
   if (selectedToken) {
     data = Array.prototype.map.call(
       abi.rawEncode(['address', 'uint256'], [selectedAddress, '0x0']),
@@ -39,7 +40,7 @@ function mapStateToProps (state) {
 
     primaryCurrency = selectedToken.symbol
 
-    tokenToUSDRate = multiplyCurrencies(
+    tokenToFiatRate = multiplyCurrencies(
       conversionRate,
       selectedTokenExchangeRate,
       { toNumericBase: 'dec' }
@@ -54,8 +55,9 @@ function mapStateToProps (state) {
     conversionRate,
     selectedToken,
     primaryCurrency,
+    convertedCurrency: getCurrentCurrency(state),
     data,
-    amountConversionRate: selectedToken ? tokenToUSDRate : conversionRate,
+    amountConversionRate: selectedToken ? tokenToFiatRate : conversionRate,
   }
 }
 

ui/app/components/tx-list-item.js

@@ -11,11 +11,14 @@ const Identicon = require('./identicon')
 
 const { conversionUtil } = require('../conversion-util')
 
+const { getCurrentCurrency } = require('../selectors')
+
 module.exports = connect(mapStateToProps)(TxListItem)
 
 function mapStateToProps (state) {
   return {
     tokens: state.metamask.tokens,
+    currentCurrency: getCurrentCurrency(state),
   }
 }
 
@@ -49,17 +52,18 @@ TxListItem.prototype.getSendEtherTotal = function () {
     transactionAmount,
     conversionRate,
     address,
+    currentCurrency,
   } = this.props
 
   if (!address) {
     return {}
   }
 
-  const totalInUSD = conversionUtil(transactionAmount, {
+  const totalInFiat = conversionUtil(transactionAmount, {
     fromNumericBase: 'hex',
     toNumericBase: 'dec',
     fromCurrency: 'ETH',
-    toCurrency: 'USD',
+    toCurrency: currentCurrency,
     fromDenomination: 'WEI',
     numberOfDecimals: 2,
     conversionRate,
@@ -76,7 +80,7 @@ TxListItem.prototype.getSendEtherTotal = function () {
 
   return {
     total: `${totalInETH} ETH`,
-    fiatTotal: `$${totalInUSD} USD`,
+    fiatTotal: `${totalInFiat} ${currentCurrency.toUpperCase()}`,
   }
 }
 

ui/app/config.js

@@ -170,6 +170,7 @@ function currentConversionInformation (metamaskState, state) {
       },
       defaultValue: currentCurrency,
     }, infuraCurrencies.map((currency) => {
+      console.log(`currency`, currency);
       return h('option', {key: currency.quote.code, value: currency.quote.code}, `${currency.quote.code.toUpperCase()} - ${currency.quote.name}`)
     })
   ),

ui/app/conversion-util.js

@@ -36,7 +36,7 @@ const BIG_NUMBER_GWEI_MULTIPLIER = new BigNumber('1000000000')
 
 // Individual Setters
 const convert = R.invoker(1, 'times')
-const round = R.invoker(2, 'toFormat')(R.__, BigNumber.ROUND_DOWN)
+const round = R.invoker(2, 'round')(R.__, BigNumber.ROUND_DOWN)
 const invertConversionRate = conversionRate => () => new BigNumber(1.0).div(conversionRate)
 
 // Setter Maps

ui/app/selectors.js

@@ -15,6 +15,7 @@ const selectors = {
   getGasLimit,
   getAddressBook,
   getSendFrom,
+  getCurrentCurrency,
 }
 
 module.exports = selectors
@@ -121,3 +122,7 @@ function getGasLimit (state) {
 function getSendFrom (state) {
   return state.metamask.send.from
 }
+
+function getCurrentCurrency (state) {
+  return state.metamask.currentCurrency
+}

ui/app/send-v2.js

@@ -277,6 +277,7 @@ SendTransactionScreen.prototype.renderAmountRow = function () {
   const {
     selectedToken,
     primaryCurrency = 'ETH',
+    convertedCurrency,
     amountConversionRate,
     errors,
   } = this.props
@@ -294,10 +295,9 @@ SendTransactionScreen.prototype.renderAmountRow = function () {
       h(CurrencyDisplay, {
         inError: Boolean(errors.amount),
         primaryCurrency,
-        convertedCurrency: 'USD',
+        convertedCurrency,
         value: amount,
         conversionRate: amountConversionRate,
-        convertedPrefix: '$',
         handleChange: this.handleAmountChange,
         validate: this.validateAmount,
       }),
@@ -309,6 +309,7 @@ SendTransactionScreen.prototype.renderAmountRow = function () {
 SendTransactionScreen.prototype.renderGasRow = function () {
   const {
     conversionRate,
+    convertedCurrency,
     showCustomizeGasModal,
     gasTotal = MIN_GAS_TOTAL,
   } = this.props
@@ -322,6 +323,7 @@ SendTransactionScreen.prototype.renderGasRow = function () {
       h(GasFeeDisplay, {
         gasTotal,
         conversionRate,
+        convertedCurrency,
         onClick: showCustomizeGasModal,
       }),