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

[NewUI] Get currentCurrency from state, allows other fiats
7 years ago · d3f923efef
parent c2880c4b8f f1c097ab5c
commit d3f923efef
14 changed files with 90 additions and 67 deletions
--- a/ui/app/app.js
+++ b/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 () {
--- a/ui/app/components/pending-tx/confirm-deploy-contract.js
+++ b/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-currency', 'USD'),
+      h('h3.flex-center.confirm-screen-send-amount', `${fiatAmount}`),
+      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`),
      ]),
    ])
--- a/ui/app/components/pending-tx/confirm-send-ether.js
+++ b/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)
-  const USD = conversionUtil(txParams.value, {
+  console.log(`conversionRate, currentCurrency`, conversionRate, currentCurrency);
+  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 { USD: amountInUSD, ETH: amountInETH } = this.getAmount()
+  const { FIAT: gasFeeInFIAT, ETH: gasFeeInETH } = this.getGasFee()
+  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,
-    totalInUSD,
+    amountInFIAT,
+    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-currency', [ 'USD' ]),
+        h('h3.flex-center.confirm-screen-send-amount', [`$${amountInFIAT}`]),
+        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`),
            ]),
          ]),
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/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-currency', 'USD'),
+        h('h3.flex-center.confirm-screen-send-amount', `${fiatAmount}`),
+        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-detail', `${tokenTotal} ${symbol}`),
+          h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency}`),
+          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`),
        ]),
      ])
    )
--- a/ui/app/components/pending-tx/index.js
+++ b/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,
--- a/ui/app/components/send/account-list-item.js
+++ b/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',
--- a/ui/app/components/send/currency-display.js
+++ b/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()}`),

  ])
    
--- a/ui/app/components/send/gas-fee-display-v2.js
+++ b/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: '$',
--- a/ui/app/components/send/send-v2-container.js
+++ b/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,
  }
 }

--- a/ui/app/components/tx-list-item.js
+++ b/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()}`,
  }
 }

--- a/ui/app/config.js
+++ b/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}`)
    })
  ),
--- a/ui/app/conversion-util.js
+++ b/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
--- a/ui/app/selectors.js
+++ b/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
+}
--- a/ui/app/send-v2.js
+++ b/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,
      }),