From 5f378d382e008ef577223055c9674c25e2e6bba4 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Wed, 1 Mar 2017 13:01:23 -0800 Subject: Only allow numbers in gas inputs --- ui/app/components/hex-as-decimal-input.js | 1 + 1 file changed, 1 insertion(+) (limited to 'ui/app/components') diff --git a/ui/app/components/hex-as-decimal-input.js b/ui/app/components/hex-as-decimal-input.js index 523c1264b..ecf232640 100644 --- a/ui/app/components/hex-as-decimal-input.js +++ b/ui/app/components/hex-as-decimal-input.js @@ -44,6 +44,7 @@ HexAsDecimalInput.prototype.render = function () { textAlign: 'right', backgroundColor: 'transparent', border: '1px solid #bdbdbd', + type: 'number', }, style), value: decimalValue, onChange: (event) => { -- cgit v1.2.3 From 0ac1f749fd68244682d0f2c763028cdf6aa29486 Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Wed, 1 Mar 2017 14:37:51 -0800 Subject: Various improvements to gas input. --- ui/app/components/hex-as-decimal-input.js | 15 ++++++++++----- ui/app/components/pending-tx-details.js | 18 ++++-------------- ui/app/components/pending-tx.js | 16 ++++++++-------- 3 files changed, 22 insertions(+), 27 deletions(-) (limited to 'ui/app/components') diff --git a/ui/app/components/hex-as-decimal-input.js b/ui/app/components/hex-as-decimal-input.js index ecf232640..c89ed0416 100644 --- a/ui/app/components/hex-as-decimal-input.js +++ b/ui/app/components/hex-as-decimal-input.js @@ -39,16 +39,17 @@ HexAsDecimalInput.prototype.render = function () { }, }, [ h('input.ether-balance.ether-balance-amount', { + type: 'number', style: extend({ display: 'block', textAlign: 'right', backgroundColor: 'transparent', border: '1px solid #bdbdbd', - type: 'number', + }, style), value: decimalValue, onChange: (event) => { - const hexString = hexify(event.target.value) + const hexString = (event.target.value === '') ? '' : hexify(event.target.value) onChange(hexString) }, }), @@ -71,7 +72,11 @@ function hexify (decimalString) { } function decimalize (input, toEth) { - const strippedInput = ethUtil.stripHexPrefix(input) - const inputBN = new BN(strippedInput, 'hex') - return inputBN.toString(10) + if (input === '') { + return '' + } else { + const strippedInput = ethUtil.stripHexPrefix(input) + const inputBN = new BN(strippedInput, 'hex') + return inputBN.toString(10) + } } diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js index b1ab9576b..fc8d65454 100644 --- a/ui/app/components/pending-tx-details.js +++ b/ui/app/components/pending-tx-details.js @@ -32,10 +32,8 @@ PTXP.render = function () { var account = props.accounts[address] var balance = account ? account.balance : '0x0' - const gas = state.gas || txParams.gas - const gasPrice = state.gasPrice || txData.gasPrice - const gasDefault = txParams.gas - const gasPriceDefault = txData.gasPrice + const gas = (state.gas === undefined) ? txParams.gas : state.gas + const gasPrice = (state.gasPrice === undefined) ? txData.gasPrice : state.gasPrice var txFee = state.txFee || txData.txFee || '' var maxCost = state.maxCost || txData.maxCost || '' @@ -131,11 +129,7 @@ PTXP.render = function () { }, onChange: (newHex) => { log.info(`Gas limit changed to ${newHex}`) - if (newHex === '0x0') { - this.setState({gas: gasDefault}) - } else { - this.setState({ gas: newHex }) - } + this.setState({ gas: newHex }) }, }), ]), @@ -155,11 +149,7 @@ PTXP.render = function () { }, onChange: (newHex) => { log.info(`Gas price changed to: ${newHex}`) - if (newHex === '0x0') { - this.setState({gasPrice: gasPriceDefault}) - } else { - this.setState({ gasPrice: newHex }) - } + this.setState({ gasPrice: newHex }) }, }), ]), diff --git a/ui/app/components/pending-tx.js b/ui/app/components/pending-tx.js index d39cbc0f8..ed366aa45 100644 --- a/ui/app/components/pending-tx.js +++ b/ui/app/components/pending-tx.js @@ -60,12 +60,18 @@ PendingTx.prototype.render = function () { }, [ props.insufficientBalance ? - h('button.btn-green', { + h('button', { onClick: props.buyEth, }, 'Buy Ether') : null, - h('button.confirm', { + h('button', { + onClick: () => { + this.refs.details.resetGasFields() + }, + }, 'Reset'), + + h('button.confirm.btn-green', { disabled: props.insufficientBalance, onClick: props.sendTransaction, }, 'Accept'), @@ -73,12 +79,6 @@ PendingTx.prototype.render = function () { h('button.cancel.btn-red', { onClick: props.cancelTransaction, }, 'Reject'), - - h('button', { - onClick: () => { - this.refs.details.resetGasFields() - }, - }, 'Reset'), ]), ]) ) -- cgit v1.2.3 From 72932bdcba10bd9d47724f271d0c14f84d12b759 Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Wed, 1 Mar 2017 17:03:55 -0800 Subject: Prevent submission of invalid gas parameters. --- ui/app/components/pending-tx-details.js | 11 ++++++++++- ui/app/components/pending-tx.js | 18 ++++++++++++++++-- 2 files changed, 26 insertions(+), 3 deletions(-) (limited to 'ui/app/components') diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js index fc8d65454..e92ce575f 100644 --- a/ui/app/components/pending-tx-details.js +++ b/ui/app/components/pending-tx-details.js @@ -306,7 +306,6 @@ PTXP.gatherParams = function () { const state = this.state || {} const txData = state.txData || props.txData const txParams = txData.txParams - const gas = state.gas || txParams.gas const gasPrice = state.gasPrice || txParams.gasPrice const resultTx = extend(txParams, { @@ -320,6 +319,16 @@ PTXP.gatherParams = function () { return resultTxMeta } +PTXP.verifyGasParams = function () { + // We call this in case the gas has not been modified at all + if (!this.state) { return true } + return this._notZeroOrEmptyString(this.state.gas) && this._notZeroOrEmptyString(this.state.gasPrice) +} + +PTXP._notZeroOrEmptyString = function (obj) { + return obj !== '' && obj !== '0x0' +} + function forwardCarrat () { return ( diff --git a/ui/app/components/pending-tx.js b/ui/app/components/pending-tx.js index ed366aa45..2ab6f25a9 100644 --- a/ui/app/components/pending-tx.js +++ b/ui/app/components/pending-tx.js @@ -1,10 +1,18 @@ const Component = require('react').Component +const connect = require('react-redux').connect const h = require('react-hyperscript') const inherits = require('util').inherits const PendingTxDetails = require('./pending-tx-details') const extend = require('xtend') +const actions = require('../actions') -module.exports = PendingTx +module.exports = connect(mapStateToProps)(PendingTx) + +function mapStateToProps (state) { + return { + + } +} inherits(PendingTx, Component) function PendingTx () { @@ -73,7 +81,13 @@ PendingTx.prototype.render = function () { h('button.confirm.btn-green', { disabled: props.insufficientBalance, - onClick: props.sendTransaction, + onClick: (txData, event) => { + if (this.refs.details.verifyGasParams()) { + props.sendTransaction(txData, event) + } else { + this.props.dispatch(actions.displayWarning('Invalid Gas Parameters')) + } + }, }, 'Accept'), h('button.cancel.btn-red', { -- cgit v1.2.3