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 93e4ae7bf..24ff05353 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 @@ -43,7 +43,7 @@ export default class ConfirmPageContainer extends Component { // Footer onCancel: PropTypes.func, onSubmit: PropTypes.func, - valid: PropTypes.bool, + disabled: PropTypes.bool, } render () { @@ -54,7 +54,7 @@ export default class ConfirmPageContainer extends Component { fromAddress, toName, toAddress, - valid, + disabled, errorKey, errorMessage, contentComponent, @@ -110,7 +110,7 @@ export default class ConfirmPageContainer extends Component { onSubmit={() => onSubmit()} submitText={this.context.t('confirm')} submitButtonType="confirm" - disabled={!valid} + disabled={disabled} /> ) 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 e1bf2210f..b170880b4 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 @@ -71,6 +71,10 @@ export default class ConfirmTransactionBase extends Component { warning: PropTypes.string, } + state = { + submitting: false, + } + componentDidUpdate () { const { transactionStatus, @@ -258,15 +262,25 @@ export default class ConfirmTransactionBase extends Component { handleSubmit () { const { sendTransaction, clearConfirmTransaction, txData, history, onSubmit } = this.props + const { submitting } = this.state + + if (submitting) { + return + } + + this.setState({ submitting: true }) if (onSubmit) { - onSubmit(txData) + Promise.resolve(onSubmit(txData)) + .then(this.setState({ submitting: false })) } else { sendTransaction(txData) .then(() => { clearConfirmTransaction() + this.setState({ submitting: false }) history.push(DEFAULT_ROUTE) }) + .catch(() => this.setState({ submitting: false })) } } @@ -280,7 +294,7 @@ export default class ConfirmTransactionBase extends Component { methodData, ethTransactionAmount, fiatTransactionAmount, - valid: propsValid, + valid: propsValid = true, errorMessage, errorKey: propsErrorKey, currentCurrency, @@ -295,6 +309,7 @@ export default class ConfirmTransactionBase extends Component { nonce, warning, } = this.props + const { submitting } = this.state const { name } = methodData const fiatConvertedAmount = formatCurrency(fiatTransactionAmount, currentCurrency) @@ -320,7 +335,7 @@ export default class ConfirmTransactionBase extends Component { errorMessage={errorMessage} errorKey={propsErrorKey || errorKey} warning={warning} - valid={propsValid || valid} + disabled={!propsValid || !valid || submitting} onEdit={() => this.handleEdit()} onCancel={() => this.handleCancel()} onSubmit={() => this.handleSubmit()}