mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Refactor gas-fee-display to include usd and eth fee displays as separate components.
This commit is contained in:
parent
5a7e4c4e76
commit
3ea841e276
37
ui/app/components/send/eth-fee-display.js
Normal file
37
ui/app/components/send/eth-fee-display.js
Normal file
@ -0,0 +1,37 @@
|
||||
const Component = require('react').Component
|
||||
const h = require('react-hyperscript')
|
||||
const inherits = require('util').inherits
|
||||
const EthBalance = require('../eth-balance')
|
||||
const { getTxFeeBn } = require('../../util')
|
||||
|
||||
module.exports = EthFeeDisplay
|
||||
|
||||
inherits(EthFeeDisplay, Component)
|
||||
function EthFeeDisplay () {
|
||||
Component.call(this)
|
||||
}
|
||||
|
||||
EthFeeDisplay.prototype.render = function () {
|
||||
const {
|
||||
currentCurrency,
|
||||
conversionRate,
|
||||
gas,
|
||||
gasPrice,
|
||||
blockGasLimit,
|
||||
} = this.props
|
||||
|
||||
return h(EthBalance, {
|
||||
value: getTxFeeBn(gas, gasPrice, blockGasLimit),
|
||||
currentCurrency,
|
||||
conversionRate,
|
||||
showFiat: false,
|
||||
hideTooltip: true,
|
||||
styleOveride: {
|
||||
color: '#5d5d5d',
|
||||
fontSize: '16px',
|
||||
fontFamily: 'DIN OT',
|
||||
lineHeight: '22.4px'
|
||||
}
|
||||
})
|
||||
}
|
||||
|
@ -1,9 +1,8 @@
|
||||
const Component = require('react').Component
|
||||
const h = require('react-hyperscript')
|
||||
const inherits = require('util').inherits
|
||||
const EthBalance = require('../eth-balance')
|
||||
const FiatValue = require('../fiat-value')
|
||||
const { getTxFeeBn } = require('../../util')
|
||||
const USDFeeDisplay = require('./usd-fee-display')
|
||||
const EthFeeDisplay = require('./eth-fee-display')
|
||||
|
||||
module.exports = GasFeeDisplay
|
||||
|
||||
@ -21,33 +20,25 @@ GasFeeDisplay.prototype.render = function () {
|
||||
blockGasLimit,
|
||||
} = this.props
|
||||
|
||||
const renderableCurrencies = {
|
||||
USD: h(FiatValue, {
|
||||
value: getTxFeeBn(gas, gasPrice, blockGasLimit),
|
||||
conversionRate,
|
||||
currentCurrency,
|
||||
style: {
|
||||
color: '#5d5d5d',
|
||||
fontSize: '16px',
|
||||
fontFamily: 'DIN OT',
|
||||
lineHeight: '22.4px'
|
||||
}
|
||||
}),
|
||||
ETH: h(EthBalance, {
|
||||
value: getTxFeeBn(gas, gasPrice, blockGasLimit),
|
||||
currentCurrency,
|
||||
conversionRate,
|
||||
showFiat: false,
|
||||
hideTooltip: true,
|
||||
styleOveride: {
|
||||
color: '#5d5d5d',
|
||||
fontSize: '16px',
|
||||
fontFamily: 'DIN OT',
|
||||
lineHeight: '22.4px'
|
||||
}
|
||||
}),
|
||||
switch (currentCurrency) {
|
||||
case 'USD':
|
||||
return h(USDFeeDisplay, {
|
||||
currentCurrency,
|
||||
conversionRate,
|
||||
gas,
|
||||
gasPrice,
|
||||
blockGasLimit,
|
||||
})
|
||||
case 'ETH':
|
||||
return h(EthFeeDisplay, {
|
||||
currentCurrency,
|
||||
conversionRate,
|
||||
gas,
|
||||
gasPrice,
|
||||
blockGasLimit,
|
||||
})
|
||||
default:
|
||||
return h('noscript');
|
||||
}
|
||||
|
||||
return renderableCurrencies[currentCurrency];
|
||||
}
|
||||
|
||||
|
35
ui/app/components/send/usd-fee-display.js
Normal file
35
ui/app/components/send/usd-fee-display.js
Normal file
@ -0,0 +1,35 @@
|
||||
const Component = require('react').Component
|
||||
const h = require('react-hyperscript')
|
||||
const inherits = require('util').inherits
|
||||
const FiatValue = require('../fiat-value')
|
||||
const { getTxFeeBn } = require('../../util')
|
||||
|
||||
module.exports = USDFeeDisplay
|
||||
|
||||
inherits(USDFeeDisplay, Component)
|
||||
function USDFeeDisplay () {
|
||||
Component.call(this)
|
||||
}
|
||||
|
||||
USDFeeDisplay.prototype.render = function () {
|
||||
const {
|
||||
currentCurrency,
|
||||
conversionRate,
|
||||
gas,
|
||||
gasPrice,
|
||||
blockGasLimit,
|
||||
} = this.props
|
||||
|
||||
return h(FiatValue, {
|
||||
value: getTxFeeBn(gas, gasPrice, blockGasLimit),
|
||||
conversionRate,
|
||||
currentCurrency,
|
||||
style: {
|
||||
color: '#5d5d5d',
|
||||
fontSize: '16px',
|
||||
fontFamily: 'DIN OT',
|
||||
lineHeight: '22.4px'
|
||||
}
|
||||
})
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user