import React, { Component } from 'react' import PropTypes from 'prop-types' import SendRowWrapper from '../send-row-wrapper' import GasPriceButtonGroup from '../../../../components/app/gas-customization/gas-price-button-group' import AdvancedGasInputs from '../../../../components/app/gas-customization/advanced-gas-inputs' import GasFeeDisplay from './gas-fee-display/gas-fee-display.component' export default class SendGasRow extends Component { static propTypes = { balance: PropTypes.string, gasFeeError: PropTypes.bool, gasLoadingError: PropTypes.bool, gasTotal: PropTypes.string, maxModeOn: PropTypes.bool, showCustomizeGasModal: PropTypes.func, sendToken: PropTypes.object, setAmountToMax: PropTypes.func, setGasPrice: PropTypes.func, setGasLimit: PropTypes.func, tokenBalance: PropTypes.string, gasPriceButtonGroupProps: PropTypes.object, gasButtonGroupShown: PropTypes.bool, advancedInlineGasShown: PropTypes.bool, resetGasButtons: PropTypes.func, gasPrice: PropTypes.string, gasLimit: PropTypes.string, insufficientBalance: PropTypes.bool, isMainnet: PropTypes.bool, } static contextTypes = { t: PropTypes.func, metricsEvent: PropTypes.func, } renderAdvancedOptionsButton() { const { metricsEvent } = this.context const { showCustomizeGasModal, isMainnet } = this.props // Tests should behave in same way as mainnet, but are using Localhost if (!isMainnet && !process.env.IN_TEST) { return null } return (
{ metricsEvent({ eventOpts: { category: 'Transactions', action: 'Edit Screen', name: 'Clicked "Advanced Options"', }, }) showCustomizeGasModal() }} > {this.context.t('advancedOptions')}
) } setMaxAmount() { const { balance, gasTotal, sendToken, setAmountToMax, tokenBalance, } = this.props setAmountToMax({ balance, gasTotal, sendToken, tokenBalance, }) } renderContent() { const { gasLoadingError, gasTotal, showCustomizeGasModal, gasPriceButtonGroupProps, gasButtonGroupShown, advancedInlineGasShown, maxModeOn, resetGasButtons, setGasPrice, setGasLimit, gasPrice, gasLimit, insufficientBalance, isMainnet, } = this.props const { metricsEvent } = this.context const gasPriceButtonGroup = (
{ metricsEvent({ eventOpts: { category: 'Transactions', action: 'Edit Screen', name: 'Changed Gas Button', }, }) await gasPriceButtonGroupProps.handleGasPriceSelection(...args) if (maxModeOn) { this.setMaxAmount() } }} />
) const gasFeeDisplay = ( { resetGasButtons() if (maxModeOn) { this.setMaxAmount() } }} onClick={() => showCustomizeGasModal()} /> ) const advancedGasInputs = (
setGasPrice(newGasPrice, gasLimit) } updateCustomGasLimit={(newGasLimit) => setGasLimit(newGasLimit, gasPrice) } customGasPrice={gasPrice} customGasLimit={gasLimit} insufficientBalance={insufficientBalance} customPriceIsSafe isSpeedUp={false} />
) // Tests should behave in same way as mainnet, but are using Localhost if (advancedInlineGasShown || (!isMainnet && !process.env.IN_TEST)) { return advancedGasInputs } else if (gasButtonGroupShown) { return gasPriceButtonGroup } return gasFeeDisplay } render() { const { gasFeeError, gasButtonGroupShown, advancedInlineGasShown, } = this.props return ( <> {this.renderContent()} {gasButtonGroupShown || advancedInlineGasShown ? ( {this.renderAdvancedOptionsButton()} ) : null} ) } }