aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--ui/app/actions.js20
-rw-r--r--ui/app/components/customize-gas-modal/index.js84
-rw-r--r--ui/app/components/send/gas-fee-display-v2.js6
-rw-r--r--ui/app/components/send/send-v2-container.js4
-rw-r--r--ui/app/conversion-util.js16
-rw-r--r--ui/app/reducers/metamask.js20
-rw-r--r--ui/app/selectors.js12
-rw-r--r--ui/app/send-v2.js12
8 files changed, 147 insertions, 27 deletions
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 86ef4b4b4..b0ef7d0a3 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -133,6 +133,10 @@ var actions = {
// send screen
estimateGas,
getGasPrice,
+ UPDATE_GAS_LIMIT: 'UPDATE_GAS_LIMIT',
+ UPDATE_GAS_PRICE: 'UPDATE_GAS_PRICE',
+ updateGasLimit,
+ updateGasPrice,
// app messages
confirmSeedWords: confirmSeedWords,
showAccountDetail: showAccountDetail,
@@ -463,12 +467,20 @@ function estimateGas (params = {}) {
return reject(err)
}
dispatch(actions.hideWarning())
+ dispatch(actions.updateGasLimit(data))
return resolve(data)
})
})
}
}
+function updateGasLimit (gasLimit) {
+ return {
+ type: actions.UPDATE_GAS_LIMIT,
+ value: gasLimit,
+ }
+}
+
function getGasPrice () {
return (dispatch) => {
return new Promise((resolve, reject) => {
@@ -478,12 +490,20 @@ function getGasPrice () {
return reject(err)
}
dispatch(actions.hideWarning())
+ dispatch(actions.updateGasPrice(data))
return resolve(data)
})
})
}
}
+function updateGasPrice (gasPrice) {
+ return {
+ type: actions.UPDATE_GAS_PRICE,
+ value: gasPrice,
+ }
+}
+
function sendTx (txData) {
log.info(`actions - sendTx: ${JSON.stringify(txData.txParams)}`)
return (dispatch) => {
diff --git a/ui/app/components/customize-gas-modal/index.js b/ui/app/components/customize-gas-modal/index.js
index 91e2626b4..2df24b4e1 100644
--- a/ui/app/components/customize-gas-modal/index.js
+++ b/ui/app/components/customize-gas-modal/index.js
@@ -5,32 +5,90 @@ const connect = require('react-redux').connect
const actions = require('../../actions')
const GasModalCard = require('./gas-modal-card')
+const { conversionUtil } = require('../../conversion-util')
+
+const {
+ getGasPrice,
+ getGasLimit,
+ conversionRateSelector,
+} = require('../../selectors')
+
function mapStateToProps (state) {
- return {}
+ return {
+ gasPrice: getGasPrice(state),
+ gasLimit: getGasLimit(state),
+ conversionRate: conversionRateSelector(state),
+ }
}
function mapDispatchToProps (dispatch) {
return {
hideModal: () => dispatch(actions.hideModal()),
+ updateGasPrice: newGasPrice => dispatch(actions.updateGasPrice(newGasPrice)),
+ updateGasLimit: newGasLimit => dispatch(actions.updateGasLimit(newGasLimit)),
}
}
inherits(CustomizeGasModal, Component)
-function CustomizeGasModal () {
+function CustomizeGasModal (props) {
Component.call(this)
this.state = {
- gasPrice: '0.23',
- gasLimit: '25000',
+ gasPrice: props.gasPrice,
+ gasLimit: props.gasLimit,
}
}
module.exports = connect(mapStateToProps, mapDispatchToProps)(CustomizeGasModal)
+CustomizeGasModal.prototype.save = function (gasPrice, gasLimit) {
+ const {
+ updateGasPrice,
+ updateGasLimit,
+ hideModal,
+ } = this.props
+
+ updateGasPrice(gasPrice)
+ updateGasLimit(gasLimit)
+ hideModal()
+}
+
+CustomizeGasModal.prototype.convertAndSetGasLimit = function (newGasLimit) {
+ const convertedGasLimit = conversionUtil(newGasLimit, {
+ fromNumericBase: 'dec',
+ toNumericBase: 'hex',
+ })
+
+ this.setState({ gasLimit: convertedGasLimit })
+}
+
+CustomizeGasModal.prototype.convertAndSetGasPrice = function (newGasPrice) {
+ const convertedGasPrice = conversionUtil(newGasPrice, {
+ fromNumericBase: 'dec',
+ toNumericBase: 'hex',
+ fromDenomination: 'GWEI',
+ toDenomination: 'WEI',
+ })
+
+ this.setState({ gasPrice: convertedGasPrice })
+}
+
CustomizeGasModal.prototype.render = function () {
- const { hideModal } = this.props
+ const { hideModal, conversionRate } = this.props
const { gasPrice, gasLimit } = this.state
+ const convertedGasPrice = conversionUtil(gasPrice, {
+ fromNumericBase: 'hex',
+ toNumericBase: 'dec',
+ fromDenomination: 'WEI',
+ toDenomination: 'GWEI',
+ })
+
+ const convertedGasLimit = conversionUtil(gasLimit, {
+ fromNumericBase: 'hex',
+ toNumericBase: 'dec',
+ })
+
return h('div.send-v2__customize-gas', {}, [
h('div', {
}, [
@@ -47,21 +105,21 @@ CustomizeGasModal.prototype.render = function () {
h('div.send-v2__customize-gas__body', {}, [
h(GasModalCard, {
- value: gasPrice,
- min: 0.0,
- max: 5.0,
- step: 0.01,
- onChange: gasPrice => this.setState({ gasPrice }),
+ value: convertedGasPrice,
+ min: 0,
+ max: 1000,
+ step: 1,
+ onChange: value => this.convertAndSetGasPrice(value),
title: 'Gas Price',
copy: 'We calculate the suggested gas prices based on network success rates.',
}),
h(GasModalCard, {
- value: gasLimit,
+ value: convertedGasLimit,
min: 20000,
max: 100000,
step: 1,
- onChange: gasLimit => this.setState({ gasLimit }),
+ onChange: value => this.convertAndSetGasLimit(value),
title: 'Gas Limit',
copy: 'We calculate the suggested gas limit based on network success rates.',
}),
@@ -80,7 +138,7 @@ CustomizeGasModal.prototype.render = function () {
}, ['CANCEL']),
h('div.send-v2__customize-gas__save', {
- onClick: () => console.log('Save'),
+ onClick: () => this.save(gasPrice, gasLimit),
}, ['SAVE']),
])
diff --git a/ui/app/components/send/gas-fee-display-v2.js b/ui/app/components/send/gas-fee-display-v2.js
index 226ae93f8..961d55610 100644
--- a/ui/app/components/send/gas-fee-display-v2.js
+++ b/ui/app/components/send/gas-fee-display-v2.js
@@ -28,7 +28,11 @@ GasFeeDisplay.prototype.render = function () {
? h(CurrencyDisplay, {
primaryCurrency: 'ETH',
convertedCurrency: 'USD',
- value: multiplyCurrencies(gasLimit, gasPrice, { toNumericBase: 'hex' }),
+ value: multiplyCurrencies(gasLimit, gasPrice, {
+ toNumericBase: 'hex',
+ multiplicandBase: 16,
+ multiplierBase: 16,
+ }),
conversionRate,
convertedPrefix: '$',
readOnly: true,
diff --git a/ui/app/components/send/send-v2-container.js b/ui/app/components/send/send-v2-container.js
index 0c8dd5335..c3af1c972 100644
--- a/ui/app/components/send/send-v2-container.js
+++ b/ui/app/components/send/send-v2-container.js
@@ -12,6 +12,8 @@ const {
getSelectedToken,
getSelectedTokenExchangeRate,
getSelectedAddress,
+ getGasPrice,
+ getGasLimit,
} = require('../../selectors')
module.exports = connect(mapStateToProps, mapDispatchToProps)(SendEther)
@@ -49,6 +51,8 @@ function mapStateToProps (state) {
primaryCurrency,
data,
tokenToUSDRate,
+ gasPrice: getGasPrice(state),
+ gasLimit: getGasLimit(state),
}
}
diff --git a/ui/app/conversion-util.js b/ui/app/conversion-util.js
index 3a702bcdd..3a9e9ad0f 100644
--- a/ui/app/conversion-util.js
+++ b/ui/app/conversion-util.js
@@ -32,6 +32,7 @@ BigNumber.config({
// Big Number Constants
const BIG_NUMBER_WEI_MULTIPLIER = new BigNumber('1000000000000000000')
+const BIG_NUMBER_GWEI_MULTIPLIER = new BigNumber('1000000000')
// Individual Setters
const convert = R.invoker(1, 'times')
@@ -45,10 +46,12 @@ const toBigNumber = {
BN: n => new BigNumber(n.toString(16), 16),
}
const toNormalizedDenomination = {
- WEI: bigNumber => bigNumber.div(BIG_NUMBER_WEI_MULTIPLIER)
+ WEI: bigNumber => bigNumber.div(BIG_NUMBER_WEI_MULTIPLIER),
+ GWEI: bigNumber => bigNumber.div(BIG_NUMBER_GWEI_MULTIPLIER),
}
const toSpecifiedDenomination = {
- WEI: bigNumber => bigNumber.times(BIG_NUMBER_WEI_MULTIPLIER).round()
+ WEI: bigNumber => bigNumber.times(BIG_NUMBER_WEI_MULTIPLIER).round(),
+ GWEI: bigNumber => bigNumber.times(BIG_NUMBER_GWEI_MULTIPLIER).round(),
}
const baseChange = {
hex: n => n.toString(16),
@@ -139,8 +142,13 @@ const addCurrencies = (a, b, options = {}) => {
}
const multiplyCurrencies = (a, b, options = {}) => {
- const { toNumericBase, numberOfDecimals } = options
- const value = (new BigNumber(a)).times(b);
+ const {
+ toNumericBase,
+ numberOfDecimals,
+ multiplicandBase,
+ multiplierBase,
+ } = options
+ const value = (new BigNumber(a, multiplicandBase)).times(b, multiplierBase);
return converter({
value,
toNumericBase,
diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js
index a0884b834..cc24a6729 100644
--- a/ui/app/reducers/metamask.js
+++ b/ui/app/reducers/metamask.js
@@ -20,6 +20,10 @@ function reduceMetamask (state, action) {
selectedTokenAddress: null,
tokenExchangeRates: {},
tokens: [],
+ send: {
+ gasLimit: null,
+ gasPrice: null,
+ },
}, state.metamask)
switch (action.type) {
@@ -152,6 +156,22 @@ function reduceMetamask (state, action) {
tokens: action.newTokens,
})
+ case actions.UPDATE_GAS_LIMIT:
+ return extend(metamaskState, {
+ send: {
+ ...metamaskState.send,
+ gasLimit: action.value,
+ },
+ })
+
+ case actions.UPDATE_GAS_PRICE:
+ return extend(metamaskState, {
+ send: {
+ ...metamaskState.send,
+ gasPrice: action.value,
+ },
+ })
+
default:
return metamaskState
diff --git a/ui/app/selectors.js b/ui/app/selectors.js
index 951161510..bf3d3399e 100644
--- a/ui/app/selectors.js
+++ b/ui/app/selectors.js
@@ -10,6 +10,8 @@ const selectors = {
transactionsSelector,
accountsWithSendEtherInfoSelector,
getCurrentAccountWithSendEtherInfo,
+ getGasPrice,
+ getGasLimit,
}
module.exports = selectors
@@ -46,7 +48,7 @@ function getSelectedTokenExchangeRate (state) {
const tokenExchangeRates = state.metamask.tokenExchangeRates
const selectedToken = getSelectedToken(state) || {}
const { symbol = '' } = selectedToken
-
+
const pair = `${symbol.toLowerCase()}_eth`
const { rate: tokenExchangeRate = 0 } = tokenExchangeRates[pair] || {}
@@ -92,3 +94,11 @@ function transactionsSelector (state) {
: txsToRender
.sort((a, b) => b.time - a.time)
}
+
+function getGasPrice (state) {
+ return state.metamask.send.gasPrice
+}
+
+function getGasLimit (state) {
+ return state.metamask.send.gasLimit
+}
diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js
index af7586859..314f6a666 100644
--- a/ui/app/send-v2.js
+++ b/ui/app/send-v2.js
@@ -62,12 +62,6 @@ SendTransactionScreen.prototype.componentWillMount = function () {
gas: '746a528800',
}),
])
- .then(([blockGasPrice, estimatedGas]) => {
- this.setState({
- gasPrice: blockGasPrice,
- gasLimit: estimatedGas,
- })
- })
}
SendTransactionScreen.prototype.renderHeaderIcon = function () {
@@ -112,14 +106,16 @@ SendTransactionScreen.prototype.render = function () {
showCustomizeGasModal,
selectedAccount,
primaryCurrency = 'ETH',
+ gasLimit,
+ gasPrice,
} = this.props
const {
dropdownOpen,
to,
amount,
- gasLimit,
- gasPrice,
+ // gasLimit,
+ // gasPrice,
memo,
} = this.state
generated by cgit v1.2.3 (git 2.25.1) at 2024-09-29 14:36:37 +0800