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

---
 .../cancel-transaction.component.js                | 71 ++++++++++++++++++++++
 1 file changed, 71 insertions(+)
 create mode 100644 ui/app/components/modals/cancel-transaction/cancel-transaction.component.js

(limited to 'ui/app/components/modals/cancel-transaction/cancel-transaction.component.js')

diff --git a/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js b/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js
new file mode 100644
index 000000000..f5f0ea783
--- /dev/null
+++ b/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js
@@ -0,0 +1,71 @@
+import React, { PureComponent } from 'react'
+import PropTypes from 'prop-types'
+import Modal from '../../modal'
+import CancelTransactionGasFee from './cancel-transaction-gas-fee'
+import { SUBMITTED_STATUS } from '../../../constants/transactions'
+import { decimalToHex } from '../../../helpers/conversions.util'
+import { getHexGasTotal } from '../../../helpers/confirm-transaction/util'
+
+export default class CancelTransaction extends PureComponent {
+  static contextTypes = {
+    t: PropTypes.func,
+  }
+
+  static propTypes = {
+    createCancelTransaction: PropTypes.func,
+    hideModal: PropTypes.func,
+    showTransactionConfirmedModal: PropTypes.func,
+    transactionStatus: PropTypes.string,
+    defaultNewGasPrice: PropTypes.string,
+  }
+
+  componentDidUpdate () {
+    const { transactionStatus, showTransactionConfirmedModal } = this.props
+
+    if (transactionStatus !== SUBMITTED_STATUS) {
+      showTransactionConfirmedModal()
+      return
+    }
+  }
+
+  handleSubmit = async () => {
+    const { createCancelTransaction, hideModal } = this.props
+
+    await createCancelTransaction()
+    hideModal()
+  }
+
+  handleCancel = () => {
+    this.props.hideModal()
+  }
+
+  render () {
+    const { t } = this.context
+    const { defaultNewGasPrice: gasPrice } = this.props
+    const newGasFee = getHexGasTotal({ gasPrice, gasLimit: decimalToHex(21000) })
+
+    return (
+      <Modal
+        headerText={t('attemptToCancel')}
+        onSubmit={this.handleSubmit}
+        onCancel={this.handleCancel}
+        submitText={t('yesLetsTry')}
+        cancelText={t('nevermind')}
+        submitType="secondary"
+      >
+        <div>
+          <div className="cancel-transaction__title">
+            { t('cancellationGasFee') }
+          </div>
+          <CancelTransactionGasFee
+            className="cancel-transaction__cancel-transaction-gas-fee-container"
+            value={newGasFee}
+          />
+          <div className="cancel-transaction__description">
+            { t('attemptToCancelDescription') }
+          </div>
+        </div>
+      </Modal>
+    )
+  }
+}
-- 
cgit 


From 2cfdc95eebc3e0a878017090f22e5136cff709a6 Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Wed, 19 Sep 2018 14:30:52 -0700
Subject: Add unit tests

---
 .../modals/cancel-transaction/cancel-transaction.component.js      | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

(limited to 'ui/app/components/modals/cancel-transaction/cancel-transaction.component.js')

diff --git a/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js b/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js
index f5f0ea783..a30fbea96 100644
--- a/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js
+++ b/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js
@@ -57,10 +57,9 @@ export default class CancelTransaction extends PureComponent {
           <div className="cancel-transaction__title">
             { t('cancellationGasFee') }
           </div>
-          <CancelTransactionGasFee
-            className="cancel-transaction__cancel-transaction-gas-fee-container"
-            value={newGasFee}
-          />
+          <div className="cancel-transaction__cancel-transaction-gas-fee-container">
+            <CancelTransactionGasFee value={newGasFee} />
+          </div>
           <div className="cancel-transaction__description">
             { t('attemptToCancelDescription') }
           </div>
-- 
cgit 


From 431beb943675f2e9b7b5e5ce9c7f55d45f10905f Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Thu, 20 Sep 2018 19:35:45 -0700
Subject: Fix multiplyCurrencies. Add onClose prop for Modal component. Remove
 hideModal from modal components.

---
 .../modals/cancel-transaction/cancel-transaction.component.js     | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

(limited to 'ui/app/components/modals/cancel-transaction/cancel-transaction.component.js')

diff --git a/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js b/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js
index a30fbea96..8b00cb9b9 100644
--- a/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js
+++ b/ui/app/components/modals/cancel-transaction/cancel-transaction.component.js
@@ -3,8 +3,6 @@ import PropTypes from 'prop-types'
 import Modal from '../../modal'
 import CancelTransactionGasFee from './cancel-transaction-gas-fee'
 import { SUBMITTED_STATUS } from '../../../constants/transactions'
-import { decimalToHex } from '../../../helpers/conversions.util'
-import { getHexGasTotal } from '../../../helpers/confirm-transaction/util'
 
 export default class CancelTransaction extends PureComponent {
   static contextTypes = {
@@ -16,7 +14,7 @@ export default class CancelTransaction extends PureComponent {
     hideModal: PropTypes.func,
     showTransactionConfirmedModal: PropTypes.func,
     transactionStatus: PropTypes.string,
-    defaultNewGasPrice: PropTypes.string,
+    newGasFee: PropTypes.string,
   }
 
   componentDidUpdate () {
@@ -41,12 +39,12 @@ export default class CancelTransaction extends PureComponent {
 
   render () {
     const { t } = this.context
-    const { defaultNewGasPrice: gasPrice } = this.props
-    const newGasFee = getHexGasTotal({ gasPrice, gasLimit: decimalToHex(21000) })
+    const { newGasFee } = this.props
 
     return (
       <Modal
         headerText={t('attemptToCancel')}
+        onClose={this.handleCancel}
         onSubmit={this.handleSubmit}
         onCancel={this.handleCancel}
         submitText={t('yesLetsTry')}
-- 
cgit