From 5a6c333506e4000602c1a1106cee6d06fe83afa8 Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Mon, 17 Sep 2018 10:34:29 -0700
Subject: Switch existing modals from using Notification to Modal. Remove
 Notification component. Add CancelTransaction modal

---
 .../transaction-list-item-details.component.js     | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

(limited to 'ui/app/components/transaction-list-item-details/transaction-list-item-details.component.js')

diff --git a/ui/app/components/transaction-list-item-details/transaction-list-item-details.component.js b/ui/app/components/transaction-list-item-details/transaction-list-item-details.component.js
index f65ff4d55..13cb51349 100644
--- a/ui/app/components/transaction-list-item-details/transaction-list-item-details.component.js
+++ b/ui/app/components/transaction-list-item-details/transaction-list-item-details.component.js
@@ -13,7 +13,9 @@ export default class TransactionListItemDetails extends PureComponent {
   }
 
   static propTypes = {
+    onCancel: PropTypes.func,
     onRetry: PropTypes.func,
+    showCancel: PropTypes.bool,
     showRetry: PropTypes.bool,
     transaction: PropTypes.object,
   }
@@ -27,6 +29,13 @@ export default class TransactionListItemDetails extends PureComponent {
     this.setState({ showTransactionDetails: true })
   }
 
+  handleCancel = event => {
+    const { onCancel } = this.props
+
+    event.stopPropagation()
+    onCancel()
+  }
+
   handleRetry = event => {
     const { onRetry } = this.props
 
@@ -36,7 +45,7 @@ export default class TransactionListItemDetails extends PureComponent {
 
   render () {
     const { t } = this.context
-    const { transaction, showRetry } = this.props
+    const { transaction, showCancel, showRetry } = this.props
     const { txParams: { to, from } = {} } = transaction
 
     return (
@@ -55,6 +64,17 @@ export default class TransactionListItemDetails extends PureComponent {
                 </Button>
               )
             }
+            {
+              showCancel && (
+                <Button
+                  type="raised"
+                  onClick={this.handleCancel}
+                  className="transaction-list-item-details__header-button"
+                >
+                  { t('cancel') }
+                </Button>
+              )
+            }
             <Button
               type="raised"
               onClick={this.handleEtherscanClick}
-- 
cgit