Switch existing modals from using Notification to Modal. Remove Notification component. Add CancelTransaction modal

1 files changed, 40 insertions, 19 deletions

diff --git a/ui/app/components/modals/transaction-confirmed/transaction-confirmed.component.js b/ui/app/components/modals/transaction-confirmed/transaction-confirmed.component.js
index c1c8a2976..0a98eb1a1 100644
--- a/ui/app/components/modals/transaction-confirmed/transaction-confirmed.component.js
+++ b/ui/app/components/modals/transaction-confirmed/transaction-confirmed.component.js
@@ -1,24 +1,45 @@
-import React from 'react'
+import React, { PureComponent } from 'react'
 import PropTypes from 'prop-types'
+import Modal from '../../modal'
 
-const TransactionConfirmed = (props, context) => {
-  const { t } = context
+export default class TransactionConfirmed extends PureComponent {
+  static contextTypes = {
+    t: PropTypes.func,
+  }
 
-  return (
-    <div className="modal-container__content">
-      <img src="images/check-icon.svg" />
-      <div className="modal-container__title">
-        { `${t('confirmed')}!` }
-      </div>
-      <div className="modal-container__description">
-        { t('initialTransactionConfirmed') }
-      </div>
-    </div>
-  )
-}
+  static propTypes = {
+    onSubmit: PropTypes.func,
+    hideModal: PropTypes.func,
+  }
 
-TransactionConfirmed.contextTypes = {
-  t: PropTypes.func,
-}
+  handleSubmit = () => {
+    const { hideModal, onSubmit } = this.props
+
+    hideModal()
 
-export default TransactionConfirmed
+    if (onSubmit && typeof onSubmit === 'function') {
+      onSubmit()
+    }
+  }
+
+  render () {
+    const { t } = this.context
+
+    return (
+      <Modal
+        onSubmit={this.handleSubmit}
+        submitText={t('ok')}
+      >
+        <div className="transaction-confirmed__content">
+          <img src="images/check-icon.svg" />
+          <div className="transaction-confirmed__title">
+            { `${t('confirmed')}!` }
+          </div>
+          <div className="transaction-confirmed__description">
+            { t('initialTransactionConfirmed') }
+          </div>
+        </div>
+      </Modal>
+    )
+  }
+}