From 0ab54fdbcacc6661a56c405f85bb3f5510de8a95 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Thu, 9 Jul 2020 16:23:44 -0400
Subject: [PATCH 01/13] Create add trips modal.

---
 frontend/src/components/AddTrip/index.js   | 46 +++++++++++++++++++++
 frontend/src/components/ViewTrips/index.js | 47 ++++++++++++++++++----
 frontend/src/styles/add-trip.css           | 37 +++++++++++++++++
 3 files changed, 123 insertions(+), 7 deletions(-)
 create mode 100644 frontend/src/components/AddTrip/index.js
 create mode 100644 frontend/src/styles/add-trip.css

diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/AddTrip/index.js
new file mode 100644
index 00000000..1a8a32eb
--- /dev/null
+++ b/frontend/src/components/AddTrip/index.js
@@ -0,0 +1,46 @@
+import React from 'react';
+import Button from 'react-bootstrap/Button';
+
+import '../../styles/add-trip.css'
+
+
+/**
+ * Component corresponding to add trips modal.
+ */
+const AddTrip = (props) => {
+  const showHideClass = props.show ? "modal-container show" :
+                                     "modal-container hide";
+
+  /**
+   * Creates a new Trip document, adds it to Firestore, and closes the modal.
+   */
+  function submitNewTrip() {
+    // TODO(Issue #43): Create doc and add to firestore here
+
+    props.handleClose();
+  }
+
+  return (
+    <div className={showHideClass}>
+      <div className="surrounding-modal" onClick={props.handleClose}></div>
+      <div className="modal-main">
+        {/* TODO(Issue #43): Add trips functionality */}
+        <p>Enter the stuff for a new trip: ...</p>
+        <p>Enter the stuff for a new trip: ...</p>
+        <p>Enter the stuff for a new trip: ...</p>
+        <p>Enter the stuff for a new trip: ...</p>
+        <p>Enter the stuff for a new trip: ...</p>
+        <p>Enter the stuff for a new trip: ...</p>
+        <Button type='button' onClick={submitNewTrip}>
+          Submit New Trip
+        </Button>
+
+        <Button type='button' onClick={props.handleClose}>
+          Close
+        </Button>
+      </div>
+    </div>
+  );
+};
+
+export default AddTrip;
diff --git a/frontend/src/components/ViewTrips/index.js b/frontend/src/components/ViewTrips/index.js
index 02f91136..86e6bb9e 100644
--- a/frontend/src/components/ViewTrips/index.js
+++ b/frontend/src/components/ViewTrips/index.js
@@ -1,6 +1,11 @@
 import React from 'react';
-import app from '../Firebase';
-import TripsContainer from './trips-container.js'
+
+import Button from 'react-bootstrap/Button';
+
+import app from '../Firebase/index.js';
+import Header from '../Header/index.js';
+import AddTrip from '../AddTrip/index.js'
+import TripsContainer from './trips-container.js';
 
 const db = app.firestore();
 
@@ -23,10 +28,38 @@ function getUserEmail() {
  * ViewTrips component that defines the page where a user can view and manage
  * their current trips.
  */
-const ViewTrips = () => {
-  return (
-    <TripsContainer db={db} userEmail={getUserEmail()} />
-  );
-};
+class ViewTrips extends React.Component {
+  /** @inheritdoc */
+  constructor() {
+    super();
+    this.state = { showModal: false };
+  }
+
+  /** Property that sets `showModal` to true --> displays add trip page. */
+  showAddTripModal = () => {
+    this.setState({ showModal: true });
+  }
+
+  /** Property that sets `showModal` to false --> hides add trip page. */
+  hideAddTripModal = () => {
+    this.setState({ showModal: false });
+  }
+
+  /** @inheritdoc */
+  render() {
+    return (
+      <div className="view-trips-page">
+        <Header />
+        <AddTrip show={this.state.showModal} handleClose={this.hideAddTripModal} />
+        <div className="manage-trips-bar">
+          <Button type='button' onClick={this.showAddTripModal}>
+            + New Trip
+          </Button>
+        </div>
+        <TripsContainer db={db} userEmail={getUserEmail()} />
+      </div>
+    );
+  }
+}
 
 export default ViewTrips;
diff --git a/frontend/src/styles/add-trip.css b/frontend/src/styles/add-trip.css
new file mode 100644
index 00000000..07f02375
--- /dev/null
+++ b/frontend/src/styles/add-trip.css
@@ -0,0 +1,37 @@
+.modal-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width:100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.75);
+}
+
+.surrounding-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width:100%;
+  height: 100%;
+}
+
+.modal-main {
+  position:fixed;
+  background: white;
+  width: 80%;
+  height: auto;
+  max-height: 80%;
+  top:50%;
+  left:50%;
+  transform: translate(-50%,-50%);
+  z-index: 1;
+  overflow-y: scroll;
+}
+
+.show {
+  display: block;
+}
+
+.hide {
+  display: none;
+}

