mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-11-23 02:10:12 +01:00
Remove unused customize-gas modal (#7185)
This modal hasn't been used since #5704, where it was replaced.
This commit is contained in:
Mark Stacey
GitHub
parent
c007fcab1a
commit
8a08b320e5
@ -1,162 +0,0 @@
|
||||
import React, { Component } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import BigNumber from 'bignumber.js'
|
||||
import GasModalCard from '../../customize-gas-modal/gas-modal-card'
|
||||
import { MIN_GAS_PRICE_GWEI } from '../../../../pages/send/send.constants'
|
||||
import Button from '../../../ui/button'
|
||||
|
||||
import {
|
||||
getDecimalGasLimit,
|
||||
getDecimalGasPrice,
|
||||
getPrefixedHexGasLimit,
|
||||
getPrefixedHexGasPrice,
|
||||
} from './customize-gas.util'
|
||||
|
||||
export default class CustomizeGas extends Component {
|
||||
static contextTypes = {
|
||||
t: PropTypes.func,
|
||||
metricsEvent: PropTypes.func,
|
||||
}
|
||||
|
||||
static propTypes = {
|
||||
txData: PropTypes.object.isRequired,
|
||||
hideModal: PropTypes.func,
|
||||
validate: PropTypes.func,
|
||||
onSubmit: PropTypes.func,
|
||||
}
|
||||
|
||||
state = {
|
||||
gasPrice: 0,
|
||||
gasLimit: 0,
|
||||
originalGasPrice: 0,
|
||||
originalGasLimit: 0,
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
const { txData = {} } = this.props
|
||||
const { txParams: { gas: hexGasLimit, gasPrice: hexGasPrice } = {} } = txData
|
||||
|
||||
const gasLimit = getDecimalGasLimit(hexGasLimit)
|
||||
const gasPrice = getDecimalGasPrice(hexGasPrice)
|
||||
|
||||
this.setState({
|
||||
gasPrice,
|
||||
gasLimit,
|
||||
originalGasPrice: gasPrice,
|
||||
originalGasLimit: gasLimit,
|
||||
})
|
||||
}
|
||||
|
||||
handleRevert () {
|
||||
const { originalGasPrice, originalGasLimit } = this.state
|
||||
|
||||
this.setState({
|
||||
gasPrice: originalGasPrice,
|
||||
gasLimit: originalGasLimit,
|
||||
})
|
||||
}
|
||||
|
||||
handleSave () {
|
||||
const { onSubmit, hideModal } = this.props
|
||||
const { gasLimit, gasPrice } = this.state
|
||||
const prefixedHexGasPrice = getPrefixedHexGasPrice(gasPrice)
|
||||
const prefixedHexGasLimit = getPrefixedHexGasLimit(gasLimit)
|
||||
|
||||
Promise.resolve(onSubmit({ gasPrice: prefixedHexGasPrice, gasLimit: prefixedHexGasLimit }))
|
||||
.then(() => hideModal())
|
||||
}
|
||||
|
||||
validate () {
|
||||
const { gasLimit, gasPrice } = this.state
|
||||
return this.props.validate({
|
||||
gasPrice: getPrefixedHexGasPrice(gasPrice),
|
||||
gasLimit: getPrefixedHexGasLimit(gasLimit),
|
||||
})
|
||||
}
|
||||
|
||||
render () {
|
||||
const { t, metricsEvent } = this.context
|
||||
const { hideModal } = this.props
|
||||
const { gasPrice, gasLimit, originalGasPrice, originalGasLimit } = this.state
|
||||
const { valid, errorKey } = this.validate()
|
||||
|
||||
return (
|
||||
<div className="customize-gas">
|
||||
<div className="customize-gas__content">
|
||||
<div className="customize-gas__header">
|
||||
<div className="customize-gas__title">
|
||||
{ this.context.t('customGas') }
|
||||
</div>
|
||||
<div
|
||||
className="customize-gas__close"
|
||||
onClick={() => hideModal()}
|
||||
/>
|
||||
</div>
|
||||
<div className="customize-gas__body">
|
||||
<GasModalCard
|
||||
value={gasPrice}
|
||||
min={MIN_GAS_PRICE_GWEI}
|
||||
step={1}
|
||||
onChange={value => this.setState({ gasPrice: value })}
|
||||
title={t('gasPrice')}
|
||||
copy={t('gasPriceCalculation')}
|
||||
/>
|
||||
<GasModalCard
|
||||
value={gasLimit}
|
||||
min={1}
|
||||
step={1}
|
||||
onChange={value => this.setState({ gasLimit: value })}
|
||||
title={t('gasLimit')}
|
||||
copy={t('gasLimitCalculation')}
|
||||
/>
|
||||
</div>
|
||||
<div className="customize-gas__footer">
|
||||
{ !valid && <div className="customize-gas__error-message">{ t(errorKey) }</div> }
|
||||
<div
|
||||
className="customize-gas__revert"
|
||||
onClick={() => this.handleRevert()}
|
||||
>
|
||||
{ t('revert') }
|
||||
</div>
|
||||
<div className="customize-gas__buttons">
|
||||
<Button
|
||||
type="default"
|
||||
className="customize-gas__cancel"
|
||||
onClick={() => hideModal()}
|
||||
style={{ marginRight: '10px' }}
|
||||
>
|
||||
{ t('cancel') }
|
||||
</Button>
|
||||
<Button
|
||||
type="secondary"
|
||||
className="customize-gas__save"
|
||||
onClick={() => {
|
||||
metricsEvent({
|
||||
eventOpts: {
|
||||
category: 'Activation',
|
||||
action: 'userCloses',
|
||||
name: 'closeCustomizeGas',
|
||||
},
|
||||
pageOpts: {
|
||||
section: 'customizeGasModal',
|
||||
component: 'customizeGasSaveButton',
|
||||
},
|
||||
customVariables: {
|
||||
gasPriceChange: (new BigNumber(gasPrice)).minus(new BigNumber(originalGasPrice)).toString(10),
|
||||
gasLimitChange: (new BigNumber(gasLimit)).minus(new BigNumber(originalGasLimit)).toString(10),
|
||||
},
|
||||
})
|
||||
this.handleSave()
|
||||
}}
|
||||
style={{ marginRight: '10px' }}
|
||||
disabled={!valid}
|
||||
>
|
||||
{ t('save') }
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
@ -1,22 +0,0 @@
|
||||
import { connect } from 'react-redux'
|
||||
import CustomizeGas from './customize-gas.component'
|
||||
import { hideModal } from '../../../../store/actions'
|
||||
|
||||
const mapStateToProps = state => {
|
||||
const { appState: { modal: { modalState: { props } } } } = state
|
||||
const { txData, onSubmit, validate } = props
|
||||
|
||||
return {
|
||||
txData,
|
||||
onSubmit,
|
||||
validate,
|
||||
}
|
||||
}
|
||||
|
||||
const mapDispatchToProps = dispatch => {
|
||||
return {
|
||||
hideModal: () => dispatch(hideModal()),
|
||||
}
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(CustomizeGas)
|
||||
@ -1,34 +0,0 @@
|
||||
import ethUtil from 'ethereumjs-util'
|
||||
import { conversionUtil } from '../../../../helpers/utils/conversion-util'
|
||||
|
||||
export function getDecimalGasLimit (hexGasLimit) {
|
||||
return conversionUtil(hexGasLimit, {
|
||||
fromNumericBase: 'hex',
|
||||
toNumericBase: 'dec',
|
||||
})
|
||||
}
|
||||
|
||||
export function getDecimalGasPrice (hexGasPrice) {
|
||||
return conversionUtil(hexGasPrice, {
|
||||
fromNumericBase: 'hex',
|
||||
toNumericBase: 'dec',
|
||||
fromDenomination: 'WEI',
|
||||
toDenomination: 'GWEI',
|
||||
})
|
||||
}
|
||||
|
||||
export function getPrefixedHexGasLimit (gasLimit) {
|
||||
return ethUtil.addHexPrefix(conversionUtil(gasLimit, {
|
||||
fromNumericBase: 'dec',
|
||||
toNumericBase: 'hex',
|
||||
}))
|
||||
}
|
||||
|
||||
export function getPrefixedHexGasPrice (gasPrice) {
|
||||
return ethUtil.addHexPrefix(conversionUtil(gasPrice, {
|
||||
fromNumericBase: 'dec',
|
||||
toNumericBase: 'hex',
|
||||
fromDenomination: 'GWEI',
|
||||
toDenomination: 'WEI',
|
||||
}))
|
||||
}
|
||||
@ -1 +0,0 @@
|
||||
export { default } from './customize-gas.container'
|
||||
@ -1,110 +0,0 @@
|
||||
.customize-gas {
|
||||
border: 1px solid #D8D8D8;
|
||||
border-radius: 4px;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.14);
|
||||
font-family: Roboto;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
|
||||
@media screen and (max-width: $break-small) {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
&__header {
|
||||
height: 52px;
|
||||
border-bottom: 1px solid $alto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 22px;
|
||||
|
||||
@media screen and (max-width: $break-small) {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin-left: 19.25px;
|
||||
}
|
||||
|
||||
&__close::after {
|
||||
content: '\00D7';
|
||||
font-size: 1.8em;
|
||||
color: $dusty-gray;
|
||||
font-family: sans-serif;
|
||||
cursor: pointer;
|
||||
margin-right: 19.25px;
|
||||
}
|
||||
|
||||
&__content {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
&__body {
|
||||
display: flex;
|
||||
margin-bottom: 24px;
|
||||
|
||||
@media screen and (max-width: $break-small) {
|
||||
flex-flow: column;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
}
|
||||
|
||||
&__footer {
|
||||
height: 75px;
|
||||
border-top: 1px solid $alto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 22px;
|
||||
position: relative;
|
||||
|
||||
@media screen and (max-width: $break-small) {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
&__buttons {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-right: 21.25px;
|
||||
}
|
||||
|
||||
&__revert, &__cancel, &__save, &__save__error {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0 3px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&__revert {
|
||||
color: $silver-chalice;
|
||||
font-size: 16px;
|
||||
margin-left: 21.25px;
|
||||
}
|
||||
|
||||
&__cancel, &__save, &__save__error {
|
||||
width: 85.74px;
|
||||
min-width: initial;
|
||||
}
|
||||
|
||||
&__save__error {
|
||||
opacity: 0.5;
|
||||
cursor: auto;
|
||||
}
|
||||
|
||||
&__error-message {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
font-size: 12px;
|
||||
line-height: 12px;
|
||||
color: $red;
|
||||
}
|
||||
}
|
||||
@ -2,8 +2,6 @@
|
||||
|
||||
@import 'confirm-remove-account/index';
|
||||
|
||||
@import 'customize-gas/index';
|
||||
|
||||
@import 'qr-scanner/index';
|
||||
|
||||
@import 'transaction-confirmed/index';
|
||||
|
||||
Loading…
Reference in New Issue
Block a user