diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 3e469cf44..34575b4dd 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -826,6 +826,9 @@ "transactions": { "message": "transactions" }, + "transactionError": { + "message": "Transaction Error. Exception thrown in contract code." + }, "transactionMemo": { "message": "Transaction memo (optional)" }, diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index eae70b279..d007e6661 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -118,6 +118,11 @@ ConfirmSendEther.prototype.updateComponentSendErrors = function (prevProps) { updateSendErrors, balance, conversionRate, + send: { + errors: { + simulationFails, + }, + }, } = this.props const txMeta = this.gatherTxMeta() @@ -132,6 +137,14 @@ ConfirmSendEther.prototype.updateComponentSendErrors = function (prevProps) { insufficientFunds: balanceIsSufficient ? false : this.context.t('insufficientFunds'), }) } + + const shouldUpdateSimulationSendError = Boolean(txMeta.simulationFails) !== Boolean(simulationFails) + + if (shouldUpdateSimulationSendError) { + updateSendErrors({ + simulationFails: !txMeta.simulationFails ? false : this.context.t('transactionError'), + }) + } } ConfirmSendEther.prototype.componentWillMount = function () { @@ -478,8 +491,10 @@ ConfirmSendEther.prototype.render = function () { ]), h('form#pending-tx-form', { + className: 'confirm-screen-form', onSubmit: this.onSubmit, }, [ + this.renderErrorMessage('simulationFails'), h('.page-container__footer', [ // Cancel Button h('button.btn-cancel.page-container__footer-button.allcaps', { diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js index 814386c5c..19e591fd6 100644 --- a/ui/app/components/pending-tx/confirm-send-token.js +++ b/ui/app/components/pending-tx/confirm-send-token.js @@ -156,6 +156,11 @@ ConfirmSendToken.prototype.updateComponentSendErrors = function (prevProps) { updateSendErrors, balance, conversionRate, + send: { + errors: { + simulationFails, + }, + }, } = this.props const txMeta = this.gatherTxMeta() @@ -170,6 +175,14 @@ ConfirmSendToken.prototype.updateComponentSendErrors = function (prevProps) { insufficientFunds: balanceIsSufficient ? false : this.context.t('insufficientFunds'), }) } + + const shouldUpdateSimulationSendError = Boolean(txMeta.simulationFails) !== Boolean(simulationFails) + + if (shouldUpdateSimulationSendError) { + updateSendErrors({ + simulationFails: !txMeta.simulationFails ? false : this.context.t('transactionError'), + }) + } } ConfirmSendToken.prototype.componentWillMount = function () { @@ -489,8 +502,10 @@ ConfirmSendToken.prototype.render = function () { ]), h('form#pending-tx-form', { + className: 'confirm-screen-form', onSubmit: this.onSubmit, }, [ + this.renderErrorMessage('simulationFails'), h('.page-container__footer', [ // Cancel Button h('button.btn-cancel.page-container__footer-button.allcaps', { diff --git a/ui/app/css/itcss/components/confirm.scss b/ui/app/css/itcss/components/confirm.scss index 85ff14e6e..47762e8de 100644 --- a/ui/app/css/itcss/components/confirm.scss +++ b/ui/app/css/itcss/components/confirm.scss @@ -312,6 +312,17 @@ section .confirm-screen-account-number, } } +.confirm-screen-form { + position: relative; + + .confirm-screen-error { + right: 0; + width: 100%; + margin-top: 7px; + text-align: center; + } +} + .confirm-screen-confirm-button { height: 50px; border-radius: 4px;