1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-05 07:24:56 +01:00
metamask-extension/ui/app/pages/send/send-content/send-gas-row/gas-fee-display/gas-fee-display.component.js

60 lines
1.6 KiB
JavaScript
Raw Normal View History

2019-12-03 21:50:55 +01:00
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import UserPreferencedCurrencyDisplay from '../../../../../components/app/user-preferenced-currency-display'
import { PRIMARY, SECONDARY } from '../../../../../helpers/constants/common'
export default class GasFeeDisplay extends Component {
2018-06-21 09:03:19 +02:00
static propTypes = {
gasLoadingError: PropTypes.bool,
gasTotal: PropTypes.string,
onReset: PropTypes.func,
}
2018-06-21 09:03:19 +02:00
static contextTypes = {
t: PropTypes.func,
}
2018-07-03 00:49:33 +02:00
render () {
const { gasTotal, gasLoadingError, onReset } = this.props
return (
<div className="send-v2__gas-fee-display">
{/* eslint-disable-next-line no-nested-ternary */}
{gasTotal
? (
<div className="currency-display">
<UserPreferencedCurrencyDisplay
value={gasTotal}
type={PRIMARY}
/>
<UserPreferencedCurrencyDisplay
className="currency-display__converted-value"
value={gasTotal}
type={SECONDARY}
/>
</div>
)
: gasLoadingError
? (
<div className="currency-display.currency-display--message">
{this.context.t('setGasPrice')}
</div>
)
: (
<div className="currency-display">
{this.context.t('loading')}
</div>
)
}
<button
className="gas-fee-reset"
onClick={onReset}
>
{ this.context.t('reset') }
</button>
</div>
)
}
}