From ea9d51e427b8e607e612a01629bebf153e516ad9 Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Fri, 22 Jun 2018 23:52:45 -0700
Subject: Refactor and redesign confirm transaction views

---
 .../confirm-page-container.component.js            | 116 +++++++++++++++++++++
 1 file changed, 116 insertions(+)
 create mode 100644 ui/app/components/confirm-page-container/confirm-page-container.component.js

(limited to 'ui/app/components/confirm-page-container/confirm-page-container.component.js')

diff --git a/ui/app/components/confirm-page-container/confirm-page-container.component.js b/ui/app/components/confirm-page-container/confirm-page-container.component.js
new file mode 100644
index 000000000..d5247f83b
--- /dev/null
+++ b/ui/app/components/confirm-page-container/confirm-page-container.component.js
@@ -0,0 +1,116 @@
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
+import SenderToRecipient from '../sender-to-recipient'
+import { PageContainerFooter } from '../page-container'
+import { ConfirmPageContainerHeader, ConfirmPageContainerContent } from './'
+
+export default class ConfirmPageContainer extends Component {
+  static contextTypes = {
+    t: PropTypes.func,
+  }
+
+  static propTypes = {
+    showEdit: PropTypes.bool,
+    onEdit: PropTypes.func,
+    // Sender to Recipient
+    fromName: PropTypes.string,
+    fromAddress: PropTypes.string,
+    toName: PropTypes.string,
+    toAddress: PropTypes.string,
+
+    valid: PropTypes.bool,
+    errorMessage: PropTypes.string,
+    // Header
+    action: PropTypes.string,
+    title: PropTypes.string,
+    titleComponent: PropTypes.func,
+    subtitle: PropTypes.string,
+    hideSubtitle: PropTypes.bool,
+    // Content
+    summaryComponent: PropTypes.node,
+    contentComponent: PropTypes.node,
+    fiatTransactionAmount: PropTypes.string,
+    fiatTransactionFee: PropTypes.string,
+    fiatTransactionTotal: PropTypes.string,
+    ethTransactionAmount: PropTypes.string,
+    ethTransactionFee: PropTypes.string,
+    ethTransactionTotal: PropTypes.string,
+    onEditGas: PropTypes.func,
+    detailsComponent: PropTypes.node,
+    dataComponent: PropTypes.node,
+    identiconAddress: PropTypes.string,
+    nonce: PropTypes.string,
+    warning: PropTypes.string,
+    // Footer
+    onCancel: PropTypes.func,
+    onSubmit: PropTypes.func,
+  }
+
+  render () {
+    const {
+      showEdit,
+      onEdit,
+      fromName,
+      fromAddress,
+      toName,
+      toAddress,
+      valid,
+      errorMessage,
+      contentComponent,
+      action,
+      title,
+      titleComponent,
+      subtitle,
+      hideSubtitle,
+      summaryComponent,
+      detailsComponent,
+      dataComponent,
+      onCancel,
+      onSubmit,
+      identiconAddress,
+      nonce,
+      warning,
+    } = this.props
+
+    return (
+      <div className="page-container">
+        <ConfirmPageContainerHeader
+          showEdit={showEdit}
+          onEdit={() => onEdit()}
+        >
+          <SenderToRecipient
+            senderName={fromName}
+            senderAddress={fromAddress}
+            recipientName={toName}
+            recipientAddress={toAddress}
+          />
+        </ConfirmPageContainerHeader>
+        {
+          contentComponent || (
+            <ConfirmPageContainerContent
+              action={action}
+              title={title}
+              titleComponent={titleComponent}
+              subtitle={subtitle}
+              hideSubtitle={hideSubtitle}
+              summaryComponent={summaryComponent}
+              detailsComponent={detailsComponent}
+              dataComponent={dataComponent}
+              errorMessage={errorMessage}
+              identiconAddress={identiconAddress}
+              nonce={nonce}
+              warning={warning}
+            />
+          )
+        }
+        <PageContainerFooter
+          onCancel={() => onCancel()}
+          onSubmit={() => onSubmit()}
+          submitText={this.context.t('confirm')}
+          submitButtonType="confirm"
+          disabled={!valid}
+        />
+      </div>
+    )
+  }
+}
-- 
cgit 


From a2d9c43fba49680d7553409a4f5013d3febd80e9 Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Fri, 6 Jul 2018 11:58:41 -0700
Subject: Various fixes from PR comments

---
 .../confirm-page-container.component.js            | 30 ++++++++++++----------
 1 file changed, 16 insertions(+), 14 deletions(-)

(limited to 'ui/app/components/confirm-page-container/confirm-page-container.component.js')

diff --git a/ui/app/components/confirm-page-container/confirm-page-container.component.js b/ui/app/components/confirm-page-container/confirm-page-container.component.js
index d5247f83b..93e4ae7bf 100644
--- a/ui/app/components/confirm-page-container/confirm-page-container.component.js
+++ b/ui/app/components/confirm-page-container/confirm-page-container.component.js
@@ -10,25 +10,23 @@ export default class ConfirmPageContainer extends Component {
   }
 
   static propTypes = {
-    showEdit: PropTypes.bool,
-    onEdit: PropTypes.func,
-    // Sender to Recipient
-    fromName: PropTypes.string,
-    fromAddress: PropTypes.string,
-    toName: PropTypes.string,
-    toAddress: PropTypes.string,
-
-    valid: PropTypes.bool,
-    errorMessage: PropTypes.string,
     // Header
     action: PropTypes.string,
+    hideSubtitle: PropTypes.bool,
+    onEdit: PropTypes.func,
+    showEdit: PropTypes.bool,
+    subtitle: PropTypes.string,
     title: PropTypes.string,
     titleComponent: PropTypes.func,
-    subtitle: PropTypes.string,
-    hideSubtitle: PropTypes.bool,
+    // Sender to Recipient
+    fromAddress: PropTypes.string,
+    fromName: PropTypes.string,
+    toAddress: PropTypes.string,
+    toName: PropTypes.string,
     // Content
-    summaryComponent: PropTypes.node,
     contentComponent: PropTypes.node,
+    errorKey: PropTypes.string,
+    errorMessage: PropTypes.string,
     fiatTransactionAmount: PropTypes.string,
     fiatTransactionFee: PropTypes.string,
     fiatTransactionTotal: PropTypes.string,
@@ -36,14 +34,16 @@ export default class ConfirmPageContainer extends Component {
     ethTransactionFee: PropTypes.string,
     ethTransactionTotal: PropTypes.string,
     onEditGas: PropTypes.func,
-    detailsComponent: PropTypes.node,
     dataComponent: PropTypes.node,
+    detailsComponent: PropTypes.node,
     identiconAddress: PropTypes.string,
     nonce: PropTypes.string,
+    summaryComponent: PropTypes.node,
     warning: PropTypes.string,
     // Footer
     onCancel: PropTypes.func,
     onSubmit: PropTypes.func,
+    valid: PropTypes.bool,
   }
 
   render () {
@@ -55,6 +55,7 @@ export default class ConfirmPageContainer extends Component {
       toName,
       toAddress,
       valid,
+      errorKey,
       errorMessage,
       contentComponent,
       action,
@@ -97,6 +98,7 @@ export default class ConfirmPageContainer extends Component {
               detailsComponent={detailsComponent}
               dataComponent={dataComponent}
               errorMessage={errorMessage}
+              errorKey={errorKey}
               identiconAddress={identiconAddress}
               nonce={nonce}
               warning={warning}
-- 
cgit