diff options
Diffstat (limited to 'ui/app/components/transaction-breakdown')
-rw-r--r-- | ui/app/components/transaction-breakdown/transaction-breakdown.component.js | 35 |
1 files changed, 26 insertions, 9 deletions
diff --git a/ui/app/components/transaction-breakdown/transaction-breakdown.component.js b/ui/app/components/transaction-breakdown/transaction-breakdown.component.js index bb6075e9f..77bedcad7 100644 --- a/ui/app/components/transaction-breakdown/transaction-breakdown.component.js +++ b/ui/app/components/transaction-breakdown/transaction-breakdown.component.js @@ -4,8 +4,9 @@ import classnames from 'classnames' import TransactionBreakdownRow from './transaction-breakdown-row' 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 } from '../../constants/common' +import { ETH, GWEI, PRIMARY, SECONDARY } from '../../constants/common' import { getHexGasTotal } from '../../helpers/confirm-transaction/util' import { sumHexes } from '../../helpers/transactions.util' @@ -26,8 +27,11 @@ export default class TransactionBreakdown extends PureComponent { render () { const { t } = this.context const { transaction, className } = this.props - const { txParams: { gas, gasPrice, value } = {} } = transaction - const hexGasTotal = getHexGasTotal({ gasLimit: gas, gasPrice }) + const { txParams: { gas, gasPrice, value } = {}, txReceipt: { gasUsed } = {} } = transaction + + const gasLimit = typeof gasUsed === 'string' ? gasUsed : gas + + const hexGasTotal = getHexGasTotal({ gasLimit, gasPrice }) const totalInHex = sumHexes(hexGasTotal, value) return ( @@ -37,9 +41,9 @@ export default class TransactionBreakdown extends PureComponent { className="transaction-breakdown__card" > <TransactionBreakdownRow title={t('amount')}> - <CurrencyDisplay + <UserPreferencedCurrencyDisplay className="transaction-breakdown__value" - currency={ETH} + type={PRIMARY} value={value} /> </TransactionBreakdownRow> @@ -52,6 +56,19 @@ export default class TransactionBreakdown extends PureComponent { value={gas} /> </TransactionBreakdownRow> + { + typeof gasUsed === 'string' && ( + <TransactionBreakdownRow + title={`${t('gasUsed')} (${t('units')})`} + className="transaction-breakdown__row-title" + > + <HexToDecimal + className="transaction-breakdown__value" + value={gasUsed} + /> + </TransactionBreakdownRow> + ) + } <TransactionBreakdownRow title={t('gasPrice')}> <CurrencyDisplay className="transaction-breakdown__value" @@ -63,14 +80,14 @@ export default class TransactionBreakdown extends PureComponent { </TransactionBreakdownRow> <TransactionBreakdownRow title={t('total')}> <div> - <CurrencyDisplay + <UserPreferencedCurrencyDisplay className="transaction-breakdown__value transaction-breakdown__value--eth-total" - currency={ETH} + type={PRIMARY} value={totalInHex} - numberOfDecimals={6} /> - <CurrencyDisplay + <UserPreferencedCurrencyDisplay className="transaction-breakdown__value" + type={SECONDARY} value={totalInHex} /> </div> |