diff options
4 files changed, 20 insertions, 7 deletions
diff --git a/ui/app/actions.js b/ui/app/actions.js index 6bcc64e17..d9214490a 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -1147,6 +1147,10 @@ function updateAndApproveTx (txData) { return txData }) + .catch((err) => { + dispatch(actions.hideLoadingIndication()) + return Promise.reject(err) + }) } } diff --git a/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-error/confirm-page-container-error.component.js b/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-error/confirm-page-container-error.component.js index 70ebdeb20..4965d7b4e 100644 --- a/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-error/confirm-page-container-error.component.js +++ b/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-error/confirm-page-container-error.component.js @@ -11,7 +11,9 @@ const ConfirmPageContainerError = (props, context) => { src="/images/alert-red.svg" className="confirm-page-container-error__icon" /> - { `ALERT: ${error}` } + <div className="confirm-page-container-error__text"> + { `ALERT: ${error}` } + </div> </div> ) } diff --git a/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-error/index.scss b/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-error/index.scss index e99b0f631..89ff25578 100644 --- a/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-error/index.scss +++ b/ui/app/components/confirm-page-container/confirm-page-container-content/confirm-page-container-error/index.scss @@ -1,5 +1,5 @@ .confirm-page-container-error { - height: 32px; + min-height: 32px; border: 1px solid $monzo; color: $monzo; background: lighten($monzo, 56%); @@ -8,10 +8,14 @@ display: flex; justify-content: flex-start; align-items: center; - padding-left: 16px; + padding: 8px 16px; &__icon { margin-right: 8px; flex: 0 0 auto; } + + &__text { + overflow: auto; + } } 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 961aa304e..3216d01c3 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 @@ -73,6 +73,7 @@ export default class ConfirmTransactionBase extends Component { state = { submitting: false, + submitError: null, } componentDidUpdate () { @@ -268,7 +269,7 @@ export default class ConfirmTransactionBase extends Component { return } - this.setState({ submitting: true }) + this.setState({ submitting: true, submitError: null }) if (onSubmit) { Promise.resolve(onSubmit(txData)) @@ -280,7 +281,9 @@ export default class ConfirmTransactionBase extends Component { this.setState({ submitting: false }) history.push(DEFAULT_ROUTE) }) - .catch(() => this.setState({ submitting: false })) + .catch(error => { + this.setState({ submitting: false, submitError: error.message }) + }) } } @@ -309,7 +312,7 @@ export default class ConfirmTransactionBase extends Component { nonce, warning, } = this.props - const { submitting } = this.state + const { submitting, submitError } = this.state const { name } = methodData const fiatConvertedAmount = formatCurrency(fiatTransactionAmount, currentCurrency) @@ -332,7 +335,7 @@ export default class ConfirmTransactionBase extends Component { contentComponent={contentComponent} nonce={nonce} identiconAddress={identiconAddress} - errorMessage={errorMessage} + errorMessage={errorMessage || submitError} errorKey={propsErrorKey || errorKey} warning={warning} disabled={!propsValid || !valid || submitting} |