From d6cfb91652099ad880409caab6d8ec78e6568a01 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Thu, 9 Jul 2020 18:11:49 -0400
Subject: [PATCH 02/13] Delete duplicate filler text in modal.

---
 frontend/src/components/AddTrip/index.js | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/AddTrip/index.js
index 1a8a32eb..50c24d9d 100644
--- a/frontend/src/components/AddTrip/index.js
+++ b/frontend/src/components/AddTrip/index.js
@@ -26,11 +26,6 @@ const AddTrip = (props) => {
       <div className="modal-main">
         {/* TODO(Issue #43): Add trips functionality */}
         <p>Enter the stuff for a new trip: ...</p>
-        <p>Enter the stuff for a new trip: ...</p>
-        <p>Enter the stuff for a new trip: ...</p>
-        <p>Enter the stuff for a new trip: ...</p>
-        <p>Enter the stuff for a new trip: ...</p>
-        <p>Enter the stuff for a new trip: ...</p>
         <Button type='button' onClick={submitNewTrip}>
           Submit New Trip
         </Button>

From fc969a7a8280c08a197951e24bdd99a4a0bddca2 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Thu, 9 Jul 2020 21:14:08 -0400
Subject: [PATCH 03/13] Convert manual modal to bootstrap modal.

---
 frontend/src/components/AddTrip/index.js   | 29 +++++++++--------
 frontend/src/components/ViewTrips/index.js |  8 ++---
 frontend/src/styles/add-trip.css           | 37 ----------------------
 3 files changed, 17 insertions(+), 57 deletions(-)
 delete mode 100644 frontend/src/styles/add-trip.css

diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/AddTrip/index.js
index 50c24d9d..6372b0ca 100644
--- a/frontend/src/components/AddTrip/index.js
+++ b/frontend/src/components/AddTrip/index.js
@@ -1,16 +1,12 @@
 import React from 'react';
 import Button from 'react-bootstrap/Button';
-
-import '../../styles/add-trip.css'
+import Modal from 'react-bootstrap/Modal'
 
 
 /**
  * Component corresponding to add trips modal.
  */
 const AddTrip = (props) => {
-  const showHideClass = props.show ? "modal-container show" :
-                                     "modal-container hide";
-
   /**
    * Creates a new Trip document, adds it to Firestore, and closes the modal.
    */
@@ -21,20 +17,25 @@ const AddTrip = (props) => {
   }
 
   return (
-    <div className={showHideClass}>
-      <div className="surrounding-modal" onClick={props.handleClose}></div>
-      <div className="modal-main">
+    <Modal show={props.show} onHide={props.handleClose}>
+      <Modal.Header closeButton>
+        <Modal.Title>Add New Trip</Modal.Title>
+      </Modal.Header>
+
+      <Modal.Body>
         {/* TODO(Issue #43): Add trips functionality */}
         <p>Enter the stuff for a new trip: ...</p>
-        <Button type='button' onClick={submitNewTrip}>
-          Submit New Trip
-        </Button>
+      </Modal.Body>
 
-        <Button type='button' onClick={props.handleClose}>
+      <Modal.Footer>
+        <Button variant="secondary" onClick={props.handleClose}>
           Close
         </Button>
-      </div>
-    </div>
+        <Button variant="primary" onClick={submitNewTrip}>
+          Submit Trip
+        </Button>
+      </Modal.Footer>
+    </Modal>
   );
 };
 
diff --git a/frontend/src/components/ViewTrips/index.js b/frontend/src/components/ViewTrips/index.js
index 86e6bb9e..c1c8e0cf 100644
--- a/frontend/src/components/ViewTrips/index.js
+++ b/frontend/src/components/ViewTrips/index.js
@@ -36,14 +36,10 @@ class ViewTrips extends React.Component {
   }
 
   /** Property that sets `showModal` to true --> displays add trip page. */
-  showAddTripModal = () => {
-    this.setState({ showModal: true });
-  }
+  showAddTripModal = () => { this.setState({ showModal: true }); }
 
   /** Property that sets `showModal` to false --> hides add trip page. */
-  hideAddTripModal = () => {
-    this.setState({ showModal: false });
-  }
+  hideAddTripModal = () => { this.setState({ showModal: false }); }
 
   /** @inheritdoc */
   render() {
diff --git a/frontend/src/styles/add-trip.css b/frontend/src/styles/add-trip.css
deleted file mode 100644
index 07f02375..00000000
--- a/frontend/src/styles/add-trip.css
+++ /dev/null
@@ -1,37 +0,0 @@
-.modal-container {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width:100%;
-  height: 100%;
-  background: rgba(0, 0, 0, 0.75);
-}
-
-.surrounding-modal {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width:100%;
-  height: 100%;
-}
-
-.modal-main {
-  position:fixed;
-  background: white;
-  width: 80%;
-  height: auto;
-  max-height: 80%;
-  top:50%;
-  left:50%;
-  transform: translate(-50%,-50%);
-  z-index: 1;
-  overflow-y: scroll;
-}
-
-.show {
-  display: block;
-}
-
-.hide {
-  display: none;
-}

From 7257ea819b0cac65fe30ac451f6c1d20ba21753a Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Fri, 10 Jul 2020 14:43:20 -0400
Subject: [PATCH 04/13] Add bootstrap form to modal with read capabilities.

---
 .../src/components/AddTrip/create-new-trip.js |  17 +++
 frontend/src/components/AddTrip/index.js      | 122 ++++++++++++++----
 frontend/src/components/ViewTrips/index.js    |   5 +-
 3 files changed, 117 insertions(+), 27 deletions(-)
 create mode 100644 frontend/src/components/AddTrip/create-new-trip.js

diff --git a/frontend/src/components/AddTrip/create-new-trip.js b/frontend/src/components/AddTrip/create-new-trip.js
new file mode 100644
index 00000000..13d82060
--- /dev/null
+++ b/frontend/src/components/AddTrip/create-new-trip.js
@@ -0,0 +1,17 @@
+
+/**
+ * Cleans form data and creates new Trip document in firestore.
+ *
+ * TODO(Issue #43): Create this function and any associated helpers.
+ */
+function createTrip(name, description, destination,
+                    startDate, endDate, collaborators) {
+  console.log(`trip title: ${name}`);
+  console.log(`trip description: ${description}`);
+  console.log(`trip destination: ${destination}`);
+  console.log(`trip start date: ${startDate}`);
+  console.log(`trip end date: ${endDate}`);
+  console.log(`trip collaborators: ${collaborators}`);
+}
+
+export default createTrip;
diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/AddTrip/index.js
index 6372b0ca..ba106dd2 100644
--- a/frontend/src/components/AddTrip/index.js
+++ b/frontend/src/components/AddTrip/index.js
@@ -1,42 +1,112 @@
 import React from 'react';
 import Button from 'react-bootstrap/Button';
 import Modal from 'react-bootstrap/Modal'
+import Form from 'react-bootstrap/Form'
 
+import createTrip from './create-new-trip.js'
+
+function createTextFormControl(placeholder, ref) {
+  return (
+    <Form.Control
+      type="text"
+      placeholder={placeholder}
+      ref={ref}
+    />
+  );
+}
+
+function createFormGroup(controlId, formLabel, inputType, placeholder, ref) {
+  let formControl;
+  if (inputType === 'text') {
+    formControl = createTextFormControl(placeholder, ref)
+  } else {
+    // TODO(Issue #..): Create diff form control for destination, time,
+    //                  and collaborator emails
+    console.error('Only text form controls are implemented as of now');
+  }
+
+  return (
+    <Form.Group controlId={controlId}>
+      <Form.Label>{formLabel}</Form.Label>
+        {formControl}
+    </Form.Group>
+  )
+}
 
 /**
  * Component corresponding to add trips modal.
+ *
+ * @extends React.Component
  */
-const AddTrip = (props) => {
+class AddTrip extends React.Component {
+  /** @inheritdoc */
+  constructor(props) {
+    super(props);
+
+    this.nameRef = React.createRef();
+    this.descriptionRef = React.createRef();
+    this.destinationRef = React.createRef();
+    this.startDateRef = React.createRef();
+    this.endDateRef = React.createRef();
+    this.collaboratorsRef = React.createRef();
+  }
+
   /**
-   * Creates a new Trip document, adds it to Firestore, and closes the modal.
+   * Upon submission of form, creates a new Trip document, adds it to Firestore,
+   * and closes the add trip modal.
    */
-  function submitNewTrip() {
-    // TODO(Issue #43): Create doc and add to firestore here
+  submitNewTrip = () => {
+    console.log('New trip submitted.');
+    createTrip(this.nameRef.current.value,
+               this.descriptionRef.current.value,
+               this.destinationRef.current.value,
+               this.startDateRef.current.value,
+               this.endDateRef.current.value,
+               this.collaboratorsRef.current.value
+              );
 
-    props.handleClose();
+    this.props.handleClose();
   }
 
-  return (
-    <Modal show={props.show} onHide={props.handleClose}>
-      <Modal.Header closeButton>
-        <Modal.Title>Add New Trip</Modal.Title>
-      </Modal.Header>
-
-      <Modal.Body>
-        {/* TODO(Issue #43): Add trips functionality */}
-        <p>Enter the stuff for a new trip: ...</p>
-      </Modal.Body>
-
-      <Modal.Footer>
-        <Button variant="secondary" onClick={props.handleClose}>
-          Close
-        </Button>
-        <Button variant="primary" onClick={submitNewTrip}>
-          Submit Trip
-        </Button>
-      </Modal.Footer>
-    </Modal>
-  );
+  /** @inheritdoc */
+  render() {
+    return (
+      <Modal show={this.props.show} onHide={this.props.handleClose}>
+        <Modal.Header closeButton>
+          <Modal.Title>Add New Trip</Modal.Title>
+        </Modal.Header>
+
+        <Form>
+          <Modal.Body>
+            {createFormGroup('tripNameGroup', 'Trip Name', 'text',
+                             'Enter Trip Name', this.nameRef)}
+            {createFormGroup('tripDescripGroup', 'Trip Description', 'text',
+                             'Enter Trip Description', this.descriptionRef)}
+            {createFormGroup('tripDestGroup', 'Trip Destination', 'text',
+                             'Enter Trip Destination', this.destinationRef)}
+            {createFormGroup('tripStartDateGroup', 'Start Date', 'text',
+                             'Enter Trip Start Date', this.startDateRef)}
+            {createFormGroup('tripEndDateGroup', 'End Date', 'text',
+                             'Enter Trip End Date', this.endDateRef)}
+            {createFormGroup('tripCollabsGroup', 'Trip Collaborators', 'text',
+                           'Enter Collaborator Emails', this.collaboratorsRef)}
+            <Form.Text className="text-muted">
+              Enter emails in the form: 'user1@email.com, ..., userx@email.com'
+            </Form.Text>
+          </Modal.Body>
+
+          <Modal.Footer>
+            <Button variant='secondary' onClick={this.props.handleClose}>
+              Close
+            </Button>
+            <Button variant='primary' type='submit' onClick={this.submitNewTrip}>
+              Submit Trip
+            </Button>
+          </Modal.Footer>
+        </Form>
+      </Modal>
+    );
+  }
 };
 
 export default AddTrip;
diff --git a/frontend/src/components/ViewTrips/index.js b/frontend/src/components/ViewTrips/index.js
index c1c8e0cf..d8d692a3 100644
--- a/frontend/src/components/ViewTrips/index.js
+++ b/frontend/src/components/ViewTrips/index.js
@@ -46,7 +46,10 @@ class ViewTrips extends React.Component {
     return (
       <div className="view-trips-page">
         <Header />
-        <AddTrip show={this.state.showModal} handleClose={this.hideAddTripModal} />
+        <AddTrip
+          show={this.state.showModal}
+          handleClose={this.hideAddTripModal}
+          userEmail={getUserEmail()} />
         <div className="manage-trips-bar">
           <Button type='button' onClick={this.showAddTripModal}>
             + New Trip

From 5d5fc07e6591c38730ced153aa58122647a129bd Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Sat, 11 Jul 2020 15:09:32 -0400
Subject: [PATCH 05/13] Add issue number to .

---
 frontend/src/components/AddTrip/index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/AddTrip/index.js
index ba106dd2..ff044144 100644
--- a/frontend/src/components/AddTrip/index.js
+++ b/frontend/src/components/AddTrip/index.js
@@ -20,8 +20,8 @@ function createFormGroup(controlId, formLabel, inputType, placeholder, ref) {
   if (inputType === 'text') {
     formControl = createTextFormControl(placeholder, ref)
   } else {
-    // TODO(Issue #..): Create diff form control for destination, time,
-    //                  and collaborator emails
+    // TODO(Issue #52): Create diff form control for start & end dates
+    //                  and collaborator emails.
     console.error('Only text form controls are implemented as of now');
   }
 

From 023e12c458d2f03cb00da1bfb501ecd58e8c9e82 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Sat, 11 Jul 2020 15:13:38 -0400
Subject: [PATCH 06/13] Pass trip object rather than individual values to
 createTrip module.

---
 .../src/components/AddTrip/create-new-trip.js    | 15 +++++++--------
 frontend/src/components/AddTrip/index.js         | 16 ++++++++--------
 2 files changed, 15 insertions(+), 16 deletions(-)

diff --git a/frontend/src/components/AddTrip/create-new-trip.js b/frontend/src/components/AddTrip/create-new-trip.js
index 13d82060..e763be0d 100644
--- a/frontend/src/components/AddTrip/create-new-trip.js
+++ b/frontend/src/components/AddTrip/create-new-trip.js
@@ -4,14 +4,13 @@
  *
  * TODO(Issue #43): Create this function and any associated helpers.
  */
-function createTrip(name, description, destination,
-                    startDate, endDate, collaborators) {
-  console.log(`trip title: ${name}`);
-  console.log(`trip description: ${description}`);
-  console.log(`trip destination: ${destination}`);
-  console.log(`trip start date: ${startDate}`);
-  console.log(`trip end date: ${endDate}`);
-  console.log(`trip collaborators: ${collaborators}`);
+function createTrip(tripObj) {
+  console.log(`trip title: ${tripObj.name}`);
+  console.log(`trip description: ${tripObj.description}`);
+  console.log(`trip destination: ${tripObj.destination}`);
+  console.log(`trip start date: ${tripObj.startDate}`);
+  console.log(`trip end date: ${tripObj.endDate}`);
+  console.log(`trip collaborators: ${tripObj.collaborators}`);
 }
 
 export default createTrip;
diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/AddTrip/index.js
index ff044144..99b0382d 100644
--- a/frontend/src/components/AddTrip/index.js
+++ b/frontend/src/components/AddTrip/index.js
@@ -57,13 +57,13 @@ class AddTrip extends React.Component {
    */
   submitNewTrip = () => {
     console.log('New trip submitted.');
-    createTrip(this.nameRef.current.value,
-               this.descriptionRef.current.value,
-               this.destinationRef.current.value,
-               this.startDateRef.current.value,
-               this.endDateRef.current.value,
-               this.collaboratorsRef.current.value
-              );
+    createTrip({name: this.nameRef.current.value,
+               description: this.descriptionRef.current.value,
+               destination: this.destinationRef.current.value,
+               startDate: this.startDateRef.current.value,
+               endDate: this.endDateRef.current.value,
+               collaborators: this.collaboratorsRef.current.value
+    });
 
     this.props.handleClose();
   }
@@ -100,7 +100,7 @@ class AddTrip extends React.Component {
               Close
             </Button>
             <Button variant='primary' type='submit' onClick={this.submitNewTrip}>
-              Submit Trip
+              Add Trip
             </Button>
           </Modal.Footer>
         </Form>

From d86214aa99e6951bea4bdd571dfb75db9a69cc92 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Sat, 11 Jul 2020 17:31:46 -0400
Subject: [PATCH 07/13] Create additional temp field for createFormGroup() to
 handle instructions text needed until issue #52 is resolved.

---
 frontend/src/components/AddTrip/index.js | 24 +++++++++++++++---------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/AddTrip/index.js
index 99b0382d..68085e28 100644
--- a/frontend/src/components/AddTrip/index.js
+++ b/frontend/src/components/AddTrip/index.js
@@ -15,20 +15,25 @@ function createTextFormControl(placeholder, ref) {
   );
 }
 
-function createFormGroup(controlId, formLabel, inputType, placeholder, ref) {
+function createFormGroup(controlId, formLabel, inputType,
+                                    placeholder, ref, subFormText) {
   let formControl;
   if (inputType === 'text') {
     formControl = createTextFormControl(placeholder, ref)
   } else {
-    // TODO(Issue #52): Create diff form control for start & end dates
+    // TODO(Issue #52): Create diff form inputs for start & end dates
     //                  and collaborator emails.
-    console.error('Only text form controls are implemented as of now');
+    console.error('Only text form inputs are implemented as of now');
   }
 
   return (
     <Form.Group controlId={controlId}>
       <Form.Label>{formLabel}</Form.Label>
         {formControl}
+      {/* Temporary instructions until fix Issue #52 */}
+      <Form.Text className="text-muted">
+        {subFormText}
+      </Form.Text>
     </Form.Group>
   )
 }
@@ -85,14 +90,15 @@ class AddTrip extends React.Component {
             {createFormGroup('tripDestGroup', 'Trip Destination', 'text',
                              'Enter Trip Destination', this.destinationRef)}
             {createFormGroup('tripStartDateGroup', 'Start Date', 'text',
-                             'Enter Trip Start Date', this.startDateRef)}
+                            'Enter Trip Start Date', this.startDateRef,
+                            'Enter date in the form: \'mm/dd/yyy\'')}
             {createFormGroup('tripEndDateGroup', 'End Date', 'text',
-                             'Enter Trip End Date', this.endDateRef)}
+                          'Enter Trip End Date', this.endDateRef,
+                          'Enter date in the form: \'mm/dd/yyy\'')}
             {createFormGroup('tripCollabsGroup', 'Trip Collaborators', 'text',
-                           'Enter Collaborator Emails', this.collaboratorsRef)}
-            <Form.Text className="text-muted">
-              Enter emails in the form: 'user1@email.com, ..., userx@email.com'
-            </Form.Text>
+                           'Enter Collaborator Emails', this.collaboratorsRef,
+                           'Enter emails in the form: \'user1@email.com, ...,' +
+                           ' userx@email.com\'')}
           </Modal.Body>
 
           <Modal.Footer>

From 7944bff24f7b1a1fffebcce8e841d379cca9bc85 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Sat, 11 Jul 2020 20:55:17 -0400
Subject: [PATCH 08/13] Add documentation to AddTrip index.js functions.

---
 frontend/src/components/AddTrip/index.js | 31 +++++++++++++++++++++---
 1 file changed, 28 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/AddTrip/index.js
index 68085e28..37b4aba8 100644
--- a/frontend/src/components/AddTrip/index.js
+++ b/frontend/src/components/AddTrip/index.js
@@ -5,6 +5,14 @@ import Form from 'react-bootstrap/Form'
 
 import createTrip from './create-new-trip.js'
 
+/**
+ * Returns a Form.Control element with input type 'text' and other fields
+ * specified by the function parameters.
+ *
+ * @param {string} placeholder Text placehold in the form input
+ * @param {React.RefObject} ref Ref attached to the value inputted in the form.
+ * @return {JSX.Element} The Form.Control element.
+ */
 function createTextFormControl(placeholder, ref) {
   return (
     <Form.Control
@@ -15,8 +23,20 @@ function createTextFormControl(placeholder, ref) {
   );
 }
 
+/**
+ * Returns a Form.Group element with components specified by the input args.
+ *
+ * @param {string} controlId prop that accessibly wires the nested label and
+ *                           input prop.
+ * @param {string} formLabel Label/title for the form input.
+ * @param {string} inputType Input type of the form.
+ * @param {string} placeholder Text placeholder in the form input.
+ * @param {React.RefObject} ref Ref attatched to the valued inputted in the form.
+ * @param {string} subFormText Subtext instructions under a form input.
+ * @return {JSX.Element} The Form.Group element.
+ */
 function createFormGroup(controlId, formLabel, inputType,
-                                    placeholder, ref, subFormText) {
+                                    placeholder, ref, subFormText = '') {
   let formControl;
   if (inputType === 'text') {
     formControl = createTextFormControl(placeholder, ref)
@@ -41,6 +61,11 @@ function createFormGroup(controlId, formLabel, inputType,
 /**
  * Component corresponding to add trips modal.
  *
+ * @param {Object} props These are the props for this component:
+ * - show: Boolean that determines if the add trips modal should be displayed.
+ * - handleClose: The function that handles closing the add trips modal.
+ * - userEmail: The current users email.
+ *
  * @extends React.Component
  */
 class AddTrip extends React.Component {
@@ -57,8 +82,8 @@ class AddTrip extends React.Component {
   }
 
   /**
-   * Upon submission of form, creates a new Trip document, adds it to Firestore,
-   * and closes the add trip modal.
+   * Upon submission of the form, a new Trip document is created and the add
+   * trip modal is closed.
    */
   submitNewTrip = () => {
     console.log('New trip submitted.');

From 557144b97bfe904042511425ea5bfe685fdc8354 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Mon, 13 Jul 2020 16:57:53 -0400
Subject: [PATCH 09/13] Moved 'add trips' files to ViewTrips folder and updated
 imports.

---
 .../components/{AddTrip/index.js => ViewTrips/add-trip.js}  | 0
 .../components/{AddTrip => ViewTrips}/create-new-trip.js    | 0
 frontend/src/components/ViewTrips/index.js                  | 6 +++---
 3 files changed, 3 insertions(+), 3 deletions(-)
 rename frontend/src/components/{AddTrip/index.js => ViewTrips/add-trip.js} (100%)
 rename frontend/src/components/{AddTrip => ViewTrips}/create-new-trip.js (100%)

diff --git a/frontend/src/components/AddTrip/index.js b/frontend/src/components/ViewTrips/add-trip.js
similarity index 100%
rename from frontend/src/components/AddTrip/index.js
rename to frontend/src/components/ViewTrips/add-trip.js
diff --git a/frontend/src/components/AddTrip/create-new-trip.js b/frontend/src/components/ViewTrips/create-new-trip.js
similarity index 100%
rename from frontend/src/components/AddTrip/create-new-trip.js
rename to frontend/src/components/ViewTrips/create-new-trip.js
diff --git a/frontend/src/components/ViewTrips/index.js b/frontend/src/components/ViewTrips/index.js
index d8d692a3..28c23faf 100644
--- a/frontend/src/components/ViewTrips/index.js
+++ b/frontend/src/components/ViewTrips/index.js
@@ -2,9 +2,9 @@ import React from 'react';
 
 import Button from 'react-bootstrap/Button';
 
-import app from '../Firebase/index.js';
-import Header from '../Header/index.js';
-import AddTrip from '../AddTrip/index.js'
+import app from '../Firebase/';
+import Header from '../Header/';
+import AddTrip from './add-trip.js'
 import TripsContainer from './trips-container.js';
 
 const db = app.firestore();

From c9af1a511763996ce544151c827c774a16e739c6 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Tue, 14 Jul 2020 13:28:03 -0400
Subject: [PATCH 10/13] Fix spelling issue in comments.

---
 frontend/src/components/ViewTrips/add-trip.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/ViewTrips/add-trip.js b/frontend/src/components/ViewTrips/add-trip.js
index 37b4aba8..f97f3531 100644
--- a/frontend/src/components/ViewTrips/add-trip.js
+++ b/frontend/src/components/ViewTrips/add-trip.js
@@ -26,12 +26,12 @@ function createTextFormControl(placeholder, ref) {
 /**
  * Returns a Form.Group element with components specified by the input args.
  *
- * @param {string} controlId prop that accessibly wires the nested label and
+ * @param {string} controlId Prop that accessibly wires the nested label and
  *                           input prop.
  * @param {string} formLabel Label/title for the form input.
  * @param {string} inputType Input type of the form.
  * @param {string} placeholder Text placeholder in the form input.
- * @param {React.RefObject} ref Ref attatched to the valued inputted in the form.
+ * @param {React.RefObject} ref Ref attached to the values inputted in the form.
  * @param {string} subFormText Subtext instructions under a form input.
  * @return {JSX.Element} The Form.Group element.
  */
@@ -64,7 +64,7 @@ function createFormGroup(controlId, formLabel, inputType,
  * @param {Object} props These are the props for this component:
  * - show: Boolean that determines if the add trips modal should be displayed.
  * - handleClose: The function that handles closing the add trips modal.
- * - userEmail: The current users email.
+ * - userEmail: The current user's email.
  *
  * @extends React.Component
  */

From e026a412469fefaea379cdc5a6b5284e46fdd9a7 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Tue, 14 Jul 2020 21:55:37 -0400
Subject: [PATCH 11/13] Add todo to remove console.log in following PR.

---
 frontend/src/components/ViewTrips/add-trip.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/ViewTrips/add-trip.js b/frontend/src/components/ViewTrips/add-trip.js
index f97f3531..04fb4c29 100644
--- a/frontend/src/components/ViewTrips/add-trip.js
+++ b/frontend/src/components/ViewTrips/add-trip.js
@@ -84,8 +84,10 @@ class AddTrip extends React.Component {
   /**
    * Upon submission of the form, a new Trip document is created and the add
    * trip modal is closed.
+   *
+   * TODO(Merge PR #54): Remove console.log statment.
    */
-  submitNewTrip = () => {
+  handleSubmitNewTrip = () => {
     console.log('New trip submitted.');
     createTrip({name: this.nameRef.current.value,
                description: this.descriptionRef.current.value,
@@ -130,7 +132,7 @@ class AddTrip extends React.Component {
             <Button variant='secondary' onClick={this.props.handleClose}>
               Close
             </Button>
-            <Button variant='primary' type='submit' onClick={this.submitNewTrip}>
+            <Button variant='primary' onClick={this.handleSubmitNewTrip}>
               Add Trip
             </Button>
           </Modal.Footer>

From c2b9b47663aafdfafea001f4bfe23d1e4158ba37 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Tue, 14 Jul 2020 21:58:02 -0400
Subject: [PATCH 12/13] Change tripDescripGroup id to tripDescGroup for
 consistency sake.

---
 frontend/src/components/ViewTrips/add-trip.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/ViewTrips/add-trip.js b/frontend/src/components/ViewTrips/add-trip.js
index 04fb4c29..ce001eb4 100644
--- a/frontend/src/components/ViewTrips/add-trip.js
+++ b/frontend/src/components/ViewTrips/add-trip.js
@@ -112,7 +112,7 @@ class AddTrip extends React.Component {
           <Modal.Body>
             {createFormGroup('tripNameGroup', 'Trip Name', 'text',
                              'Enter Trip Name', this.nameRef)}
-            {createFormGroup('tripDescripGroup', 'Trip Description', 'text',
+            {createFormGroup('tripDescGroup', 'Trip Description', 'text',
                              'Enter Trip Description', this.descriptionRef)}
             {createFormGroup('tripDestGroup', 'Trip Destination', 'text',
                              'Enter Trip Destination', this.destinationRef)}

From 554f4e3085a425180adef03e5def0f30449630e4 Mon Sep 17 00:00:00 2001
From: Zach Ghera <zpghera00@gmail.com>
Date: Tue, 14 Jul 2020 21:59:20 -0400
Subject: [PATCH 13/13] Ensure date placeholder strings contain four 'y's for
 year.

---
 frontend/src/components/ViewTrips/add-trip.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/ViewTrips/add-trip.js b/frontend/src/components/ViewTrips/add-trip.js
index ce001eb4..d72c7f17 100644
--- a/frontend/src/components/ViewTrips/add-trip.js
+++ b/frontend/src/components/ViewTrips/add-trip.js
@@ -118,10 +118,10 @@ class AddTrip extends React.Component {
                              'Enter Trip Destination', this.destinationRef)}
             {createFormGroup('tripStartDateGroup', 'Start Date', 'text',
                             'Enter Trip Start Date', this.startDateRef,
-                            'Enter date in the form: \'mm/dd/yyy\'')}
+                            'Enter date in the form: \'mm/dd/yyyy\'')}
             {createFormGroup('tripEndDateGroup', 'End Date', 'text',
                           'Enter Trip End Date', this.endDateRef,
-                          'Enter date in the form: \'mm/dd/yyy\'')}
+                          'Enter date in the form: \'mm/dd/yyyy\'')}
             {createFormGroup('tripCollabsGroup', 'Trip Collaborators', 'text',
                            'Enter Collaborator Emails', this.collaboratorsRef,
                            'Enter emails in the form: \'user1@email.com, ...,' +