From 284dd85a99f538b77fd477f4952117d1792f64a5 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 6 Apr 2018 19:59:51 -0230
Subject: first commit

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

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

diff --git a/ui/app/components/page-container/page-container.component.js b/ui/app/components/page-container/page-container.component.js
new file mode 100644
index 000000000..7df1d48d8
--- /dev/null
+++ b/ui/app/components/page-container/page-container.component.js
@@ -0,0 +1,18 @@
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
+
+export default class PageContainer extends Component {
+
+  static propTypes = {
+    children: PropTypes.node.isRequired,
+  };
+
+  render () {
+    return (
+      <div className="page-container">
+        {this.props.children}
+      </div>
+    );
+  }
+
+}
-- 
cgit v1.2.3


From f96c13d616e429447ac0a6a24c6aeee902162b88 Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Tue, 10 Apr 2018 15:28:52 -0700
Subject: Refactor page-container component structure

---
 .../page-container/page-container.component.js     | 60 ++++++++++++++++++++--
 1 file changed, 57 insertions(+), 3 deletions(-)

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

diff --git a/ui/app/components/page-container/page-container.component.js b/ui/app/components/page-container/page-container.component.js
index 7df1d48d8..9bfb99ade 100644
--- a/ui/app/components/page-container/page-container.component.js
+++ b/ui/app/components/page-container/page-container.component.js
@@ -1,18 +1,72 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 
+import PageContainerHeader from './page-container-header'
+import PageContainerFooter from './page-container-footer'
+
 export default class PageContainer extends Component {
 
   static propTypes = {
-    children: PropTypes.node.isRequired,
+    // PageContainerHeader props
+    title: PropTypes.string.isRequired,
+    subtitle: PropTypes.string,
+    onClose: PropTypes.func,
+    showBackButton: PropTypes.bool,
+    onBackButtonClick: PropTypes.func,
+    backButtonStyles: PropTypes.object,
+    backButtonString: PropTypes.string,
+    // Content props
+    ContentComponent: PropTypes.func,
+    contentComponentProps: PropTypes.object,
+    // PageContainerFooter props
+    onCancel: PropTypes.func,
+    cancelText: PropTypes.string,
+    onSubmit: PropTypes.func,
+    submitText: PropTypes.string,
+    disabled: PropTypes.bool,
   };
 
   render () {
+    const {
+      title,
+      subtitle,
+      onClose,
+      showBackButton,
+      onBackButtonClick,
+      backButtonStyles,
+      backButtonString,
+      ContentComponent,
+      contentComponentProps,
+      onCancel,
+      cancelText,
+      onSubmit,
+      submitText,
+      disabled,
+    } = this.props
+
     return (
       <div className="page-container">
-        {this.props.children}
+        <PageContainerHeader
+          title={title}
+          subtitle={subtitle}
+          onClose={onClose}
+          showBackButton={showBackButton}
+          onBackButtonClick={onBackButtonClick}
+          backButtonStyles={backButtonStyles}
+          backButtonString={backButtonString}
+        />
+        <div className="page-container__content">
+          <ContentComponent { ...contentComponentProps } />
+        </div>
+        <PageContainerFooter
+          onCancel={onCancel}
+          cancelText={cancelText}
+          onSubmit={onSubmit}
+          submitText={submitText}
+          disabled={disabled}
+        />
       </div>
-    );
+    )
   }
 
 }
-- 
cgit v1.2.3