diff options
author | Chi Kei Chan <chikeichan@gmail.com> | 2019-03-22 07:03:30 +0800 |
---|---|---|
committer | Dan J Miller <danjm.com@gmail.com> | 2019-03-22 07:03:30 +0800 |
commit | 31175625b446cb5d18b17db23018bca8b14d280c (patch) | |
tree | f54e159883deef003fb281267025edf796eb8004 /ui/app/components/customize-gas-modal | |
parent | 7287133e15fab22299e07704206e85bc855d1064 (diff) | |
download | tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.tar.gz tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.tar.zst tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.zip |
Folder restructure (#6304)
* Remove ui/app/keychains/
* Remove ui/app/img/ (unused images)
* Move conversion-util to helpers/utils/
* Move token-util to helpers/utils/
* Move /helpers/*.js inside /helpers/utils/
* Move util tests inside /helpers/utils/
* Renameand move confirm-transaction/util.js to helpers/utils/
* Move higher-order-components to helpers/higher-order-components/
* Move infura-conversion.json to helpers/constants/
* Move all utility functions to helpers/utils/
* Move pages directory to top-level
* Move all constants to helpers/constants/
* Move metametrics inside helpers/
* Move app and root inside pages/
* Move routes inside helpers/
* Re-organize ducks/
* Move reducers to ducks/
* Move selectors inside selectors/
* Move test out of test folder
* Move action, reducer, store inside store/
* Move ui components inside ui/
* Move UI components inside ui/
* Move connected components inside components/app/
* Move i18n-helper inside helpers/
* Fix unit tests
* Fix unit test
* Move pages components
* Rename routes component
* Move reducers to ducks/index
* Fix bad path in unit test
Diffstat (limited to 'ui/app/components/customize-gas-modal')
-rw-r--r-- | ui/app/components/customize-gas-modal/gas-modal-card.js | 54 | ||||
-rw-r--r-- | ui/app/components/customize-gas-modal/gas-slider.js | 50 | ||||
-rw-r--r-- | ui/app/components/customize-gas-modal/index.js | 396 |
3 files changed, 0 insertions, 500 deletions
diff --git a/ui/app/components/customize-gas-modal/gas-modal-card.js b/ui/app/components/customize-gas-modal/gas-modal-card.js deleted file mode 100644 index 23754d819..000000000 --- a/ui/app/components/customize-gas-modal/gas-modal-card.js +++ /dev/null @@ -1,54 +0,0 @@ -const Component = require('react').Component -const h = require('react-hyperscript') -const inherits = require('util').inherits -const InputNumber = require('../input-number.js') -// const GasSlider = require('./gas-slider.js') - -module.exports = GasModalCard - -inherits(GasModalCard, Component) -function GasModalCard () { - Component.call(this) -} - -GasModalCard.prototype.render = function () { - const { - // memo, - onChange, - unitLabel, - value, - min, - // max, - step, - title, - copy, - } = this.props - - return h('div.send-v2__gas-modal-card', [ - - h('div.send-v2__gas-modal-card__title', {}, title), - - h('div.send-v2__gas-modal-card__copy', {}, copy), - - h(InputNumber, { - unitLabel, - step, - // max, - min, - placeholder: '0', - value, - onChange, - }), - - // h(GasSlider, { - // value, - // step, - // max, - // min, - // onChange, - // }), - - ]) - -} - diff --git a/ui/app/components/customize-gas-modal/gas-slider.js b/ui/app/components/customize-gas-modal/gas-slider.js deleted file mode 100644 index 69fd6f985..000000000 --- a/ui/app/components/customize-gas-modal/gas-slider.js +++ /dev/null @@ -1,50 +0,0 @@ -// const Component = require('react').Component -// const h = require('react-hyperscript') -// const inherits = require('util').inherits - -// module.exports = GasSlider - -// inherits(GasSlider, Component) -// function GasSlider () { -// Component.call(this) -// } - -// GasSlider.prototype.render = function () { -// const { -// memo, -// identities, -// onChange, -// unitLabel, -// value, -// id, -// step, -// max, -// min, -// } = this.props - -// return h('div.gas-slider', [ - -// h('input.gas-slider__input', { -// type: 'range', -// step, -// max, -// min, -// value, -// id: 'gasSlider', -// onChange: event => onChange(event.target.value), -// }, []), - -// h('div.gas-slider__bar', [ - -// h('div.gas-slider__low'), - -// h('div.gas-slider__mid'), - -// h('div.gas-slider__high'), - -// ]), - -// ]) - -// } - diff --git a/ui/app/components/customize-gas-modal/index.js b/ui/app/components/customize-gas-modal/index.js deleted file mode 100644 index fd660ead2..000000000 --- a/ui/app/components/customize-gas-modal/index.js +++ /dev/null @@ -1,396 +0,0 @@ -const Component = require('react').Component -const PropTypes = require('prop-types') -const h = require('react-hyperscript') -const inherits = require('util').inherits -const connect = require('react-redux').connect -const BigNumber = require('bignumber.js') -const actions = require('../../actions') -const GasModalCard = require('./gas-modal-card') -import Button from '../button' - -const ethUtil = require('ethereumjs-util') - -import { - updateSendErrors, -} from '../../ducks/send.duck' - -const { - MIN_GAS_PRICE_DEC, - MIN_GAS_LIMIT_DEC, - MIN_GAS_PRICE_GWEI, -} = require('../send/send.constants') - -const { - isBalanceSufficient, -} = require('../send/send.utils') - -const { - conversionUtil, - multiplyCurrencies, - conversionGreaterThan, - conversionMax, - subtractCurrencies, -} = require('../../conversion-util') - -const { - getGasIsLoading, - getForceGasMin, - conversionRateSelector, - getSendAmount, - getSelectedToken, - getSendFrom, - getCurrentAccountWithSendEtherInfo, - getSelectedTokenToFiatRate, - getSendMaxModeState, -} = require('../../selectors') - -const { - getGasPrice, - getGasLimit, -} = require('../send/send.selectors') - -function mapStateToProps (state) { - const selectedToken = getSelectedToken(state) - const currentAccount = getSendFrom(state) || getCurrentAccountWithSendEtherInfo(state) - const conversionRate = conversionRateSelector(state) - - return { - gasPrice: getGasPrice(state), - gasLimit: getGasLimit(state), - gasIsLoading: getGasIsLoading(state), - forceGasMin: getForceGasMin(state), - conversionRate, - amount: getSendAmount(state), - maxModeOn: getSendMaxModeState(state), - balance: currentAccount.balance, - primaryCurrency: selectedToken && selectedToken.symbol, - selectedToken, - amountConversionRate: selectedToken ? getSelectedTokenToFiatRate(state) : conversionRate, - } -} - -function mapDispatchToProps (dispatch) { - return { - hideModal: () => dispatch(actions.hideModal()), - setGasPrice: newGasPrice => dispatch(actions.setGasPrice(newGasPrice)), - setGasLimit: newGasLimit => dispatch(actions.setGasLimit(newGasLimit)), - setGasTotal: newGasTotal => dispatch(actions.setGasTotal(newGasTotal)), - updateSendAmount: newAmount => dispatch(actions.updateSendAmount(newAmount)), - updateSendErrors: error => dispatch(updateSendErrors(error)), - } -} - -function getFreshState (props) { - const gasPrice = props.gasPrice || MIN_GAS_PRICE_DEC - const gasLimit = props.gasLimit || MIN_GAS_LIMIT_DEC - - const gasTotal = multiplyCurrencies(gasLimit, gasPrice, { - toNumericBase: 'hex', - multiplicandBase: 16, - multiplierBase: 16, - }) - - return { - gasPrice, - gasLimit, - gasTotal, - error: null, - priceSigZeros: '', - priceSigDec: '', - } -} - -inherits(CustomizeGasModal, Component) -function CustomizeGasModal (props) { - Component.call(this) - - const originalState = getFreshState(props) - this.state = { - ...originalState, - originalState, - } -} - -CustomizeGasModal.contextTypes = { - t: PropTypes.func, - metricsEvent: PropTypes.func, -} - -module.exports = connect(mapStateToProps, mapDispatchToProps)(CustomizeGasModal) - -CustomizeGasModal.prototype.componentWillReceiveProps = function (nextProps) { - const currentState = getFreshState(this.props) - const { - gasPrice: currentGasPrice, - gasLimit: currentGasLimit, - } = currentState - const newState = getFreshState(nextProps) - const { - gasPrice: newGasPrice, - gasLimit: newGasLimit, - gasTotal: newGasTotal, - } = newState - const gasPriceChanged = currentGasPrice !== newGasPrice - const gasLimitChanged = currentGasLimit !== newGasLimit - - if (gasPriceChanged) { - this.setState({ - gasPrice: newGasPrice, - gasTotal: newGasTotal, - priceSigZeros: '', - priceSigDec: '', - }) - } - if (gasLimitChanged) { - this.setState({ gasLimit: newGasLimit, gasTotal: newGasTotal }) - } - if (gasLimitChanged || gasPriceChanged) { - this.validate({ gasLimit: newGasLimit, gasTotal: newGasTotal }) - } -} - -CustomizeGasModal.prototype.save = function (gasPrice, gasLimit, gasTotal) { - const { metricsEvent } = this.context - const { - setGasPrice, - setGasLimit, - hideModal, - setGasTotal, - maxModeOn, - selectedToken, - balance, - updateSendAmount, - updateSendErrors, - } = this.props - const { - originalState, - } = this.state - - if (maxModeOn && !selectedToken) { - const maxAmount = subtractCurrencies( - ethUtil.addHexPrefix(balance), - ethUtil.addHexPrefix(gasTotal), - { toNumericBase: 'hex' } - ) - updateSendAmount(maxAmount) - } - - metricsEvent({ - eventOpts: { - category: 'Activation', - action: 'userCloses', - name: 'closeCustomizeGas', - }, - pageOpts: { - section: 'customizeGasModal', - component: 'customizeGasSaveButton', - }, - customVariables: { - gasPriceChange: (new BigNumber(ethUtil.addHexPrefix(gasPrice))).minus(new BigNumber(ethUtil.addHexPrefix(originalState.gasPrice))).toString(10), - gasLimitChange: (new BigNumber(ethUtil.addHexPrefix(gasLimit))).minus(new BigNumber(ethUtil.addHexPrefix(originalState.gasLimit))).toString(10), - }, - }) - - setGasPrice(ethUtil.addHexPrefix(gasPrice)) - setGasLimit(ethUtil.addHexPrefix(gasLimit)) - setGasTotal(ethUtil.addHexPrefix(gasTotal)) - updateSendErrors({ insufficientFunds: false }) - hideModal() -} - -CustomizeGasModal.prototype.revert = function () { - this.setState(this.state.originalState) -} - -CustomizeGasModal.prototype.validate = function ({ gasTotal, gasLimit }) { - const { - amount, - balance, - selectedToken, - amountConversionRate, - conversionRate, - maxModeOn, - } = this.props - - let error = null - - const balanceIsSufficient = isBalanceSufficient({ - amount: selectedToken || maxModeOn ? '0' : amount, - gasTotal, - balance, - selectedToken, - amountConversionRate, - conversionRate, - }) - - if (!balanceIsSufficient) { - error = this.context.t('balanceIsInsufficientGas') - } - - const gasLimitTooLow = gasLimit && conversionGreaterThan( - { - value: MIN_GAS_LIMIT_DEC, - fromNumericBase: 'dec', - conversionRate, - }, - { - value: gasLimit, - fromNumericBase: 'hex', - }, - ) - - if (gasLimitTooLow) { - error = this.context.t('gasLimitTooLow') - } - - this.setState({ error }) - return error -} - -CustomizeGasModal.prototype.convertAndSetGasLimit = function (newGasLimit) { - const { gasPrice } = this.state - - const gasLimit = conversionUtil(newGasLimit, { - fromNumericBase: 'dec', - toNumericBase: 'hex', - }) - - const gasTotal = multiplyCurrencies(gasLimit, gasPrice, { - toNumericBase: 'hex', - multiplicandBase: 16, - multiplierBase: 16, - }) - - this.validate({ gasTotal, gasLimit }) - - this.setState({ gasTotal, gasLimit }) -} - -CustomizeGasModal.prototype.convertAndSetGasPrice = function (newGasPrice) { - const { gasLimit } = this.state - const sigZeros = String(newGasPrice).match(/^\d+[.]\d*?(0+)$/) - const sigDec = String(newGasPrice).match(/^\d+([.])0*$/) - - this.setState({ - priceSigZeros: sigZeros && sigZeros[1] || '', - priceSigDec: sigDec && sigDec[1] || '', - }) - - const gasPrice = conversionUtil(newGasPrice, { - fromNumericBase: 'dec', - toNumericBase: 'hex', - fromDenomination: 'GWEI', - toDenomination: 'WEI', - }) - - const gasTotal = multiplyCurrencies(gasLimit, gasPrice, { - toNumericBase: 'hex', - multiplicandBase: 16, - multiplierBase: 16, - }) - - this.validate({ gasTotal }) - - this.setState({ gasTotal, gasPrice }) -} - -CustomizeGasModal.prototype.render = function () { - const { hideModal, forceGasMin, gasIsLoading } = this.props - const { gasPrice, gasLimit, gasTotal, error, priceSigZeros, priceSigDec } = this.state - - let convertedGasPrice = conversionUtil(gasPrice, { - fromNumericBase: 'hex', - toNumericBase: 'dec', - fromDenomination: 'WEI', - toDenomination: 'GWEI', - }) - - convertedGasPrice += convertedGasPrice.match(/[.]/) ? priceSigZeros : `${priceSigDec}${priceSigZeros}` - - let newGasPrice = gasPrice - if (forceGasMin) { - const convertedMinPrice = conversionUtil(forceGasMin, { - fromNumericBase: 'hex', - toNumericBase: 'dec', - }) - convertedGasPrice = conversionMax( - { value: convertedMinPrice, fromNumericBase: 'dec' }, - { value: convertedGasPrice, fromNumericBase: 'dec' } - ) - newGasPrice = conversionMax( - { value: gasPrice, fromNumericBase: 'hex' }, - { value: forceGasMin, fromNumericBase: 'hex' } - ) - } - - const convertedGasLimit = conversionUtil(gasLimit, { - fromNumericBase: 'hex', - toNumericBase: 'dec', - }) - - return !gasIsLoading && h('div.send-v2__customize-gas', {}, [ - h('div.send-v2__customize-gas__content', { - }, [ - h('div.send-v2__customize-gas__header', {}, [ - - h('div.send-v2__customize-gas__title', this.context.t('customGas')), - - h('div.send-v2__customize-gas__close', { - onClick: hideModal, - }), - - ]), - - h('div.send-v2__customize-gas__body', {}, [ - - h(GasModalCard, { - value: convertedGasPrice, - min: forceGasMin || MIN_GAS_PRICE_GWEI, - step: 1, - onChange: value => this.convertAndSetGasPrice(value), - title: this.context.t('gasPrice'), - copy: this.context.t('gasPriceCalculation'), - gasIsLoading, - }), - - h(GasModalCard, { - value: convertedGasLimit, - min: 1, - step: 1, - onChange: value => this.convertAndSetGasLimit(value), - title: this.context.t('gasLimit'), - copy: this.context.t('gasLimitCalculation'), - gasIsLoading, - }), - - ]), - - h('div.send-v2__customize-gas__footer', {}, [ - - error && h('div.send-v2__customize-gas__error-message', [ - error, - ]), - - h('div.send-v2__customize-gas__revert', { - onClick: () => this.revert(), - }, [this.context.t('revert')]), - - h('div.send-v2__customize-gas__buttons', [ - h(Button, { - type: 'default', - className: 'send-v2__customize-gas__cancel', - onClick: this.props.hideModal, - }, [this.context.t('cancel')]), - h(Button, { - type: 'primary', - className: 'send-v2__customize-gas__save', - onClick: () => !error && this.save(newGasPrice, gasLimit, gasTotal), - disabled: error, - }, [this.context.t('save')]), - ]), - - ]), - - ]), - ]) -} |