From 6cee76b3e797dd302c1bf97d7799567a366b2004 Mon Sep 17 00:00:00 2001 From: Dan Date: Thu, 8 Mar 2018 16:12:25 -0330 Subject: Add html and css for responsive retry button. --- ui/app/components/tx-list-item.js | 9 +++++ ui/app/css/itcss/components/transaction-list.scss | 47 +++++++++++++++++++++++ ui/app/css/itcss/settings/variables.scss | 1 + 3 files changed, 57 insertions(+) (limited to 'ui') diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index 1a13070c8..574d10e14 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -240,6 +240,15 @@ TxListItem.prototype.render = function () { ]), ]), + + h('div.tx-list-item-retry-container', [ + + h('span.tx-list-item-retry-copy', 'Taking too long?'), + + h('span.tx-list-item-retry-link', 'Increase the gas on your transaction'), + + ]), + ]), // holding on icon from design ]) } diff --git a/ui/app/css/itcss/components/transaction-list.scss b/ui/app/css/itcss/components/transaction-list.scss index c3df493df..4545897e3 100644 --- a/ui/app/css/itcss/components/transaction-list.scss +++ b/ui/app/css/itcss/components/transaction-list.scss @@ -126,6 +126,53 @@ } } +.tx-list-item-retry-container { + background: #d1edff; + width: 100%; + border-radius: 4px; + font-size: 0.8em; + display: flex; + justify-content: center; + margin-left: 44px; + width: calc(100% - 44px); + + @media screen and (min-width: 576px) and (max-width: 679px) { + flex-flow: column; + align-items: center; + } + + @media screen and (min-width: 380px) and (max-width: 575px) { + flex-flow: row; + } + + @media screen and (max-width: 379px) { + flex-flow: column; + align-items: center; + } +} + +.tx-list-item-retry-copy { + font-family: Roboto; +} + +.tx-list-item-retry-link { + text-decoration: underline; + margin-left: 6px; + cursor: pointer; + + @media screen and (min-width: 576px) and (max-width: 679px) { + margin-left: 0px; + } + + @media screen and (min-width: 380px) and (max-width: 575px) { + margin-left: 6px; + } + + @media screen and (max-width: 379px) { + margin-left: 0px; + } +} + .tx-list-date { color: $dusty-gray; font-size: 12px; diff --git a/ui/app/css/itcss/settings/variables.scss b/ui/app/css/itcss/settings/variables.scss index 4c0972527..1b5f1a491 100644 --- a/ui/app/css/itcss/settings/variables.scss +++ b/ui/app/css/itcss/settings/variables.scss @@ -46,6 +46,7 @@ $manatee: #93949d; $spindle: #c7ddec; $mid-gray: #5b5d67; $cape-cod: #38393a; +$onahau: #d1edff; /* Z-Indicies -- cgit v1.2.3 From 5433d2fe3a3f48948449258b03ae431fe81b8cf2 Mon Sep 17 00:00:00 2001 From: Dan Date: Fri, 9 Mar 2018 00:19:26 -0330 Subject: Retry transaction logic added to tx-list-item, confirm-send-ether, customize-gas-modal, and dependents. --- ui/app/actions.js | 4 +- ui/app/components/customize-gas-modal/index.js | 18 ++++++++- ui/app/components/pending-tx/confirm-send-ether.js | 20 ++++++++- ui/app/components/tx-list-item.js | 47 ++++++++++++++++++---- ui/app/components/tx-list.js | 13 +++--- ui/app/conversion-util.js | 13 ++++++ ui/app/reducers/metamask.js | 4 ++ ui/app/selectors.js | 5 +++ ui/app/send-v2.js | 5 +++ 9 files changed, 113 insertions(+), 16 deletions(-) (limited to 'ui') diff --git a/ui/app/actions.js b/ui/app/actions.js index 4f902a6a2..3e050c38c 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -1228,8 +1228,10 @@ function retryTransaction (txId) { if (err) { return dispatch(actions.displayWarning(err.message)) } + const { selectedAddressTxList } = newState + const { id: newTxId } = selectedAddressTxList[selectedAddressTxList.length - 1] dispatch(actions.updateMetamaskState(newState)) - dispatch(actions.viewPendingTx(txId)) + dispatch(actions.viewPendingTx(newTxId)) }) } } diff --git a/ui/app/components/customize-gas-modal/index.js b/ui/app/components/customize-gas-modal/index.js index 826d2cd4b..34a93d6c6 100644 --- a/ui/app/components/customize-gas-modal/index.js +++ b/ui/app/components/customize-gas-modal/index.js @@ -21,12 +21,14 @@ const { conversionUtil, multiplyCurrencies, conversionGreaterThan, + conversionMax, subtractCurrencies, } = require('../../conversion-util') const { getGasPrice, getGasLimit, + getForceGasMin, conversionRateSelector, getSendAmount, getSelectedToken, @@ -44,6 +46,7 @@ function mapStateToProps (state) { return { gasPrice: getGasPrice(state), gasLimit: getGasLimit(state), + forceGasMin: getForceGasMin(state), conversionRate, amount: getSendAmount(state), maxModeOn: getSendMaxModeState(state), @@ -217,7 +220,7 @@ CustomizeGasModal.prototype.convertAndSetGasPrice = function (newGasPrice) { } CustomizeGasModal.prototype.render = function () { - const { hideModal } = this.props + const { hideModal, forceGasMin } = this.props const { gasPrice, gasLimit, gasTotal, error, priceSigZeros, priceSigDec } = this.state let convertedGasPrice = conversionUtil(gasPrice, { @@ -229,6 +232,17 @@ CustomizeGasModal.prototype.render = function () { convertedGasPrice += convertedGasPrice.match(/[.]/) ? priceSigZeros : `${priceSigDec}${priceSigZeros}` + if (forceGasMin) { + const convertedMinPrice = conversionUtil(forceGasMin, { + fromNumericBase: 'hex', + toNumericBase: 'dec', + }) + convertedGasPrice = conversionMax( + { value: convertedMinPrice, fromNumericBase: 'dec' }, + { value: convertedGasPrice, fromNumericBase: 'dec' } + ) + } + const convertedGasLimit = conversionUtil(gasLimit, { fromNumericBase: 'hex', toNumericBase: 'dec', @@ -251,7 +265,7 @@ CustomizeGasModal.prototype.render = function () { h(GasModalCard, { value: convertedGasPrice, - min: MIN_GAS_PRICE_GWEI, + min: forceGasMin || MIN_GAS_PRICE_GWEI, // max: 1000, step: multiplyCurrencies(MIN_GAS_PRICE_GWEI, 10), onChange: value => this.convertAndSetGasPrice(value), diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 3f8d9c28f..a6e00d922 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -36,13 +36,29 @@ function mapDispatchToProps (dispatch) { return { clearSend: () => dispatch(actions.clearSend()), editTransaction: txMeta => { - const { id, txParams } = txMeta + const { id, txParams, lastGasPrice } = txMeta const { gas: gasLimit, gasPrice, to, value: amount, } = txParams + + let forceGasMin + let nonce + if (lastGasPrice) { + const stripped = ethUtil.stripHexPrefix(lastGasPrice) + forceGasMin = ethUtil.addHexPrefix(addCurrencies(stripped, MIN_GAS_PRICE_HEX, { + aBase: 16, + bBase: 16, + toNumericBase: 'hex', + fromDenomination: 'WEI', + toDenomination: 'GWEI', + })) + + nonce = txParams.nonce + } + dispatch(actions.updateSend({ gasLimit, gasPrice, @@ -51,6 +67,8 @@ function mapDispatchToProps (dispatch) { amount, errors: { to: null, amount: null }, editingTransactionId: id, + forceGasMin, + nonce, })) dispatch(actions.showSendPage()) }, diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index 574d10e14..123f723be 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -9,18 +9,26 @@ abiDecoder.addABI(abi) const Identicon = require('./identicon') const contractMap = require('eth-contract-metadata') +const actions = require('../actions') const { conversionUtil, multiplyCurrencies } = require('../conversion-util') const { calcTokenAmount } = require('../token-util') const { getCurrentCurrency } = require('../selectors') -module.exports = connect(mapStateToProps)(TxListItem) +module.exports = connect(mapStateToProps, mapDispatchToProps)(TxListItem) function mapStateToProps (state) { return { tokens: state.metamask.tokens, currentCurrency: getCurrentCurrency(state), tokenExchangeRates: state.metamask.tokenExchangeRates, + selectedAddressTxList: state.metamask.selectedAddressTxList, + } +} + +function mapDispatchToProps (dispatch) { + return { + retryTransaction: transactionId => dispatch(actions.retryTransaction(transactionId)), } } @@ -167,12 +175,32 @@ TxListItem.prototype.getSendTokenTotal = async function () { } } +TxListItem.prototype.showRetryButton = function () { + const { + transactionStatus, + transactionTime, + selectedAddressTxList, + transactionId, + txParams, + } = this.props + const currentNonce = txParams.nonce + const currentNonceTxs = selectedAddressTxList.filter(tx => tx.txParams.nonce === currentNonce) + const isLastWithNonce = currentNonceTxs[currentNonceTxs.length - 1].id === transactionId + + return transactionStatus === 'submitted' && isLastWithNonce && Date.now() - transactionTime > 5000 +} + +TxListItem.prototype.resubmit = function () { + const { transactionId } = this.props + this.props.retryTransaction(transactionId) +} + TxListItem.prototype.render = function () { const { transactionStatus, transactionAmount, onClick, - transActionId, + transactionId, dateString, address, className, @@ -181,8 +209,8 @@ TxListItem.prototype.render = function () { const showFiatTotal = transactionAmount !== '0x0' && fiatTotal return h(`div${className || ''}`, { - key: transActionId, - onClick: () => onClick && onClick(transActionId), + key: transactionId, + onClick: () => onClick && onClick(transactionId), }, [ h(`div.flex-column.tx-list-item-wrapper`, {}, [ @@ -241,12 +269,17 @@ TxListItem.prototype.render = function () { ]), ]), - h('div.tx-list-item-retry-container', [ + this.showRetryButton() && h('div.tx-list-item-retry-container', [ h('span.tx-list-item-retry-copy', 'Taking too long?'), - h('span.tx-list-item-retry-link', 'Increase the gas on your transaction'), - + h('span.tx-list-item-retry-link', { + onClick: (event) => { + event.stopPropagation() + this.resubmit() + }, + }, 'Increase the gas on your transaction'), + ]), ]), // holding on icon from design diff --git a/ui/app/components/tx-list.js b/ui/app/components/tx-list.js index 1729e6a6f..30f816d58 100644 --- a/ui/app/components/tx-list.js +++ b/ui/app/components/tx-list.js @@ -74,9 +74,10 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa address: transaction.txParams.to, transactionStatus: transaction.status, transactionAmount: transaction.txParams.value, - transActionId: transaction.id, + transactionId: transaction.id, transactionHash: transaction.hash, transactionNetworkId: transaction.metamaskNetworkId, + transactionTime: transaction.time, } const { @@ -84,29 +85,31 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa transactionStatus, transactionAmount, dateString, - transActionId, + transactionId, transactionHash, transactionNetworkId, + transactionTime, } = props const { showConfTxPage } = this.props const opts = { - key: transActionId || transactionHash, + key: transactionId || transactionHash, txParams: transaction.txParams, transactionStatus, - transActionId, + transactionId, dateString, address, transactionAmount, transactionHash, conversionRate, tokenInfoGetter: this.tokenInfoGetter, + transactionTime, } const isUnapproved = transactionStatus === 'unapproved' if (isUnapproved) { - opts.onClick = () => showConfTxPage({id: transActionId}) + opts.onClick = () => showConfTxPage({id: transactionId}) opts.transactionStatus = 'Not Started' } else if (transactionHash) { opts.onClick = () => this.view(transactionHash, transactionNetworkId) diff --git a/ui/app/conversion-util.js b/ui/app/conversion-util.js index ee42ebea1..d484ed16d 100644 --- a/ui/app/conversion-util.js +++ b/ui/app/conversion-util.js @@ -187,6 +187,18 @@ const conversionGreaterThan = ( return firstValue.gt(secondValue) } +const conversionMax = ( + { ...firstProps }, + { ...secondProps }, +) => { + const firstIsGreater = conversionGreaterThan( + { ...firstProps }, + { ...secondProps } + ) + + return firstIsGreater ? firstProps.value : secondProps.value +} + const conversionGTE = ( { ...firstProps }, { ...secondProps }, @@ -216,6 +228,7 @@ module.exports = { conversionGreaterThan, conversionGTE, conversionLTE, + conversionMax, toNegative, subtractCurrencies, } diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js index cddcd0c1f..999939b89 100644 --- a/ui/app/reducers/metamask.js +++ b/ui/app/reducers/metamask.js @@ -38,6 +38,8 @@ function reduceMetamask (state, action) { errors: {}, maxModeOn: false, editingTransactionId: null, + forceGasMin: null, + nonce: null, }, coinOptions: {}, useBlockie: false, @@ -298,6 +300,8 @@ function reduceMetamask (state, action) { memo: '', errors: {}, editingTransactionId: null, + forceGasMin: null, + nonce: null, }, }) diff --git a/ui/app/selectors.js b/ui/app/selectors.js index 5d2635775..d37c26f7e 100644 --- a/ui/app/selectors.js +++ b/ui/app/selectors.js @@ -18,6 +18,7 @@ const selectors = { getCurrentAccountWithSendEtherInfo, getGasPrice, getGasLimit, + getForceGasMin, getAddressBook, getSendFrom, getCurrentCurrency, @@ -130,6 +131,10 @@ function getGasLimit (state) { return state.metamask.send.gasLimit } +function getForceGasMin (state) { + return state.metamask.send.forceGasMin +} + function getSendFrom (state) { return state.metamask.send.from } diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js index 1d67150e3..edb6bc41d 100644 --- a/ui/app/send-v2.js +++ b/ui/app/send-v2.js @@ -543,6 +543,7 @@ SendTransactionScreen.prototype.getEditedTx = function () { selectedToken, editingTransactionId, unapprovedTxs, + nonce, } = this.props const editingTx = { @@ -554,6 +555,10 @@ SendTransactionScreen.prototype.getEditedTx = function () { }, } + if (nonce) { + editingTx.txParams.nonce = ethUtil.addHexPrefix(nonce) + } + if (selectedToken) { const data = TOKEN_TRANSFER_FUNCTION_SIGNATURE + Array.prototype.map.call( ethAbi.rawEncode(['address', 'uint256'], [to, ethUtil.addHexPrefix(amount)]), -- cgit v1.2.3 From 2d6b378bf8f8f0b23ef54b48118b61fb6c7deee1 Mon Sep 17 00:00:00 2001 From: Dan Date: Fri, 9 Mar 2018 02:03:36 -0330 Subject: Adds inline opening of gas customization to confirm-send-ether screen. --- ui/app/components/pending-tx/confirm-send-ether.js | 48 ++++++++++++++++++---- ui/app/components/send/gas-fee-display-v2.js | 4 +- ui/app/css/itcss/components/send.scss | 21 ++++++++++ 3 files changed, 63 insertions(+), 10 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index a6e00d922..422b1c6c1 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -9,6 +9,7 @@ const ethUtil = require('ethereumjs-util') const BN = ethUtil.BN const hexToBn = require('../../../../app/scripts/lib/hex-to-bn') const { conversionUtil, addCurrencies } = require('../../conversion-util') +const GasFeeDisplay = require('../send/gas-fee-display-v2') const { MIN_GAS_PRICE_HEX } = require('../send/send-constants') @@ -73,6 +74,18 @@ function mapDispatchToProps (dispatch) { dispatch(actions.showSendPage()) }, cancelTransaction: ({ id }) => dispatch(actions.cancelTx({ id })), + showCustomizeGasModal: (txMeta, sendGasLimit, sendGasPrice, sendGasTotal) => { + const { id, txParams } = txMeta + const { gas: txGasLimit, gasPrice: txGasPrice } = txParams + + dispatch(actions.updateSend({ + gasLimit: sendGasLimit || txGasLimit, + gasPrice: sendGasPrice || txGasPrice, + editingTransactionId: id, + gasTotal: sendGasTotal, + })) + dispatch(actions.showModal({ name: 'CUSTOMIZE_GAS' })) + }, } } @@ -157,6 +170,7 @@ ConfirmSendEther.prototype.getGasFee = function () { return { FIAT, ETH, + gasFeeInHex: txFeeBn.toString(16), } } @@ -164,7 +178,7 @@ ConfirmSendEther.prototype.getData = function () { const { identities } = this.props const txMeta = this.gatherTxMeta() const txParams = txMeta.txParams || {} - const { FIAT: gasFeeInFIAT, ETH: gasFeeInETH } = this.getGasFee() + const { FIAT: gasFeeInFIAT, ETH: gasFeeInETH, gasFeeInHex } = this.getGasFee() const { FIAT: amountInFIAT, ETH: amountInETH } = this.getAmount() const totalInFIAT = addCurrencies(gasFeeInFIAT, amountInFIAT, { @@ -192,11 +206,20 @@ ConfirmSendEther.prototype.getData = function () { amountInETH, totalInFIAT, totalInETH, + gasFeeInHex, } } ConfirmSendEther.prototype.render = function () { - const { editTransaction, currentCurrency, clearSend } = this.props + const { + editTransaction, + currentCurrency, + clearSend, + conversionRate, + currentCurrency: convertedCurrency, + showCustomizeGasModal, + send: { gasTotal, gasLimit: sendGasLimit, gasPrice: sendGasPrice }, + } = this.props const txMeta = this.gatherTxMeta() const txParams = txMeta.txParams || {} @@ -212,11 +235,17 @@ ConfirmSendEther.prototype.render = function () { memo, gasFeeInFIAT, gasFeeInETH, + gasFeeInHex, amountInFIAT, totalInFIAT, totalInETH, } = this.getData() + const title = txMeta.lastGasPrice ? 'Overwrite Transaction' : 'Confirm' + const subtitle = txMeta.lastGasPrice + ? 'Increase your gas fee to attempt to overwrite and speed up your transaction' + : 'Please review your transaction.' + // This is from the latest master // It handles some of the errors that we are not currently handling // Leaving as comments fo reference @@ -235,11 +264,11 @@ ConfirmSendEther.prototype.render = function () { // Main Send token Card h('div.page-container', [ h('div.page-container__header', [ - h('button.confirm-screen-back-button', { + !txMeta.lastGasPrice && h('button.confirm-screen-back-button', { onClick: () => editTransaction(txMeta), }, 'Edit'), - h('div.page-container__title', 'Confirm'), - h('div.page-container__subtitle', `Please review your transaction.`), + h('div.page-container__title', title), + h('div.page-container__subtitle', subtitle), ]), h('div.flex-row.flex-center.confirm-screen-identicons', [ h('div.confirm-screen-account-wrapper', [ @@ -302,9 +331,12 @@ ConfirmSendEther.prototype.render = function () { h('section.flex-row.flex-center.confirm-screen-row', [ h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]), h('div.confirm-screen-section-column', [ - h('div.confirm-screen-row-info', `${gasFeeInFIAT} ${currentCurrency.toUpperCase()}`), - - h('div.confirm-screen-row-detail', `${gasFeeInETH} ETH`), + h(GasFeeDisplay, { + gasTotal: gasTotal || gasFeeInHex, + conversionRate, + convertedCurrency, + onClick: () => showCustomizeGasModal(txMeta, sendGasLimit, sendGasPrice, gasTotal), + }), ]), ]), diff --git a/ui/app/components/send/gas-fee-display-v2.js b/ui/app/components/send/gas-fee-display-v2.js index 0c4c3f7a9..da1bdd05e 100644 --- a/ui/app/components/send/gas-fee-display-v2.js +++ b/ui/app/components/send/gas-fee-display-v2.js @@ -32,11 +32,11 @@ GasFeeDisplay.prototype.render = function () { }) : h('div.currency-display', 'Loading...'), - h('button.send-v2__sliders-icon-container', { + h('button.sliders-icon-container', { onClick, disabled: !gasTotal, }, [ - h('i.fa.fa-sliders.send-v2__sliders-icon'), + h('i.fa.fa-sliders.sliders-icon'), ]), ]) diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss index bb17e53cd..1a058b305 100644 --- a/ui/app/css/itcss/components/send.scss +++ b/ui/app/css/itcss/components/send.scss @@ -660,6 +660,7 @@ &__gas-fee-display { width: 100%; + position: relative; } &__sliders-icon-container { @@ -885,3 +886,23 @@ } } } + +.sliders-icon-container { + display: flex; + align-items: center; + justify-content: center; + height: 24px; + width: 24px; + border: 1px solid $curious-blue; + border-radius: 4px; + background-color: $white; + position: absolute; + right: 15px; + top: 14px; + cursor: pointer; + font-size: 1em; +} + +.sliders-icon { + color: $curious-blue; +} \ No newline at end of file -- cgit v1.2.3 From c1ff927fa0e129a828d3345b21723300d5e73ef1 Mon Sep 17 00:00:00 2001 From: Dan Date: Fri, 9 Mar 2018 10:00:37 -0330 Subject: Lint fixes. --- ui/app/actions.js | 2 +- ui/app/components/pending-tx/confirm-send-ether.js | 2 -- 2 files changed, 1 insertion(+), 3 deletions(-) (limited to 'ui') diff --git a/ui/app/actions.js b/ui/app/actions.js index 200946753..d6f509590 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -1271,7 +1271,7 @@ function retryTransaction (txId) { return dispatch(actions.displayWarning(err.message)) } const { selectedAddressTxList } = newState - const { id: newTxId } = selectedAddressTxList[selectedAddressTxList.length - 1] + const { id: newTxId } = selectedAddressTxList[selectedAddressTxList.length - 1] dispatch(actions.updateMetamaskState(newState)) dispatch(actions.viewPendingTx(newTxId)) }) diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 422b1c6c1..ec61d66b4 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -233,8 +233,6 @@ ConfirmSendEther.prototype.render = function () { name: toName, }, memo, - gasFeeInFIAT, - gasFeeInETH, gasFeeInHex, amountInFIAT, totalInFIAT, -- cgit v1.2.3 From f805a2eb735ea2ae93e91df0d35c6856987fa734 Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 02:31:35 -0230 Subject: Fix gas calculation and nonce / forceGasMin state setting errors; retry button shows on correct tx. --- ui/app/components/customize-gas-modal/index.js | 6 +-- ui/app/components/pending-tx/confirm-send-ether.js | 52 +++++++++++++--------- ui/app/components/tx-list-item.js | 6 ++- 3 files changed, 39 insertions(+), 25 deletions(-) (limited to 'ui') diff --git a/ui/app/components/customize-gas-modal/index.js b/ui/app/components/customize-gas-modal/index.js index 34a93d6c6..2bac57253 100644 --- a/ui/app/components/customize-gas-modal/index.js +++ b/ui/app/components/customize-gas-modal/index.js @@ -117,9 +117,9 @@ CustomizeGasModal.prototype.save = function (gasPrice, gasLimit, gasTotal) { updateSendAmount(maxAmount) } - updateGasPrice(gasPrice) - updateGasLimit(gasLimit) - updateGasTotal(gasTotal) + updateGasPrice(ethUtil.addHexPrefix(gasPrice)) + updateGasLimit(ethUtil.addHexPrefix(gasLimit)) + updateGasTotal(ethUtil.addHexPrefix(gasTotal)) hideModal() } diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index ec61d66b4..b1e3a0374 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -8,7 +8,11 @@ const Identicon = require('../identicon') const ethUtil = require('ethereumjs-util') const BN = ethUtil.BN const hexToBn = require('../../../../app/scripts/lib/hex-to-bn') -const { conversionUtil, addCurrencies } = require('../../conversion-util') +const { + conversionUtil, + addCurrencies, + multiplyCurrencies +} = require('../../conversion-util') const GasFeeDisplay = require('../send/gas-fee-display-v2') const { MIN_GAS_PRICE_HEX } = require('../send/send-constants') @@ -37,7 +41,7 @@ function mapDispatchToProps (dispatch) { return { clearSend: () => dispatch(actions.clearSend()), editTransaction: txMeta => { - const { id, txParams, lastGasPrice } = txMeta + const { id, txParams } = txMeta const { gas: gasLimit, gasPrice, @@ -45,21 +49,6 @@ function mapDispatchToProps (dispatch) { value: amount, } = txParams - let forceGasMin - let nonce - if (lastGasPrice) { - const stripped = ethUtil.stripHexPrefix(lastGasPrice) - forceGasMin = ethUtil.addHexPrefix(addCurrencies(stripped, MIN_GAS_PRICE_HEX, { - aBase: 16, - bBase: 16, - toNumericBase: 'hex', - fromDenomination: 'WEI', - toDenomination: 'GWEI', - })) - - nonce = txParams.nonce - } - dispatch(actions.updateSend({ gasLimit, gasPrice, @@ -68,21 +57,36 @@ function mapDispatchToProps (dispatch) { amount, errors: { to: null, amount: null }, editingTransactionId: id, - forceGasMin, - nonce, })) dispatch(actions.showSendPage()) }, cancelTransaction: ({ id }) => dispatch(actions.cancelTx({ id })), showCustomizeGasModal: (txMeta, sendGasLimit, sendGasPrice, sendGasTotal) => { - const { id, txParams } = txMeta + const { id, txParams, lastGasPrice } = txMeta const { gas: txGasLimit, gasPrice: txGasPrice } = txParams + let forceGasMin + let nonce + if (lastGasPrice) { + const stripped = ethUtil.stripHexPrefix(lastGasPrice) + forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(stripped, 1.1, { + multiplicandBase: 16, + multiplierBase: 10, + toNumericBase: 'hex', + fromDenomination: 'WEI', + toDenomination: 'GWEI', + })) + + nonce = txParams.nonce + } + dispatch(actions.updateSend({ gasLimit: sendGasLimit || txGasLimit, gasPrice: sendGasPrice || txGasPrice, editingTransactionId: id, gasTotal: sendGasTotal, + forceGasMin, + nonce, })) dispatch(actions.showModal({ name: 'CUSTOMIZE_GAS' })) }, @@ -493,6 +497,14 @@ ConfirmSendEther.prototype.gatherTxMeta = function () { const state = this.state const txData = clone(state.txData) || clone(props.txData) + if (txData.lastGasPrice) { + const { gasPrice: sendGasPrice, gas: sendGasLimit } = props.send + const { gasPrice: txGasPrice, gas: txGasLimit } = txData.txParams + + txData.txParams.gasPrice = sendGasPrice || txGasPrice + txData.txParams.gas = sendGasLimit || txGasLimit + } + // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`) return txData } diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index 123f723be..f7d53709f 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -185,9 +185,11 @@ TxListItem.prototype.showRetryButton = function () { } = this.props const currentNonce = txParams.nonce const currentNonceTxs = selectedAddressTxList.filter(tx => tx.txParams.nonce === currentNonce) - const isLastWithNonce = currentNonceTxs[currentNonceTxs.length - 1].id === transactionId + const currentStatusNonceTx = currentNonceTxs.filter(tx => + tx.status !== 'rejected' && tx.status !== 'failed') + const isLastPassingWithNonce = currentStatusNonceTx[currentStatusNonceTx.length - 1].id === transactionId - return transactionStatus === 'submitted' && isLastWithNonce && Date.now() - transactionTime > 5000 + return transactionStatus === 'submitted' && isLastPassingWithNonce && Date.now() - transactionTime > 30000 } TxListItem.prototype.resubmit = function () { -- cgit v1.2.3 From e6d1ce56e7b792957f7b5c3249ecf013752b87ed Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 03:11:45 -0230 Subject: Improve phrasing of copy. --- ui/app/components/pending-tx/confirm-send-ether.js | 2 +- ui/app/components/tx-list-item.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index b1e3a0374..8788a77f8 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -243,7 +243,7 @@ ConfirmSendEther.prototype.render = function () { totalInETH, } = this.getData() - const title = txMeta.lastGasPrice ? 'Overwrite Transaction' : 'Confirm' + const title = txMeta.lastGasPrice ? 'Reprice Transaction' : 'Confirm' const subtitle = txMeta.lastGasPrice ? 'Increase your gas fee to attempt to overwrite and speed up your transaction' : 'Please review your transaction.' diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index f7d53709f..62426252f 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -280,7 +280,7 @@ TxListItem.prototype.render = function () { event.stopPropagation() this.resubmit() }, - }, 'Increase the gas on your transaction'), + }, 'Increase the gas price on your transaction'), ]), -- cgit v1.2.3 From 179066fe6ba3eca002454981c5ef56df7bb142ab Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 03:26:37 -0230 Subject: Set txMeta.time to reflect time of tx approval. --- ui/app/components/pending-tx/confirm-send-ether.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 8788a77f8..899c2617c 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -457,7 +457,7 @@ ConfirmSendEther.prototype.render = function () { ConfirmSendEther.prototype.onSubmit = function (event) { event.preventDefault() - const txMeta = this.gatherTxMeta() + const txMeta = this.gatherTxMeta({ time: (new Date()).getTime() }) const valid = this.checkValidity() this.setState({ valid, submitting: true }) @@ -492,7 +492,7 @@ ConfirmSendEther.prototype.getFormEl = function () { } // After a customizable state value has been updated, -ConfirmSendEther.prototype.gatherTxMeta = function () { +ConfirmSendEther.prototype.gatherTxMeta = function (opts) { const props = this.props const state = this.state const txData = clone(state.txData) || clone(props.txData) @@ -506,7 +506,7 @@ ConfirmSendEther.prototype.gatherTxMeta = function () { } // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`) - return txData + return Object.assign(txData, opts) } ConfirmSendEther.prototype.verifyGasParams = function () { -- cgit v1.2.3 From d6e4d2e80d05f64bb543e524c6288b8b7c33e4c1 Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 21:09:04 -0230 Subject: Use new submittedTime field to correctly show retry button in old and new ui. --- ui/app/components/pending-tx/confirm-send-ether.js | 2 +- ui/app/components/tx-list-item.js | 10 +++++----- ui/app/components/tx-list.js | 6 +++--- 3 files changed, 9 insertions(+), 9 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 899c2617c..8fe58482b 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -11,7 +11,7 @@ const hexToBn = require('../../../../app/scripts/lib/hex-to-bn') const { conversionUtil, addCurrencies, - multiplyCurrencies + multiplyCurrencies, } = require('../../conversion-util') const GasFeeDisplay = require('../send/gas-fee-display-v2') diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index 62426252f..941fcb69c 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -178,18 +178,18 @@ TxListItem.prototype.getSendTokenTotal = async function () { TxListItem.prototype.showRetryButton = function () { const { transactionStatus, - transactionTime, + transactionSubmittedTime, selectedAddressTxList, transactionId, txParams, } = this.props const currentNonce = txParams.nonce const currentNonceTxs = selectedAddressTxList.filter(tx => tx.txParams.nonce === currentNonce) - const currentStatusNonceTx = currentNonceTxs.filter(tx => - tx.status !== 'rejected' && tx.status !== 'failed') - const isLastPassingWithNonce = currentStatusNonceTx[currentStatusNonceTx.length - 1].id === transactionId + const currentNonceSubmittedTxs = currentNonceTxs.filter(tx => transactionStatus === 'submitted') + const isLastSubmittedTxWithCurrentNonce = + currentNonceSubmittedTxs[currentNonceSubmittedTxs.length - 1].id === transactionId - return transactionStatus === 'submitted' && isLastPassingWithNonce && Date.now() - transactionTime > 30000 + return isLastSubmittedTxWithCurrentNonce && Date.now() - transactionSubmittedTime > 30000 } TxListItem.prototype.resubmit = function () { diff --git a/ui/app/components/tx-list.js b/ui/app/components/tx-list.js index 30f816d58..add70a266 100644 --- a/ui/app/components/tx-list.js +++ b/ui/app/components/tx-list.js @@ -77,7 +77,7 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa transactionId: transaction.id, transactionHash: transaction.hash, transactionNetworkId: transaction.metamaskNetworkId, - transactionTime: transaction.time, + transactionSubmittedTime: transaction.transactionSubmittedTime, } const { @@ -88,7 +88,7 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa transactionId, transactionHash, transactionNetworkId, - transactionTime, + transactionSubmittedTime, } = props const { showConfTxPage } = this.props @@ -103,7 +103,7 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa transactionHash, conversionRate, tokenInfoGetter: this.tokenInfoGetter, - transactionTime, + transactionSubmittedTime, } const isUnapproved = transactionStatus === 'unapproved' -- cgit v1.2.3 From e293b6349c522171db26c57e718c5213aa6d5cb3 Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 21:11:50 -0230 Subject: Styling for dropped. --- ui/app/components/tx-list-item.js | 1 + ui/app/css/itcss/components/transaction-list.scss | 4 ++++ 2 files changed, 5 insertions(+) (limited to 'ui') diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index 941fcb69c..d2fc57b13 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -253,6 +253,7 @@ TxListItem.prototype.render = function () { className: classnames('tx-list-status', { 'tx-list-status--rejected': transactionStatus === 'rejected', 'tx-list-status--failed': transactionStatus === 'failed', + 'tx-list-status--dropped': transactionStatus === 'dropped', }), }, transactionStatus, diff --git a/ui/app/css/itcss/components/transaction-list.scss b/ui/app/css/itcss/components/transaction-list.scss index 4545897e3..df7d80e2e 100644 --- a/ui/app/css/itcss/components/transaction-list.scss +++ b/ui/app/css/itcss/components/transaction-list.scss @@ -236,6 +236,10 @@ .tx-list-status--failed { color: $monzo; } + + .tx-list-status--dropped { + opacity: 0.5; + } } .tx-list-item { -- cgit v1.2.3 From 8c7988978f05fa57bba892efb42ae0036ce25771 Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 21:32:22 -0230 Subject: Undefined check in showRetryButton --- ui/app/components/tx-list-item.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) (limited to 'ui') diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index d2fc57b13..453f7e95c 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -186,10 +186,11 @@ TxListItem.prototype.showRetryButton = function () { const currentNonce = txParams.nonce const currentNonceTxs = selectedAddressTxList.filter(tx => tx.txParams.nonce === currentNonce) const currentNonceSubmittedTxs = currentNonceTxs.filter(tx => transactionStatus === 'submitted') - const isLastSubmittedTxWithCurrentNonce = - currentNonceSubmittedTxs[currentNonceSubmittedTxs.length - 1].id === transactionId + const lastSubmittedTxWithCurrentNonce = currentNonceSubmittedTxs[currentNonceSubmittedTxs.length - 1] + const currentTxIsLatestWithNonce = lastSubmittedTxWithCurrentNonce + && lastSubmittedTxWithCurrentNonce.id === transactionId - return isLastSubmittedTxWithCurrentNonce && Date.now() - transactionSubmittedTime > 30000 + return currentTxIsLatestWithNonce && Date.now() - submittedTime > 30000 } TxListItem.prototype.resubmit = function () { -- cgit v1.2.3 From 46ded45b8186c0b338f6cff811cd89c48ef1a5ab Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 21:38:08 -0230 Subject: Use correct var name in new-ui showRetryButton --- ui/app/components/tx-list-item.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui') diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index 453f7e95c..ebf5db19f 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -190,7 +190,7 @@ TxListItem.prototype.showRetryButton = function () { const currentTxIsLatestWithNonce = lastSubmittedTxWithCurrentNonce && lastSubmittedTxWithCurrentNonce.id === transactionId - return currentTxIsLatestWithNonce && Date.now() - submittedTime > 30000 + return currentTxIsLatestWithNonce && Date.now() - transactionSubmittedTime > 30000 } TxListItem.prototype.resubmit = function () { -- cgit v1.2.3 From c52253bb0eb8ab1c7c7e9c0e7002d5ada42d53d6 Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 21:57:23 -0230 Subject: Use correct name for submittedTime field in tx-list.js --- ui/app/components/tx-list.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui') diff --git a/ui/app/components/tx-list.js b/ui/app/components/tx-list.js index add70a266..782de0266 100644 --- a/ui/app/components/tx-list.js +++ b/ui/app/components/tx-list.js @@ -77,7 +77,7 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa transactionId: transaction.id, transactionHash: transaction.hash, transactionNetworkId: transaction.metamaskNetworkId, - transactionSubmittedTime: transaction.transactionSubmittedTime, + transactionSubmittedTime: transaction.submittedTime, } const { -- cgit v1.2.3 From 0d33aed20e3f3eea68e7d0cb41fbfb0d80415000 Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 23:29:47 -0230 Subject: Fix tx-list-item submitted check. --- ui/app/components/tx-list-item.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui') diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index ebf5db19f..b7f7c5ab4 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -185,7 +185,7 @@ TxListItem.prototype.showRetryButton = function () { } = this.props const currentNonce = txParams.nonce const currentNonceTxs = selectedAddressTxList.filter(tx => tx.txParams.nonce === currentNonce) - const currentNonceSubmittedTxs = currentNonceTxs.filter(tx => transactionStatus === 'submitted') + const currentNonceSubmittedTxs = currentNonceTxs.filter(tx => tx.status === 'submitted') const lastSubmittedTxWithCurrentNonce = currentNonceSubmittedTxs[currentNonceSubmittedTxs.length - 1] const currentTxIsLatestWithNonce = lastSubmittedTxWithCurrentNonce && lastSubmittedTxWithCurrentNonce.id === transactionId -- cgit v1.2.3 From e94a14ef8aee8a80a4d21ed8cb1d5b680296eb0b Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 23:44:05 -0230 Subject: Make token confirmations compatible. --- ui/app/components/pending-tx/confirm-send-token.js | 85 +++++++++++++++++++--- ui/app/components/tx-list-item.js | 17 ++++- 2 files changed, 88 insertions(+), 14 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js index e4b0c186a..4ce6a7bc3 100644 --- a/ui/app/components/pending-tx/confirm-send-token.js +++ b/ui/app/components/pending-tx/confirm-send-token.js @@ -8,6 +8,7 @@ abiDecoder.addABI(tokenAbi) const actions = require('../../actions') const clone = require('clone') const Identicon = require('../identicon') +const GasFeeDisplay = require('../send/gas-fee-display-v2.js') const ethUtil = require('ethereumjs-util') const BN = ethUtil.BN const { @@ -88,6 +89,42 @@ function mapDispatchToProps (dispatch, ownProps) { })) dispatch(actions.showSendTokenPage()) }, + showCustomizeGasModal: (txMeta, sendGasLimit, sendGasPrice, sendGasTotal) => { + const { id, txParams, lastGasPrice } = txMeta + const { gas: txGasLimit, gasPrice: txGasPrice } = txParams + const tokenData = txParams.data && abiDecoder.decodeMethod(txParams.data) + const { params = [] } = tokenData + const { value: to } = params[0] || {} + const { value: tokenAmountInDec } = params[1] || {} + const tokenAmountInHex = conversionUtil(tokenAmountInDec, { + fromNumericBase: 'dec', + toNumericBase: 'hex', + }) + + let forceGasMin + let nonce + if (lastGasPrice) { + const stripped = ethUtil.stripHexPrefix(lastGasPrice) + forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(stripped, 1.1, { + multiplicandBase: 16, + multiplierBase: 10, + toNumericBase: 'hex', + fromDenomination: 'WEI', + toDenomination: 'GWEI', + })) + } + + dispatch(actions.updateSend({ + gasLimit: sendGasLimit || txGasLimit, + gasPrice: sendGasPrice || txGasPrice, + editingTransactionId: id, + gasTotal: sendGasTotal, + to, + amount: tokenAmountInHex, + forceGasMin, + })) + dispatch(actions.showModal({ name: 'CUSTOMIZE_GAS' })) + }, } } @@ -187,6 +224,7 @@ ConfirmSendToken.prototype.getGasFee = function () { token: tokenExchangeRate ? tokenGas : null, + gasFeeInHex: gasTotal.toString(16), } } @@ -239,19 +277,31 @@ ConfirmSendToken.prototype.renderHeroAmount = function () { } ConfirmSendToken.prototype.renderGasFee = function () { - const { token: { symbol }, currentCurrency } = this.props - const { fiat: fiatGas, token: tokenGas, eth: ethGas } = this.getGasFee() + const { + token: { symbol }, + currentCurrency: convertedCurrency, + conversionRate, + send: { gasTotal, gasLimit: sendGasLimit, gasPrice: sendGasPrice }, + showCustomizeGasModal, + } = this.props + const txMeta = this.gatherTxMeta() + const { + fiat: fiatGas, + token: tokenGas, + eth: ethGas, + gasFeeInHex + } = this.getGasFee() return ( h('section.flex-row.flex-center.confirm-screen-row', [ h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]), h('div.confirm-screen-section-column', [ - h('div.confirm-screen-row-info', `${fiatGas} ${currentCurrency}`), - - h( - 'div.confirm-screen-row-detail', - tokenGas ? `${tokenGas} ${symbol}` : `${ethGas} ETH` - ), + h(GasFeeDisplay, { + gasTotal: gasTotal || gasFeeInHex, + conversionRate, + convertedCurrency, + onClick: () => showCustomizeGasModal(txMeta, sendGasLimit, sendGasPrice, gasTotal), + }), ]), ]) ) @@ -307,16 +357,21 @@ ConfirmSendToken.prototype.render = function () { this.inputs = [] + const title = txMeta.lastGasPrice ? 'Reprice Transaction' : 'Confirm' + const subtitle = txMeta.lastGasPrice + ? 'Increase your gas fee to attempt to overwrite and speed up your transaction' + : 'Please review your transaction.' + return ( h('div.confirm-screen-container.confirm-send-token', [ // Main Send token Card h('div.page-container', [ h('div.page-container__header', [ - h('button.confirm-screen-back-button', { + !txMeta.lastGasPrice && h('button.confirm-screen-back-button', { onClick: () => editTransaction(txMeta), }, 'Edit'), - h('div.page-container__title', 'Confirm'), - h('div.page-container__subtitle', `Please review your transaction.`), + h('div.page-container__title', title), + h('div.page-container__subtitle', subtitle), ]), h('div.flex-row.flex-center.confirm-screen-identicons', [ h('div.confirm-screen-account-wrapper', [ @@ -438,6 +493,14 @@ ConfirmSendToken.prototype.gatherTxMeta = function () { const state = this.state const txData = clone(state.txData) || clone(props.txData) + if (txData.lastGasPrice) { + const { gasPrice: sendGasPrice, gas: sendGasLimit } = props.send + const { gasPrice: txGasPrice, gas: txGasLimit } = txData.txParams + + txData.txParams.gasPrice = sendGasPrice || txGasPrice + txData.txParams.gas = sendGasLimit || txGasLimit + } + // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`) return txData } diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index b7f7c5ab4..0b826e909 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -28,6 +28,7 @@ function mapStateToProps (state) { function mapDispatchToProps (dispatch) { return { + setSelectedToken: tokenAddress => dispatch(actions.setSelectedToken(tokenAddress)), retryTransaction: transactionId => dispatch(actions.retryTransaction(transactionId)), } } @@ -39,6 +40,7 @@ function TxListItem () { this.state = { total: null, fiatTotal: null, + isTokenTx: null, } } @@ -47,12 +49,13 @@ TxListItem.prototype.componentDidMount = async function () { const decodedData = txParams.data && abiDecoder.decodeMethod(txParams.data) const { name: txDataName } = decodedData || {} + const isTokenTx = txDataName === 'transfer' - const { total, fiatTotal } = txDataName === 'transfer' + const { total, fiatTotal } = isTokenTx ? await this.getSendTokenTotal() : this.getSendEtherTotal() - this.setState({ total, fiatTotal }) + this.setState({ total, fiatTotal, isTokenTx }) } TxListItem.prototype.getAddressText = function () { @@ -193,6 +196,10 @@ TxListItem.prototype.showRetryButton = function () { return currentTxIsLatestWithNonce && Date.now() - transactionSubmittedTime > 30000 } +TxListItem.prototype.setSelectedToken = function (tokenAddress) { + this.props.setSelectedToken(tokenAddress) +} + TxListItem.prototype.resubmit = function () { const { transactionId } = this.props this.props.retryTransaction(transactionId) @@ -207,8 +214,9 @@ TxListItem.prototype.render = function () { dateString, address, className, + txParams, } = this.props - const { total, fiatTotal } = this.state + const { total, fiatTotal, isTokenTx } = this.state const showFiatTotal = transactionAmount !== '0x0' && fiatTotal return h(`div${className || ''}`, { @@ -280,6 +288,9 @@ TxListItem.prototype.render = function () { h('span.tx-list-item-retry-link', { onClick: (event) => { event.stopPropagation() + if (isTokenTx) { + this.setSelectedToken(txParams.to) + } this.resubmit() }, }, 'Increase the gas price on your transaction'), -- cgit v1.2.3 From c37684d7bde00adcb4b2e43db16be91978e2ef12 Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 23:49:10 -0230 Subject: Remove unnecessary addition of nonce to state. --- ui/app/components/pending-tx/confirm-send-ether.js | 3 --- ui/app/reducers/metamask.js | 2 -- ui/app/send-v2.js | 5 ----- 3 files changed, 10 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 8fe58482b..f3f7e86c5 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -76,8 +76,6 @@ function mapDispatchToProps (dispatch) { fromDenomination: 'WEI', toDenomination: 'GWEI', })) - - nonce = txParams.nonce } dispatch(actions.updateSend({ @@ -86,7 +84,6 @@ function mapDispatchToProps (dispatch) { editingTransactionId: id, gasTotal: sendGasTotal, forceGasMin, - nonce, })) dispatch(actions.showModal({ name: 'CUSTOMIZE_GAS' })) }, diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js index b27e7140a..2c93172cc 100644 --- a/ui/app/reducers/metamask.js +++ b/ui/app/reducers/metamask.js @@ -39,7 +39,6 @@ function reduceMetamask (state, action) { maxModeOn: false, editingTransactionId: null, forceGasMin: null, - nonce: null, }, coinOptions: {}, useBlockie: false, @@ -299,7 +298,6 @@ function reduceMetamask (state, action) { errors: {}, editingTransactionId: null, forceGasMin: null, - nonce: null, }, }) diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js index 697dfc517..fc1df1f51 100644 --- a/ui/app/send-v2.js +++ b/ui/app/send-v2.js @@ -548,7 +548,6 @@ SendTransactionScreen.prototype.getEditedTx = function () { selectedToken, editingTransactionId, unapprovedTxs, - nonce, } = this.props const editingTx = { @@ -560,10 +559,6 @@ SendTransactionScreen.prototype.getEditedTx = function () { }, } - if (nonce) { - editingTx.txParams.nonce = ethUtil.addHexPrefix(nonce) - } - if (selectedToken) { const data = TOKEN_TRANSFER_FUNCTION_SIGNATURE + Array.prototype.map.call( ethAbi.rawEncode(['address', 'uint256'], [to, ethUtil.addHexPrefix(amount)]), -- cgit v1.2.3 From cc267d6c818c83b0384b569733d05efef384ac3e Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 13 Mar 2018 23:56:45 -0230 Subject: Fix more lint errors. --- ui/app/components/pending-tx/confirm-send-ether.js | 1 - ui/app/components/pending-tx/confirm-send-token.js | 9 +-------- ui/app/components/tx-list-item.js | 3 +-- 3 files changed, 2 insertions(+), 11 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index f3f7e86c5..4666e047d 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -66,7 +66,6 @@ function mapDispatchToProps (dispatch) { const { gas: txGasLimit, gasPrice: txGasPrice } = txParams let forceGasMin - let nonce if (lastGasPrice) { const stripped = ethUtil.stripHexPrefix(lastGasPrice) forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(stripped, 1.1, { diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js index 4ce6a7bc3..476c1d259 100644 --- a/ui/app/components/pending-tx/confirm-send-token.js +++ b/ui/app/components/pending-tx/confirm-send-token.js @@ -102,7 +102,6 @@ function mapDispatchToProps (dispatch, ownProps) { }) let forceGasMin - let nonce if (lastGasPrice) { const stripped = ethUtil.stripHexPrefix(lastGasPrice) forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(stripped, 1.1, { @@ -278,19 +277,13 @@ ConfirmSendToken.prototype.renderHeroAmount = function () { ConfirmSendToken.prototype.renderGasFee = function () { const { - token: { symbol }, currentCurrency: convertedCurrency, conversionRate, send: { gasTotal, gasLimit: sendGasLimit, gasPrice: sendGasPrice }, showCustomizeGasModal, } = this.props const txMeta = this.gatherTxMeta() - const { - fiat: fiatGas, - token: tokenGas, - eth: ethGas, - gasFeeInHex - } = this.getGasFee() + const { gasFeeInHex } = this.getGasFee() return ( h('section.flex-row.flex-center.confirm-screen-row', [ diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index 0b826e909..4c2b77af9 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -55,7 +55,7 @@ TxListItem.prototype.componentDidMount = async function () { ? await this.getSendTokenTotal() : this.getSendEtherTotal() - this.setState({ total, fiatTotal, isTokenTx }) + this.setState({ total, fiatTotal, isTokenTx }) } TxListItem.prototype.getAddressText = function () { @@ -180,7 +180,6 @@ TxListItem.prototype.getSendTokenTotal = async function () { TxListItem.prototype.showRetryButton = function () { const { - transactionStatus, transactionSubmittedTime, selectedAddressTxList, transactionId, -- cgit v1.2.3 From fb838da7340d460650750cb8ea5fa3fb6fe319de Mon Sep 17 00:00:00 2001 From: Dan Date: Wed, 14 Mar 2018 17:07:09 -0230 Subject: Revert 'Set txMeta.time to reflect time of tx approval.' --- ui/app/components/pending-tx/confirm-send-ether.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 6624a378d..9b9a4e4ea 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -454,7 +454,7 @@ ConfirmSendEther.prototype.render = function () { ConfirmSendEther.prototype.onSubmit = function (event) { event.preventDefault() - const txMeta = this.gatherTxMeta({ time: (new Date()).getTime() }) + const txMeta = this.gatherTxMeta() const valid = this.checkValidity() this.setState({ valid, submitting: true }) @@ -489,7 +489,7 @@ ConfirmSendEther.prototype.getFormEl = function () { } // After a customizable state value has been updated, -ConfirmSendEther.prototype.gatherTxMeta = function (opts) { +ConfirmSendEther.prototype.gatherTxMeta = function () { const props = this.props const state = this.state const txData = clone(state.txData) || clone(props.txData) @@ -503,7 +503,7 @@ ConfirmSendEther.prototype.gatherTxMeta = function (opts) { } // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`) - return Object.assign(txData, opts) + return txData } ConfirmSendEther.prototype.verifyGasParams = function () { -- cgit v1.2.3 From a4c6a5e92e09b70db2e9ab92a8123176de127910 Mon Sep 17 00:00:00 2001 From: Dan Date: Wed, 14 Mar 2018 17:10:59 -0230 Subject: Ensure changes from customize gas modal opened from confirm screen are captured for non-tx transactions. --- ui/app/components/pending-tx/confirm-send-ether.js | 10 ++++------ ui/app/components/pending-tx/confirm-send-token.js | 10 ++++------ 2 files changed, 8 insertions(+), 12 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 9b9a4e4ea..928149ccd 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -494,13 +494,11 @@ ConfirmSendEther.prototype.gatherTxMeta = function () { const state = this.state const txData = clone(state.txData) || clone(props.txData) - if (txData.lastGasPrice) { - const { gasPrice: sendGasPrice, gas: sendGasLimit } = props.send - const { gasPrice: txGasPrice, gas: txGasLimit } = txData.txParams + const { gasPrice: sendGasPrice, gas: sendGasLimit } = props.send + const { gasPrice: txGasPrice, gas: txGasLimit } = txData.txParams - txData.txParams.gasPrice = sendGasPrice || txGasPrice - txData.txParams.gas = sendGasLimit || txGasLimit - } + txData.txParams.gasPrice = sendGasPrice || txGasPrice + txData.txParams.gas = sendGasLimit || txGasLimit // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`) return txData diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js index ac773b1d2..fe323ffd3 100644 --- a/ui/app/components/pending-tx/confirm-send-token.js +++ b/ui/app/components/pending-tx/confirm-send-token.js @@ -487,13 +487,11 @@ ConfirmSendToken.prototype.gatherTxMeta = function () { const state = this.state const txData = clone(state.txData) || clone(props.txData) - if (txData.lastGasPrice) { - const { gasPrice: sendGasPrice, gas: sendGasLimit } = props.send - const { gasPrice: txGasPrice, gas: txGasLimit } = txData.txParams + const { gasPrice: sendGasPrice, gas: sendGasLimit } = props.send + const { gasPrice: txGasPrice, gas: txGasLimit } = txData.txParams - txData.txParams.gasPrice = sendGasPrice || txGasPrice - txData.txParams.gas = sendGasLimit || txGasLimit - } + txData.txParams.gasPrice = sendGasPrice || txGasPrice + txData.txParams.gas = sendGasLimit || txGasLimit // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`) return txData -- cgit v1.2.3 From 66422cd083e86582b44d19664e6c6fc95bdb8ce5 Mon Sep 17 00:00:00 2001 From: Dan Date: Wed, 14 Mar 2018 18:50:18 -0230 Subject: Force gas min has correct precision and is set when editing gas if max. --- ui/app/components/customize-gas-modal/index.js | 7 ++++++- ui/app/components/pending-tx/confirm-send-ether.js | 4 +--- ui/app/components/pending-tx/confirm-send-token.js | 4 +--- 3 files changed, 8 insertions(+), 7 deletions(-) (limited to 'ui') diff --git a/ui/app/components/customize-gas-modal/index.js b/ui/app/components/customize-gas-modal/index.js index 291447bb4..d8384c19d 100644 --- a/ui/app/components/customize-gas-modal/index.js +++ b/ui/app/components/customize-gas-modal/index.js @@ -233,6 +233,7 @@ CustomizeGasModal.prototype.render = function () { convertedGasPrice += convertedGasPrice.match(/[.]/) ? priceSigZeros : `${priceSigDec}${priceSigZeros}` + let newGasPrice = gasPrice if (forceGasMin) { const convertedMinPrice = conversionUtil(forceGasMin, { fromNumericBase: 'hex', @@ -242,6 +243,10 @@ CustomizeGasModal.prototype.render = function () { { value: convertedMinPrice, fromNumericBase: 'dec' }, { value: convertedGasPrice, fromNumericBase: 'dec' } ) + newGasPrice = conversionMax( + { value: gasPrice, fromNumericBase: 'hex' }, + { value: forceGasMin, fromNumericBase: 'hex' } + ) } const convertedGasLimit = conversionUtil(gasLimit, { @@ -302,7 +307,7 @@ CustomizeGasModal.prototype.render = function () { }, [t('cancel')]), h(`div.send-v2__customize-gas__save${error ? '__error' : ''}.allcaps`, { - onClick: () => !error && this.save(gasPrice, gasLimit, gasTotal), + onClick: () => !error && this.save(newGasPrice, gasLimit, gasTotal), }, [t('save')]), ]), diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 928149ccd..dca39f0a5 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -68,13 +68,11 @@ function mapDispatchToProps (dispatch) { let forceGasMin if (lastGasPrice) { - const stripped = ethUtil.stripHexPrefix(lastGasPrice) - forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(stripped, 1.1, { + forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(lastGasPrice, 1.1, { multiplicandBase: 16, multiplierBase: 10, toNumericBase: 'hex', fromDenomination: 'WEI', - toDenomination: 'GWEI', })) } diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js index fe323ffd3..6035dd801 100644 --- a/ui/app/components/pending-tx/confirm-send-token.js +++ b/ui/app/components/pending-tx/confirm-send-token.js @@ -104,13 +104,11 @@ function mapDispatchToProps (dispatch, ownProps) { let forceGasMin if (lastGasPrice) { - const stripped = ethUtil.stripHexPrefix(lastGasPrice) - forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(stripped, 1.1, { + forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(lastGasPrice, 1.1, { multiplicandBase: 16, multiplierBase: 10, toNumericBase: 'hex', fromDenomination: 'WEI', - toDenomination: 'GWEI', })) } -- cgit v1.2.3 From b0122be3c960b68620c5769ca969db60e4a45351 Mon Sep 17 00:00:00 2001 From: Dan Date: Wed, 14 Mar 2018 19:03:14 -0230 Subject: Set retry gasPrice to forceGasMin on confirm screen in cases where gas is not edited. --- ui/app/components/pending-tx/confirm-send-ether.js | 19 +++++++++++++++++-- ui/app/components/pending-tx/confirm-send-token.js | 19 +++++++++++++++++-- 2 files changed, 34 insertions(+), 4 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index dca39f0a5..a4763eab7 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -493,9 +493,24 @@ ConfirmSendEther.prototype.gatherTxMeta = function () { const txData = clone(state.txData) || clone(props.txData) const { gasPrice: sendGasPrice, gas: sendGasLimit } = props.send - const { gasPrice: txGasPrice, gas: txGasLimit } = txData.txParams + const { + lastGasPrice, + txParams: { + gasPrice: txGasPrice, + gas: txGasLimit, + }, + } = txData + + let forceGasMin + if (lastGasPrice) { + forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(lastGasPrice, 1.1, { + multiplicandBase: 16, + multiplierBase: 10, + toNumericBase: 'hex', + })) + } - txData.txParams.gasPrice = sendGasPrice || txGasPrice + txData.txParams.gasPrice = sendGasPrice || forceGasMin || txGasPrice txData.txParams.gas = sendGasLimit || txGasLimit // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`) diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js index 6035dd801..f1142b142 100644 --- a/ui/app/components/pending-tx/confirm-send-token.js +++ b/ui/app/components/pending-tx/confirm-send-token.js @@ -486,9 +486,24 @@ ConfirmSendToken.prototype.gatherTxMeta = function () { const txData = clone(state.txData) || clone(props.txData) const { gasPrice: sendGasPrice, gas: sendGasLimit } = props.send - const { gasPrice: txGasPrice, gas: txGasLimit } = txData.txParams + const { + lastGasPrice, + txParams: { + gasPrice: txGasPrice, + gas: txGasLimit, + }, + } = txData + + let forceGasMin + if (lastGasPrice) { + forceGasMin = ethUtil.addHexPrefix(multiplyCurrencies(lastGasPrice, 1.1, { + multiplicandBase: 16, + multiplierBase: 10, + toNumericBase: 'hex', + })) + } - txData.txParams.gasPrice = sendGasPrice || txGasPrice + txData.txParams.gasPrice = sendGasPrice || forceGasMin || txGasPrice txData.txParams.gas = sendGasLimit || txGasLimit // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`) -- cgit v1.2.3 From faa4ffe1636ce9f7cc68bffe1eb7b1e685a2d000 Mon Sep 17 00:00:00 2001 From: frankiebee Date: Mon, 19 Mar 2018 14:32:58 -0700 Subject: new-ui - dont exclude `txParams.data` when editing and updating txParams --- ui/app/send-v2.js | 2 ++ 1 file changed, 2 insertions(+) (limited to 'ui') diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js index fc1df1f51..491c4dda3 100644 --- a/ui/app/send-v2.js +++ b/ui/app/send-v2.js @@ -571,9 +571,11 @@ SendTransactionScreen.prototype.getEditedTx = function () { data, }) } else { + const data = unapprovedTxs[editingTransactionId].txParams.data Object.assign(editingTx.txParams, { value: ethUtil.addHexPrefix(amount), to: ethUtil.addHexPrefix(to), + data, }) } -- cgit v1.2.3 From 5cdaf270f798218bddc72bde05d8ab77267cfb94 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Tue, 20 Mar 2018 06:47:45 -0230 Subject: Don't block user from setting gas if estimating gas returns errors. (#3627) --- ui/app/components/send/gas-fee-display-v2.js | 7 +++++-- ui/app/components/send/send-v2-container.js | 1 + ui/app/css/itcss/components/send.scss | 6 ++++++ ui/app/send-v2.js | 7 +++++++ 4 files changed, 19 insertions(+), 2 deletions(-) (limited to 'ui') diff --git a/ui/app/components/send/gas-fee-display-v2.js b/ui/app/components/send/gas-fee-display-v2.js index 0c6f76303..9aaa31b1e 100644 --- a/ui/app/components/send/gas-fee-display-v2.js +++ b/ui/app/components/send/gas-fee-display-v2.js @@ -18,6 +18,7 @@ GasFeeDisplay.prototype.render = function () { onClick, primaryCurrency = 'ETH', convertedCurrency, + gasLoadingError, } = this.props return h('div.send-v2__gas-fee-display', [ @@ -31,11 +32,13 @@ GasFeeDisplay.prototype.render = function () { convertedPrefix: '$', readOnly: true, }) - : h('div.currency-display', t('loading')), + : gasLoadingError + ? h('div..currency-display.currency-display--message', 'Set with the gas price customizer.') + : h('div.currency-display', t('loading')), h('button.send-v2__sliders-icon-container', { onClick, - disabled: !gasTotal, + disabled: !gasTotal && !gasLoadingError, }, [ h('i.fa.fa-sliders.send-v2__sliders-icon'), ]), diff --git a/ui/app/components/send/send-v2-container.js b/ui/app/components/send/send-v2-container.js index 1106902b7..d1319b6dc 100644 --- a/ui/app/components/send/send-v2-container.js +++ b/ui/app/components/send/send-v2-container.js @@ -48,6 +48,7 @@ function mapStateToProps (state) { primaryCurrency, convertedCurrency: getCurrentCurrency(state), data, + selectedAddress, amountConversionRate: selectedToken ? tokenToFiatRate : conversionRate, tokenContract: getSelectedTokenContract(state), unapprovedTxs: state.metamask.unapprovedTxs, diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss index bb17e53cd..89739171d 100644 --- a/ui/app/css/itcss/components/send.scss +++ b/ui/app/css/itcss/components/send.scss @@ -660,6 +660,12 @@ &__gas-fee-display { width: 100%; + + .currency-display--message { + padding: 8px 38px 8px 10px; + display: flex; + align-items: center; + } } &__sliders-icon-container { diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js index fc1df1f51..5ac59fc29 100644 --- a/ui/app/send-v2.js +++ b/ui/app/send-v2.js @@ -42,6 +42,7 @@ function SendTransactionScreen () { to: null, amount: null, }, + gasLoadingError: false, } this.handleToChange = this.handleToChange.bind(this) @@ -128,6 +129,10 @@ SendTransactionScreen.prototype.updateGas = function () { .then(([gasPrice, gas]) => { const newGasTotal = this.getGasTotal(gas, gasPrice) updateGasTotal(newGasTotal) + this.setState({ gasLoadingError: false }) + }) + .catch(err => { + this.setState({ gasLoadingError: true }) }) } else { const newGasTotal = this.getGasTotal(gasLimit, gasPrice) @@ -436,6 +441,7 @@ SendTransactionScreen.prototype.renderGasRow = function () { showCustomizeGasModal, gasTotal, } = this.props + const { gasLoadingError } = this.state return h('div.send-v2__form-row', [ @@ -448,6 +454,7 @@ SendTransactionScreen.prototype.renderGasRow = function () { conversionRate, convertedCurrency, onClick: showCustomizeGasModal, + gasLoadingError, }), ]), -- cgit v1.2.3 From 4af1003b0efa8329718f5a95826976a54194d49b Mon Sep 17 00:00:00 2001 From: Alexander Tseung Date: Tue, 20 Mar 2018 04:32:20 -0700 Subject: Fix Account Names being cropped (#3626) --- ui/app/css/itcss/components/account-menu.scss | 3 --- ui/app/css/itcss/components/network.scss | 3 ++- ui/app/css/itcss/components/newui-sections.scss | 1 - ui/app/css/itcss/components/transaction-list.scss | 4 +++- ui/app/css/itcss/generic/index.scss | 2 +- ui/app/css/itcss/generic/reset.scss | 4 ---- 6 files changed, 6 insertions(+), 11 deletions(-) (limited to 'ui') diff --git a/ui/app/css/itcss/components/account-menu.scss b/ui/app/css/itcss/components/account-menu.scss index 4752741aa..c4037d862 100644 --- a/ui/app/css/itcss/components/account-menu.scss +++ b/ui/app/css/itcss/components/account-menu.scss @@ -87,7 +87,6 @@ flex: 1 0 auto; display: flex; flex-flow: column nowrap; - padding-top: 4px; } &__check-mark { @@ -115,13 +114,11 @@ color: $white; font-size: 18px; font-weight: 300; - line-height: 16px; } &__balance { color: $dusty-gray; font-size: 14px; - line-height: 19px; } &__action { diff --git a/ui/app/css/itcss/components/network.scss b/ui/app/css/itcss/components/network.scss index c32d1de5e..374cb71b6 100644 --- a/ui/app/css/itcss/components/network.scss +++ b/ui/app/css/itcss/components/network.scss @@ -10,8 +10,9 @@ .network-component.pointer { border: 2px solid $silver; border-radius: 82px; - padding: 3px; + padding: 7px 3px; flex: 0 0 auto; + display: flex; &.ethereum-network .menu-icon-circle div { background-color: rgba(3, 135, 137, .7) !important; diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss index 5cdda5e6c..777a82318 100644 --- a/ui/app/css/itcss/components/newui-sections.scss +++ b/ui/app/css/itcss/components/newui-sections.scss @@ -265,7 +265,6 @@ $wallet-view-bg: $alabaster; .account-name { font-size: 24px; font-weight: 300; - line-height: 20px; color: $black; margin-top: 8px; margin-bottom: .9rem; diff --git a/ui/app/css/itcss/components/transaction-list.scss b/ui/app/css/itcss/components/transaction-list.scss index c3df493df..2c28a2a27 100644 --- a/ui/app/css/itcss/components/transaction-list.scss +++ b/ui/app/css/itcss/components/transaction-list.scss @@ -97,7 +97,7 @@ .tx-list-content-wrapper { align-items: stretch; - margin-bottom: 4px; + margin: 4px 0; flex: 1 0 auto; width: 100%; display: flex; @@ -136,6 +136,7 @@ align-self: center; flex: 0 0 auto; margin-right: 16px; + display: flex; } .tx-list-account-and-status-wrapper { @@ -192,6 +193,7 @@ } .tx-list-item { + height: 80px; border-top: 1px solid rgb(231, 231, 231); flex: 0 0 auto; display: flex; diff --git a/ui/app/css/itcss/generic/index.scss b/ui/app/css/itcss/generic/index.scss index 1fbd9896f..1e226b93e 100644 --- a/ui/app/css/itcss/generic/index.scss +++ b/ui/app/css/itcss/generic/index.scss @@ -13,7 +13,6 @@ body { font-family: Roboto, Arial; color: #4d4d4d; font-weight: 300; - line-height: 1.4em; background: #f7f7f7; width: 100%; height: 100%; @@ -103,6 +102,7 @@ input.large-input { &::after { content: '\00D7'; font-size: 40px; + line-height: 20px; } } diff --git a/ui/app/css/itcss/generic/reset.scss b/ui/app/css/itcss/generic/reset.scss index e054d533e..a417a0453 100644 --- a/ui/app/css/itcss/generic/reset.scss +++ b/ui/app/css/itcss/generic/reset.scss @@ -112,10 +112,6 @@ section { display: block; } -body { - line-height: 1; -} - ol, ul { list-style: none; -- cgit v1.2.3