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

46 lines
1.4 KiB
JavaScript
Raw Normal View History

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,
};
2020-11-03 00:41:28 +01:00
render() {
const { gasTotal, gasLoadingError, onReset } = this.props;
return (
<div className="send-v2__gas-fee-display">
{/* eslint-disable-next-line no-nested-ternary */}
2020-11-03 00:41:28 +01:00
{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>
);
}
}