diff options
5 files changed, 82 insertions, 4 deletions
diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index f6cf7cf69..c48c5cc6d 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -128,6 +128,9 @@ "cancellationGasFee": { "message": "Cancellation Gas Fee" }, + "cancelN": { + "message": "Cancel all $1 transactions" + }, "classicInterface": { "message": "Use classic interface" }, diff --git a/ui/app/actions.js b/ui/app/actions.js index 3afdfaadc..fe293a6a0 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -167,6 +167,7 @@ var actions = { updateTransaction, updateAndApproveTx, cancelTx: cancelTx, + cancelTxs, completedTx: completedTx, txError: txError, nextTx: nextTx, @@ -1300,6 +1301,47 @@ function cancelTx (txData) { } } +/** + * Cancels all of the given transactions + * @param {Array<object>} txDataList a list of tx data objects + * @return {function(*): Promise<void>} + */ +function cancelTxs (txDataList) { + return async (dispatch, getState) => { + dispatch(actions.showLoadingIndication()) + const txIds = txDataList.map(({id}) => id) + const cancellations = txIds.map((id) => new Promise((resolve, reject) => { + background.cancelTransaction(id, (err) => { + if (err) { + return reject(err) + } + + resolve() + }) + })) + + await Promise.all(cancellations) + const newState = await updateMetamaskStateFromBackground() + dispatch(actions.updateMetamaskState(newState)) + dispatch(actions.clearSend()) + + txIds.forEach((id) => { + dispatch(actions.completedTx(id)) + }) + + dispatch(actions.hideLoadingIndication()) + + if (global.METAMASK_UI_TYPE === ENVIRONMENT_TYPE_NOTIFICATION) { + return global.platform.closeCurrentWindow() + } + } +} + +/** + * @deprecated + * @param {Array<object>} txsData + * @return {Function} + */ function cancelAllTx (txsData) { return (dispatch) => { txsData.forEach((txData, i) => { diff --git a/ui/app/components/confirm-page-container/confirm-page-container.component.js b/ui/app/components/confirm-page-container/confirm-page-container.component.js index b1582051e..00100b5af 100644 --- a/ui/app/components/confirm-page-container/confirm-page-container.component.js +++ b/ui/app/components/confirm-page-container/confirm-page-container.component.js @@ -41,7 +41,9 @@ export default class ConfirmPageContainer extends Component { assetImage: PropTypes.string, summaryComponent: PropTypes.node, warning: PropTypes.string, + unapprovedTxCount: PropTypes.number, // Footer + onCancelAll: PropTypes.func, onCancel: PropTypes.func, onSubmit: PropTypes.func, disabled: PropTypes.bool, @@ -67,10 +69,12 @@ export default class ConfirmPageContainer extends Component { summaryComponent, detailsComponent, dataComponent, + onCancelAll, onCancel, onSubmit, identiconAddress, nonce, + unapprovedTxCount, assetImage, warning, } = this.props @@ -116,7 +120,13 @@ export default class ConfirmPageContainer extends Component { submitText={this.context.t('confirm')} submitButtonType="confirm" disabled={disabled} - /> + > + {unapprovedTxCount > 1 && ( + <a onClick={() => onCancelAll()}> + {this.context.t('cancelN', [unapprovedTxCount])} + </a> + )} + </PageContainerFooter> </div> ) } diff --git a/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js b/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js index 40d8faf50..7de147d79 100644 --- a/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js +++ b/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js @@ -22,6 +22,7 @@ export default class ConfirmTransactionBase extends Component { // Redux props balance: PropTypes.string, cancelTransaction: PropTypes.func, + cancelAllTransactions: PropTypes.func, clearConfirmTransaction: PropTypes.func, clearSend: PropTypes.func, conversionRate: PropTypes.number, @@ -49,6 +50,7 @@ export default class ConfirmTransactionBase extends Component { toName: PropTypes.string, transactionStatus: PropTypes.string, txData: PropTypes.object, + unapprovedTxCount: PropTypes.number, // Component props action: PropTypes.string, contentComponent: PropTypes.node, @@ -249,6 +251,16 @@ export default class ConfirmTransactionBase extends Component { onEdit({ txData, tokenData, tokenProps }) } + handleCancelAll () { + const { cancelAllTransactions, history, clearConfirmTransaction } = this.props + + cancelAllTransactions() + .then(() => { + clearConfirmTransaction() + history.push(DEFAULT_ROUTE) + }) + } + handleCancel () { const { onCancel, txData, cancelTransaction, history, clearConfirmTransaction } = this.props @@ -314,6 +326,7 @@ export default class ConfirmTransactionBase extends Component { nonce, assetImage, warning, + unapprovedTxCount, } = this.props const { submitting, submitError } = this.state @@ -337,6 +350,7 @@ export default class ConfirmTransactionBase extends Component { dataComponent={this.renderData()} contentComponent={contentComponent} nonce={nonce} + unapprovedTxCount={unapprovedTxCount} assetImage={assetImage} identiconAddress={identiconAddress} errorMessage={errorMessage || submitError} @@ -344,6 +358,7 @@ export default class ConfirmTransactionBase extends Component { warning={warning} disabled={!propsValid || !valid || submitting} onEdit={() => this.handleEdit()} + onCancelAll={() => this.handleCancelAll()} onCancel={() => this.handleCancel()} onSubmit={() => this.handleSubmit()} /> diff --git a/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js b/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js index ae31eba17..5fbd127c3 100644 --- a/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js +++ b/ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.container.js @@ -8,7 +8,7 @@ import { clearConfirmTransaction, updateGasAndCalculate, } from '../../../ducks/confirm-transaction.duck' -import { clearSend, cancelTx, updateAndApproveTx, showModal } from '../../../actions' +import { clearSend, cancelTx, cancelTxs, updateAndApproveTx, showModal } from '../../../actions' import { INSUFFICIENT_FUNDS_ERROR_KEY, GAS_LIMIT_TOO_LOW_ERROR_KEY, @@ -17,7 +17,7 @@ import { getHexGasTotal } from '../../../helpers/confirm-transaction/util' import { isBalanceSufficient } from '../../send/send.utils' import { conversionGreaterThan } from '../../../conversion-util' import { MIN_GAS_LIMIT_DEC } from '../../send/send.constants' -import { addressSlicer } from '../../../util' +import { addressSlicer, valuesFor } from '../../../util' const casedContractMap = Object.keys(contractMap).reduce((acc, base) => { return { @@ -53,6 +53,7 @@ const mapStateToProps = (state, props) => { selectedAddress, selectedAddressTxList, assetImages, + unapprovedTxs, } = metamask const assetImage = assetImages[txParamsToAddress] const { balance } = accounts[selectedAddress] @@ -67,6 +68,8 @@ const mapStateToProps = (state, props) => { const transaction = R.find(({ id }) => id === transactionId)(selectedAddressTxList) const transactionStatus = transaction ? transaction.status : '' + const unapprovedTxCount = valuesFor(unapprovedTxs).length + return { balance, fromAddress, @@ -90,6 +93,8 @@ const mapStateToProps = (state, props) => { transactionStatus, nonce, assetImage, + unapprovedTxs, + unapprovedTxCount, } } @@ -107,6 +112,7 @@ const mapDispatchToProps = dispatch => { return dispatch(updateGasAndCalculate({ gasLimit, gasPrice })) }, cancelTransaction: ({ id }) => dispatch(cancelTx({ id })), + cancelAllTransactions: (txList) => dispatch(cancelTxs(txList)), sendTransaction: txData => dispatch(updateAndApproveTx(txData)), } } @@ -156,8 +162,9 @@ const getValidateEditGas = ({ balance, conversionRate, txData }) => { } const mergeProps = (stateProps, dispatchProps, ownProps) => { - const { balance, conversionRate, txData } = stateProps + const { balance, conversionRate, txData, unapprovedTxs } = stateProps const { + cancelAllTransactions: dispatchCancelAllTransactions, showCustomizeGasModal: dispatchShowCustomizeGasModal, updateGasAndCalculate: dispatchUpdateGasAndCalculate, ...otherDispatchProps @@ -174,6 +181,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => { onSubmit: txData => dispatchUpdateGasAndCalculate(txData), validate: validateEditGas, }), + cancelAllTransactions: () => dispatchCancelAllTransactions(valuesFor(unapprovedTxs)), } } |