From edebfcd256f15a16a5cc9fc077d80b5cec409fcc Mon Sep 17 00:00:00 2001
From: ananyay <ananyeet@users.noreply.github.com>
Date: Fri, 10 Jul 2020 11:06:57 -0500
Subject: [PATCH 01/13] Update time.js

---
 .../components/Utils/{utils.js => time.js}    | 22 +++++++++++++++++++
 .../Utils/{utils.test.js => time.test.js}     | 20 ++++++++++++++++-
 2 files changed, 41 insertions(+), 1 deletion(-)
 rename frontend/src/components/Utils/{utils.js => time.js} (64%)
 rename frontend/src/components/Utils/{utils.test.js => time.test.js} (65%)

diff --git a/frontend/src/components/Utils/utils.js b/frontend/src/components/Utils/time.js
similarity index 64%
rename from frontend/src/components/Utils/utils.js
rename to frontend/src/components/Utils/time.js
index 29793615..dd15bbb0 100644
--- a/frontend/src/components/Utils/utils.js
+++ b/frontend/src/components/Utils/time.js
@@ -35,3 +35,25 @@ export function timestampToDateFormatted(msTimestamp, timezone='America/New_York
   const formatted = date.toLocaleDateString('en-US', formatOptions);
   return formatted;
 }
+
+/** 
+ * Format a timestamp (in milliseconds) into a pretty string.
+ * @param {int} msTimestamp 
+ * @param {string} timezone 
+ * @returns {string} Time formatted into a string like 
+ * "Monday, January 19, 1970, 02:48 AM"
+ */
+export function timestampToFormatted(msTimestamp, timezone = "America/New_York") {
+  let date = new Date(msTimestamp);
+  let formatOptions = { 
+    weekday: 'long', 
+    year: 'numeric', 
+    month: 'long', 
+    day: 'numeric',  
+    hour: 'numeric', 
+    minute: '2-digit', 
+    timeZone: timezone
+  };
+  let formatted = date.toLocaleString('en-US', formatOptions);
+  return formatted;
+}
diff --git a/frontend/src/components/Utils/utils.test.js b/frontend/src/components/Utils/time.test.js
similarity index 65%
rename from frontend/src/components/Utils/utils.test.js
rename to frontend/src/components/Utils/time.test.js
index 059f90e7..80b0e33f 100644
--- a/frontend/src/components/Utils/utils.test.js
+++ b/frontend/src/components/Utils/time.test.js
@@ -34,4 +34,22 @@ test('other time timestamp format', () => {
   const actualSingapore = utils.timestampToTimeFormatted(testDate, 'Asia/Singapore');
   expect(actualCentral).toEqual(expectedCentral);
   expect(actualSingapore).toEqual(expectedSingapore);
-})
\ No newline at end of file
+})
+
+test('new york full timestamp format', () => {
+  // Month parameter is zero indexed so it's actually the 10th month.
+  const testDate = new Date(Date.UTC(2020, 9, 3, 14, 19, 4, 23)).getTime();
+  const expected = "Saturday, October 3, 2020, 10:19 AM";
+  const actual = utils.timestampToFormatted(testDate);
+  expect(actual).toEqual(expected);
+});
+
+test('other full timestamp format', () => {
+  const testDate = new Date(Date.UTC(2020, 7, 23, 2, 3, 2, 4)).getTime();
+  const expectedCentral = "Saturday, August 22, 2020, 9:03 PM";
+  const expectedSingapore = "Sunday, August 23, 2020, 10:03 AM";
+  const actualCentral = utils.timestampToFormatted(testDate, "America/Chicago");
+  const actualSingapore = utils.timestampToFormatted(testDate, "Asia/Singapore");
+  expect(actualCentral).toEqual(expectedCentral);
+  expect(actualSingapore).toEqual(expectedSingapore);
+})

From 41cdd2c363dd8a05ff6e28329b6f5ea337cfc278 Mon Sep 17 00:00:00 2001
From: ananyay <ananyeet@users.noreply.github.com>
Date: Fri, 10 Jul 2020 11:23:57 -0500
Subject: [PATCH 02/13] update import statements

---
 frontend/src/components/ViewActivities/activity.js    | 8 ++++----
 frontend/src/components/ViewActivities/activityday.js | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/ViewActivities/activity.js b/frontend/src/components/ViewActivities/activity.js
index 31255a0c..a06753dc 100644
--- a/frontend/src/components/ViewActivities/activity.js
+++ b/frontend/src/components/ViewActivities/activity.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import Card from 'react-bootstrap/Card';
-import * as utils from '../Utils/utils.js';
-import * as DBUTILS from '../../constants/dbconstants.js'
+import * as time from '../Utils/time.js';
+import * as DBUTILS from '../../constants/database.js'
 import '../../styles/activities.css';
 
 class Activity extends React.Component {
@@ -11,8 +11,8 @@ class Activity extends React.Component {
     return (
       <Card className='activity'>
         <p>title: {activity[DBUTILS.ACTIVITIES_TITLE]}</p>
-        <p>start time: {utils.timestampToTimeFormatted(activity[DBUTILS.ACTIVITIES_START_TIME])} </p>
-        <p>end time: {utils.timestampToTimeFormatted(activity[DBUTILS.ACTIVITIES_END_TIME])} </p>
+        <p>start time: {time.timestampToTimeFormatted(activity[DBUTILS.ACTIVITIES_START_TIME])} </p>
+        <p>end time: {time.timestampToTimeFormatted(activity[DBUTILS.ACTIVITIES_END_TIME])} </p>
       </Card>
     );
   }
diff --git a/frontend/src/components/ViewActivities/activityday.js b/frontend/src/components/ViewActivities/activityday.js
index 822b551b..38e75d8f 100644
--- a/frontend/src/components/ViewActivities/activityday.js
+++ b/frontend/src/components/ViewActivities/activityday.js
@@ -3,7 +3,7 @@ import Accordion from 'react-bootstrap/Accordion';
 import Card from 'react-bootstrap/Card';
 import Activity from './activity.js';
 import * as activityFns from './activityfns.js';
-import * as utils from '../Utils/utils.js'
+import * as time from '../Utils/time.js'
 
 class ActivityDay extends React.Component {
   /** @inheritdoc */
@@ -15,7 +15,7 @@ class ActivityDay extends React.Component {
     return (
       <Card>
         <Accordion.Toggle as={Card.Header} eventKey='0' align='center' >
-          {utils.timestampToDateFormatted(date.getTime())}
+          {time.timestampToDateFormatted(date.getTime())}
         </Accordion.Toggle>
         <Accordion.Collapse eventKey='0'>
           <Card.Body>

From 9392d61387598727df728bc6cdf3175bf721c38f Mon Sep 17 00:00:00 2001
From: ananyay <ananyeet@users.noreply.github.com>
Date: Fri, 10 Jul 2020 12:05:12 -0500
Subject: [PATCH 03/13] Make activities first visible

---
 .../src/components/ViewActivities/activity.js | 15 ++++++++++----
 .../components/ViewActivities/activityday.js  | 20 ++++++++-----------
 .../components/ViewActivities/activitylist.js |  4 +---
 frontend/src/styles/activities.css            |  5 ++---
 4 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/frontend/src/components/ViewActivities/activity.js b/frontend/src/components/ViewActivities/activity.js
index a06753dc..a20606d0 100644
--- a/frontend/src/components/ViewActivities/activity.js
+++ b/frontend/src/components/ViewActivities/activity.js
@@ -3,16 +3,23 @@ import Card from 'react-bootstrap/Card';
 import * as time from '../Utils/time.js';
 import * as DBUTILS from '../../constants/database.js'
 import '../../styles/activities.css';
+import Accordion from 'react-bootstrap/Accordion';
 
 class Activity extends React.Component {
   /** @inheritdoc */
   render() {
     const activity = this.props.activity;
     return (
-      <Card className='activity'>
-        <p>title: {activity[DBUTILS.ACTIVITIES_TITLE]}</p>
-        <p>start time: {time.timestampToTimeFormatted(activity[DBUTILS.ACTIVITIES_START_TIME])} </p>
-        <p>end time: {time.timestampToTimeFormatted(activity[DBUTILS.ACTIVITIES_END_TIME])} </p>
+      <Card>
+      <Accordion.Toggle as={Card.Header} eventKey='0' align='center' >
+        {activity['title']}
+      </Accordion.Toggle>
+      <Accordion.Collapse eventKey='0'>
+        <Card.Body>
+        <p>start time: {time.timestampToFormatted(activity[DBUTILS.ACTIVITIES_START_TIME])} </p>
+        <p>end time: {time.timestampToFormatted(activity[DBUTILS.ACTIVITIES_END_TIME])} </p>
+        </Card.Body>
+        </Accordion.Collapse>
       </Card>
     );
   }
diff --git a/frontend/src/components/ViewActivities/activityday.js b/frontend/src/components/ViewActivities/activityday.js
index 38e75d8f..9766304b 100644
--- a/frontend/src/components/ViewActivities/activityday.js
+++ b/frontend/src/components/ViewActivities/activityday.js
@@ -13,18 +13,14 @@ class ActivityDay extends React.Component {
     let date = new Date(this.props.date);
     let id = date.getTime();
     return (
-      <Card>
-        <Accordion.Toggle as={Card.Header} eventKey='0' align='center' >
-          {time.timestampToDateFormatted(date.getTime())}
-        </Accordion.Toggle>
-        <Accordion.Collapse eventKey='0'>
-          <Card.Body>
-            {sortedActivities.map((activity, index) => (
-            <Activity activity={activity} key={index + id}/>
-            ))}
-          </Card.Body>
-        </Accordion.Collapse>
-      </Card>
+      <div className='activity-day'>
+        <h4>{time.timestampToDateFormatted(date.getTime())}</h4>
+        {sortedActivities.map((activity, index) => (
+          <Accordion defaultActiveKey='1' key={index}>
+            <Activity activity={activity} key={index + id} className="activity"/>
+          </Accordion>
+        ))}
+      </div>
     );
   }
 }
diff --git a/frontend/src/components/ViewActivities/activitylist.js b/frontend/src/components/ViewActivities/activitylist.js
index 434418bb..384ba268 100644
--- a/frontend/src/components/ViewActivities/activitylist.js
+++ b/frontend/src/components/ViewActivities/activitylist.js
@@ -34,9 +34,7 @@ class ActivityList extends React.Component {
     return (
       <div className='activity-list'>
         {this.state.days.map((item, index) => (
-          <Accordion defaultActiveKey='1' key={index} className='activity-day-dropdown'>
-            <ActivityDay date={item[0]} activities={item[1]} />
-          </Accordion>
+            <ActivityDay date={item[0]} activities={item[1]} key={index}/>
         ))}
       </div>
     );
diff --git a/frontend/src/styles/activities.css b/frontend/src/styles/activities.css
index c8600d1b..761a83e7 100644
--- a/frontend/src/styles/activities.css
+++ b/frontend/src/styles/activities.css
@@ -11,12 +11,11 @@
     justify-content: center;
 }
 
-.activity {
+.accordion {
     margin: 1em;
 }
 
-.activity-day-dropdown {
-    border: black;
+.activity-day {
     margin: 0.5em auto;
     max-width: 50pc;
 }

From ae823a7743d0e242cee891e8384e254fb34f8b5d Mon Sep 17 00:00:00 2001
From: ananyay <ananyeet@users.noreply.github.com>
Date: Fri, 10 Jul 2020 14:01:54 -0500
Subject: [PATCH 04/13] spaces and comments

---
 frontend/src/components/Utils/time.js                 | 1 +
 frontend/src/components/ViewActivities/activity.js    | 8 ++++----
 frontend/src/components/ViewActivities/activityday.js | 2 +-
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/Utils/time.js b/frontend/src/components/Utils/time.js
index dd15bbb0..14f378db 100644
--- a/frontend/src/components/Utils/time.js
+++ b/frontend/src/components/Utils/time.js
@@ -38,6 +38,7 @@ export function timestampToDateFormatted(msTimestamp, timezone='America/New_York
 
 /** 
  * Format a timestamp (in milliseconds) into a pretty string.
+ * 
  * @param {int} msTimestamp 
  * @param {string} timezone 
  * @returns {string} Time formatted into a string like 
diff --git a/frontend/src/components/ViewActivities/activity.js b/frontend/src/components/ViewActivities/activity.js
index a20606d0..1ddd97dd 100644
--- a/frontend/src/components/ViewActivities/activity.js
+++ b/frontend/src/components/ViewActivities/activity.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import Card from 'react-bootstrap/Card';
 import * as time from '../Utils/time.js';
-import * as DBUTILS from '../../constants/database.js'
+import * as DB from '../../constants/database.js'
 import '../../styles/activities.css';
 import Accordion from 'react-bootstrap/Accordion';
 
@@ -12,12 +12,12 @@ class Activity extends React.Component {
     return (
       <Card>
       <Accordion.Toggle as={Card.Header} eventKey='0' align='center' >
-        {activity['title']}
+        {activity[DB.ACTIVITIES_TITLE]}
       </Accordion.Toggle>
       <Accordion.Collapse eventKey='0'>
         <Card.Body>
-        <p>start time: {time.timestampToFormatted(activity[DBUTILS.ACTIVITIES_START_TIME])} </p>
-        <p>end time: {time.timestampToFormatted(activity[DBUTILS.ACTIVITIES_END_TIME])} </p>
+        <p>Start time: {time.timestampToFormatted(activity[DB.ACTIVITIES_START_TIME])} </p>
+        <p>End time: {time.timestampToFormatted(activity[DB.ACTIVITIES_END_TIME])} </p>
         </Card.Body>
         </Accordion.Collapse>
       </Card>
diff --git a/frontend/src/components/ViewActivities/activityday.js b/frontend/src/components/ViewActivities/activityday.js
index 9766304b..bac7b7ec 100644
--- a/frontend/src/components/ViewActivities/activityday.js
+++ b/frontend/src/components/ViewActivities/activityday.js
@@ -16,7 +16,7 @@ class ActivityDay extends React.Component {
       <div className='activity-day'>
         <h4>{time.timestampToDateFormatted(date.getTime())}</h4>
         {sortedActivities.map((activity, index) => (
-          <Accordion defaultActiveKey='1' key={index}>
+          <Accordion defaultActiveKey='1' key={index}>  
             <Activity activity={activity} key={index + id} className="activity"/>
           </Accordion>
         ))}

From 096f2c9a71ec8cedfab85d4377002724775665d0 Mon Sep 17 00:00:00 2001
From: ananyay <ananyeet@users.noreply.github.com>
Date: Fri, 10 Jul 2020 14:06:52 -0500
Subject: [PATCH 05/13] Reorganize so dependents together, remove unnecessary
 imports

---
 .../src/components/ViewActivities/activity.js | 24 ++++++++++---------
 .../components/ViewActivities/activityday.js  |  6 +----
 .../components/ViewActivities/activitylist.js |  4 +---
 3 files changed, 15 insertions(+), 19 deletions(-)

diff --git a/frontend/src/components/ViewActivities/activity.js b/frontend/src/components/ViewActivities/activity.js
index 1ddd97dd..661d9f30 100644
--- a/frontend/src/components/ViewActivities/activity.js
+++ b/frontend/src/components/ViewActivities/activity.js
@@ -10,17 +10,19 @@ class Activity extends React.Component {
   render() {
     const activity = this.props.activity;
     return (
-      <Card>
-      <Accordion.Toggle as={Card.Header} eventKey='0' align='center' >
-        {activity[DB.ACTIVITIES_TITLE]}
-      </Accordion.Toggle>
-      <Accordion.Collapse eventKey='0'>
-        <Card.Body>
-        <p>Start time: {time.timestampToFormatted(activity[DB.ACTIVITIES_START_TIME])} </p>
-        <p>End time: {time.timestampToFormatted(activity[DB.ACTIVITIES_END_TIME])} </p>
-        </Card.Body>
-        </Accordion.Collapse>
-      </Card>
+      <Accordion defaultActiveKey='1'>  
+        <Card>
+        <Accordion.Toggle as={Card.Header} eventKey='0' align='center' >
+          {activity[DB.ACTIVITIES_TITLE]}
+        </Accordion.Toggle>
+        <Accordion.Collapse eventKey='0'>
+          <Card.Body>
+          <p>Start time: {time.timestampToFormatted(activity[DB.ACTIVITIES_START_TIME])} </p>
+          <p>End time: {time.timestampToFormatted(activity[DB.ACTIVITIES_END_TIME])} </p>
+          </Card.Body>
+          </Accordion.Collapse>
+        </Card>
+      </Accordion>
     );
   }
 };
diff --git a/frontend/src/components/ViewActivities/activityday.js b/frontend/src/components/ViewActivities/activityday.js
index bac7b7ec..ec5cd01e 100644
--- a/frontend/src/components/ViewActivities/activityday.js
+++ b/frontend/src/components/ViewActivities/activityday.js
@@ -1,6 +1,4 @@
 import React from 'react';
-import Accordion from 'react-bootstrap/Accordion';
-import Card from 'react-bootstrap/Card';
 import Activity from './activity.js';
 import * as activityFns from './activityfns.js';
 import * as time from '../Utils/time.js'
@@ -16,9 +14,7 @@ class ActivityDay extends React.Component {
       <div className='activity-day'>
         <h4>{time.timestampToDateFormatted(date.getTime())}</h4>
         {sortedActivities.map((activity, index) => (
-          <Accordion defaultActiveKey='1' key={index}>  
-            <Activity activity={activity} key={index + id} className="activity"/>
-          </Accordion>
+          <Activity activity={activity} key={index + id} className="activity"/>
         ))}
       </div>
     );
diff --git a/frontend/src/components/ViewActivities/activitylist.js b/frontend/src/components/ViewActivities/activitylist.js
index 384ba268..d33bb3f6 100644
--- a/frontend/src/components/ViewActivities/activitylist.js
+++ b/frontend/src/components/ViewActivities/activitylist.js
@@ -1,8 +1,6 @@
 import React from 'react';
-import app from '../Firebase';
 import * as activityFns from './activityfns.js';
 import ActivityDay from './activityday.js';
-import Accordion from 'react-bootstrap/Accordion';
 import '../../styles/activities.css';
 
 class ActivityList extends React.Component {
@@ -34,7 +32,7 @@ class ActivityList extends React.Component {
     return (
       <div className='activity-list'>
         {this.state.days.map((item, index) => (
-            <ActivityDay date={item[0]} activities={item[1]} key={index}/>
+          <ActivityDay date={item[0]} activities={item[1]} key={index}/>
         ))}
       </div>
     );

From dc7bb1beaa6de390eb4302de8b2f45a01fbff3ad Mon Sep 17 00:00:00 2001
From: ananyay <14322650+ananyeet@users.noreply.github.com>
Date: Mon, 13 Jul 2020 12:40:10 -0500
Subject: [PATCH 06/13] Test time zones into constants.

---
 frontend/src/components/Utils/time.test.js | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/Utils/time.test.js b/frontend/src/components/Utils/time.test.js
index 80b0e33f..729b519d 100644
--- a/frontend/src/components/Utils/time.test.js
+++ b/frontend/src/components/Utils/time.test.js
@@ -1,5 +1,8 @@
 import * as utils from './utils';
 
+const TZ_CHICAGO = 'America/Chicago';
+const TZ_SINGAPORE = ;
+
 test('new york date timestamp format', () => {
   // Month parameter is zero indexed so it's actually the 10th month.
   const testDate = new Date(Date.UTC(2020, 9, 3, 14, 19, 4, 23)).getTime();
@@ -12,8 +15,8 @@ test('other date timestamp format', () => {
   const testDate = new Date(Date.UTC(2020, 7, 23, 2, 3, 2, 4)).getTime();
   const expectedCentral = 'Saturday, August 22, 2020';
   const expectedSingapore = 'Sunday, August 23, 2020';
-  const actualCentral = utils.timestampToDateFormatted(testDate, 'America/Chicago');
-  const actualSingapore = utils.timestampToDateFormatted(testDate, 'Asia/Singapore');
+  const actualCentral = utils.timestampToDateFormatted(testDate, TZ_CHICAGO);
+  const actualSingapore = utils.timestampToDateFormatted(testDate, TZ_SINGAPORE);
   expect(actualCentral).toEqual(expectedCentral);
   expect(actualSingapore).toEqual(expectedSingapore);
 })
@@ -30,8 +33,8 @@ test('other time timestamp format', () => {
   const testDate = new Date(Date.UTC(2020, 7, 23, 2, 3, 2, 4)).getTime();
   const expectedCentral = '9:03 PM';
   const expectedSingapore = '10:03 AM';
-  const actualCentral = utils.timestampToTimeFormatted(testDate, 'America/Chicago');
-  const actualSingapore = utils.timestampToTimeFormatted(testDate, 'Asia/Singapore');
+  const actualCentral = utils.timestampToTimeFormatted(testDate, TZ_CHICAGO);
+  const actualSingapore = utils.timestampToTimeFormatted(testDate, TZ_SINGAPORE);
   expect(actualCentral).toEqual(expectedCentral);
   expect(actualSingapore).toEqual(expectedSingapore);
 })

From 087d32a500cfd4aef1873e7c81d9fc1800a8edfe Mon Sep 17 00:00:00 2001
From: ananyay <14322650+ananyeet@users.noreply.github.com>
Date: Mon, 13 Jul 2020 12:58:00 -0500
Subject: [PATCH 07/13] move around getActivityList and update comments.

---
 .../components/ViewActivities/activityfns.js  | 31 ----------
 .../ViewActivities/activityfns.test.js        |  1 +
 .../components/ViewActivities/activitylist.js | 57 +++++++++++++++++--
 3 files changed, 53 insertions(+), 36 deletions(-)

diff --git a/frontend/src/components/ViewActivities/activityfns.js b/frontend/src/components/ViewActivities/activityfns.js
index 5974786c..884a7edb 100644
--- a/frontend/src/components/ViewActivities/activityfns.js
+++ b/frontend/src/components/ViewActivities/activityfns.js
@@ -3,37 +3,6 @@ import app from '../Firebase';
 
 const db = app.firestore();
 
-/**
- * Gets the list of activities from the server. 
- * @param {string} tripId The trip ID.
- */
-export async function getActivityList(tripId) {
-  return new Promise(function(resolve, reject) {
-    let tripActivities = [];
-    
-    db.collection(DBFIELDS.COLLECTION_TRIPS).doc(tripId)
-    .collection(DBFIELDS.COLLECTION_ACTIVITIES).get()
-    .then(querySnapshot => {
-      querySnapshot.forEach(doc => {
-        let data = doc.data();
-        data['id'] = doc.id;
-        
-        // TODO: if start date != end date, split into 2 days. (#37)
-
-        // Eliminate nanoseconds, convert to milliseconds.
-        data[DBFIELDS.ACTIVITIES_START_TIME] =
-          data[DBFIELDS.ACTIVITIES_START_TIME]['seconds'] * 1000;         
-        data[DBFIELDS.ACTIVITIES_END_TIME] = 
-          data[DBFIELDS.ACTIVITIES_END_TIME]['seconds'] * 1000;
-
-        tripActivities.push(data);
-      })
-    }).catch(error => {
-      tripActivities = null;
-    }).then( () => resolve(tripActivities) );
-  })
-}
-
 /**
  * Sort a list of trip activities by date. 
  * @param {Array} tripActivities Array of activities.
diff --git a/frontend/src/components/ViewActivities/activityfns.test.js b/frontend/src/components/ViewActivities/activityfns.test.js
index a54eb8d3..7ab7b799 100644
--- a/frontend/src/components/ViewActivities/activityfns.test.js
+++ b/frontend/src/components/ViewActivities/activityfns.test.js
@@ -1,4 +1,5 @@
 import * as activityFns from './activityfns.js';
+import { getActivityList } from './activitylist.js';
 
 const ten = new Date(Date.UTC(2020, 4, 2, 10,  0));          // May 2, 2020 10:00
 const eleven = new Date(Date.UTC(2020, 4, 2, 11, 0));        // May 2, 2020 11:00
diff --git a/frontend/src/components/ViewActivities/activitylist.js b/frontend/src/components/ViewActivities/activitylist.js
index d33bb3f6..ad7985a7 100644
--- a/frontend/src/components/ViewActivities/activitylist.js
+++ b/frontend/src/components/ViewActivities/activitylist.js
@@ -3,17 +3,64 @@ import * as activityFns from './activityfns.js';
 import ActivityDay from './activityday.js';
 import '../../styles/activities.css';
 
+/**
+ * Gets the list of activities from the server. 
+ * 
+ * @param {string} tripId The trip ID.
+ */
+export async function getActivityList(tripId) {
+  return new Promise(function(resolve, reject) {
+    let tripActivities = [];
+    
+    db.collection(DBFIELDS.COLLECTION_TRIPS).doc(tripId)
+    .collection(DBFIELDS.COLLECTION_ACTIVITIES).get()
+    .then(querySnapshot => {
+      querySnapshot.forEach(doc => {
+        let data = doc.data();
+        data['id'] = doc.id;
+        
+        // TODO: if start date != end date, split into 2 days. (#37)
+
+        // Eliminate nanoseconds, convert to milliseconds.
+        data[DBFIELDS.ACTIVITIES_START_TIME] =
+          data[DBFIELDS.ACTIVITIES_START_TIME]['seconds'] * 1000;         
+        data[DBFIELDS.ACTIVITIES_END_TIME] = 
+          data[DBFIELDS.ACTIVITIES_END_TIME]['seconds'] * 1000;
+
+        tripActivities.push(data);
+      })
+    }).catch(error => {
+      console.log("It seems that an error has occured.");
+      tripActivities = null;
+    }).then( () => resolve(tripActivities) );
+  })
+}
+
 class ActivityList extends React.Component {
-  /** @inheritdoc */
+  /** 
+   * { @inheritdoc }
+   * 
+   * @param {Object} props This component expects the following props:
+   * - `tripId` The trip's ID.
+   */
   constructor(props) {
     super(props);
-    this.state = { days : [], tripId: props.tripId };
+    this.state = { days : [] };
   }
 
-  /** @inheritdoc */
+  /** 
+   * @inheritdoc
+   * Get sorted list of activities from the database. 
+   * 
+   * This function only queries the database if `this.state` is defined.
+   * `this.state` gains an entry with key `days` with the list of activities 
+   * sorted by date. 
+   * 
+   * This function also expects `this.props.tripId` to exist.
+   */
   async componentDidMount() {
-    if (this.state === null) { return; }
-    let tripActivities = await activityFns.getActivityList(this.state.tripId);
+    if (this.state === null || this.props.tripId === null) { return; }
+    let tripActivities = await getActivityList(this.props.tripId);
     if (tripActivities === null) {
       this.setState({days: null});  
       return;

From cd231139fe9e1b2b94b4c051eeea1c9ff4e07443 Mon Sep 17 00:00:00 2001
From: ananyay <14322650+ananyeet@users.noreply.github.com>
Date: Mon, 13 Jul 2020 13:01:37 -0500
Subject: [PATCH 08/13] update imports.

---
 .../components/ViewActivities/activityfns.js    | 13 +++++--------
 .../components/ViewActivities/activitylist.js   | 17 +++++++++++------
 2 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/frontend/src/components/ViewActivities/activityfns.js b/frontend/src/components/ViewActivities/activityfns.js
index 884a7edb..1a03e3eb 100644
--- a/frontend/src/components/ViewActivities/activityfns.js
+++ b/frontend/src/components/ViewActivities/activityfns.js
@@ -1,7 +1,4 @@
-import * as DBFIELDS from '../../constants/database.js';
-import app from '../Firebase';
-
-const db = app.firestore();
+import * as DB from '../../constants/database.js';
 
 /**
  * Sort a list of trip activities by date. 
@@ -12,7 +9,7 @@ const db = app.firestore();
 export function sortByDate(tripActivities) {
   let activities = new Map(); // { MM/DD/YYYY: [activities] }.
   for (let activity of tripActivities) {
-    const activityDate = new Date(activity[DBFIELDS.ACTIVITIES_START_TIME]);
+    const activityDate = new Date(activity[DB.ACTIVITIES_START_TIME]);
     const dateKey = activityDate.toLocaleDateString()
     if (activities.has(dateKey)) {
       activities.get(dateKey).add(activity);
@@ -33,11 +30,11 @@ export function sortByDate(tripActivities) {
  * @param {dictionary} b Dictionary representing activity b and its fields.
  */
 export function compareActivities(a, b) {
-  if (a[DBFIELDS.ACTIVITIES_START_TIME] < b[DBFIELDS.ACTIVITIES_START_TIME]) {
+  if (a[DB.ACTIVITIES_START_TIME] < b[DB.ACTIVITIES_START_TIME]) {
     return -1;
-  } else if (a[DBFIELDS.ACTIVITIES_START_TIME] > b[DBFIELDS.ACTIVITIES_START_TIME]) {
+  } else if (a[DB.ACTIVITIES_START_TIME] > b[DB.ACTIVITIES_START_TIME]) {
     return 1;
-  } else if (a[DBFIELDS.ACTIVITIES_END_TIME] > b[DBFIELDS.ACTIVITIES_END_TIME]) {
+  } else if (a[DB.ACTIVITIES_END_TIME] > b[DB.ACTIVITIES_END_TIME]) {
     return 1;
   }
   return -1;
diff --git a/frontend/src/components/ViewActivities/activitylist.js b/frontend/src/components/ViewActivities/activitylist.js
index ad7985a7..f910a473 100644
--- a/frontend/src/components/ViewActivities/activitylist.js
+++ b/frontend/src/components/ViewActivities/activitylist.js
@@ -2,6 +2,11 @@ import React from 'react';
 import * as activityFns from './activityfns.js';
 import ActivityDay from './activityday.js';
 import '../../styles/activities.css';
+import * as DB from '../../constants/database.js';
+import app from '../Firebase';
+
+const db = app.firestore();
+
 
 /**
  * Gets the list of activities from the server. 
@@ -12,8 +17,8 @@ export async function getActivityList(tripId) {
   return new Promise(function(resolve, reject) {
     let tripActivities = [];
     
-    db.collection(DBFIELDS.COLLECTION_TRIPS).doc(tripId)
-    .collection(DBFIELDS.COLLECTION_ACTIVITIES).get()
+    db.collection(DB.COLLECTION_TRIPS).doc(tripId)
+    .collection(DB.COLLECTION_ACTIVITIES).get()
     .then(querySnapshot => {
       querySnapshot.forEach(doc => {
         let data = doc.data();
@@ -22,10 +27,10 @@ export async function getActivityList(tripId) {
         // TODO: if start date != end date, split into 2 days. (#37)
 
         // Eliminate nanoseconds, convert to milliseconds.
-        data[DBFIELDS.ACTIVITIES_START_TIME] =
-          data[DBFIELDS.ACTIVITIES_START_TIME]['seconds'] * 1000;         
-        data[DBFIELDS.ACTIVITIES_END_TIME] = 
-          data[DBFIELDS.ACTIVITIES_END_TIME]['seconds'] * 1000;
+        data[DB.ACTIVITIES_START_TIME] =
+          data[DB.ACTIVITIES_START_TIME]['seconds'] * 1000;         
+        data[DB.ACTIVITIES_END_TIME] = 
+          data[DB.ACTIVITIES_END_TIME]['seconds'] * 1000;
 
         tripActivities.push(data);
       })

From 20d96c36f238eca187866a1e4dd0d6e6bc40c02f Mon Sep 17 00:00:00 2001
From: ananyay <14322650+ananyeet@users.noreply.github.com>
Date: Mon, 13 Jul 2020 13:10:14 -0500
Subject: [PATCH 09/13] update comments.

---
 .../src/components/ViewActivities/activity.js    |  6 ++++++
 .../src/components/ViewActivities/activityday.js |  7 +++++++
 .../components/ViewActivities/activitylist.js    | 16 +++++++++-------
 frontend/src/components/ViewActivities/index.js  |  7 ++++++-
 4 files changed, 28 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/ViewActivities/activity.js b/frontend/src/components/ViewActivities/activity.js
index 661d9f30..c1ea88c7 100644
--- a/frontend/src/components/ViewActivities/activity.js
+++ b/frontend/src/components/ViewActivities/activity.js
@@ -5,6 +5,12 @@ import * as DB from '../../constants/database.js'
 import '../../styles/activities.css';
 import Accordion from 'react-bootstrap/Accordion';
 
+/**
+ * A single activity. 
+ * 
+ * @param {Object} props This component expects the following props:
+ * - `activity` {Object} The activity to display.
+ */
 class Activity extends React.Component {
   /** @inheritdoc */
   render() {
diff --git a/frontend/src/components/ViewActivities/activityday.js b/frontend/src/components/ViewActivities/activityday.js
index ec5cd01e..415d42cc 100644
--- a/frontend/src/components/ViewActivities/activityday.js
+++ b/frontend/src/components/ViewActivities/activityday.js
@@ -3,6 +3,13 @@ import Activity from './activity.js';
 import * as activityFns from './activityfns.js';
 import * as time from '../Utils/time.js'
 
+/**
+ * One single day of activities. 
+ * 
+ * @param {Object} props This component expects the following props:
+ * - `activities` The list of activities for "today".
+ * - `date` The date, formatted as "MM/DD/YYYY".
+ */
 class ActivityDay extends React.Component {
   /** @inheritdoc */
   render() {
diff --git a/frontend/src/components/ViewActivities/activitylist.js b/frontend/src/components/ViewActivities/activitylist.js
index f910a473..8427d711 100644
--- a/frontend/src/components/ViewActivities/activitylist.js
+++ b/frontend/src/components/ViewActivities/activitylist.js
@@ -41,13 +41,14 @@ export async function getActivityList(tripId) {
   })
 }
 
+/**
+ * The list of activities. 
+ * 
+ * @param {Object} props This component expects the following props:
+ * - `tripId` {string} The trip's ID.  
+ */
 class ActivityList extends React.Component {
-  /** 
-   * { @inheritdoc }
-   * 
-   * @param {Object} props This component expects the following props:
-   * - `tripId` The trip's ID.
-   */
+  /** @inheritdoc */
   constructor(props) {
     super(props);
     this.state = { days : [] };
@@ -55,6 +56,7 @@ class ActivityList extends React.Component {
 
   /** 
    * @inheritdoc
+   * 
    * Get sorted list of activities from the database. 
    * 
    * This function only queries the database if `this.state` is defined.
@@ -78,7 +80,7 @@ class ActivityList extends React.Component {
     if (this.state === null) { return (<div></div>); }
     if (this.state.days === null) {
       return (<p className='activity-list'>An error has occurred :(</p> );
-    } else if (this.state.days.length == 0) {
+    } else if (this.state.days.length === 0) {
       return (<p className='activity-list'>Plan your trip here!</p>);
     }
     return (
diff --git a/frontend/src/components/ViewActivities/index.js b/frontend/src/components/ViewActivities/index.js
index b2f79295..bbcb2a55 100644
--- a/frontend/src/components/ViewActivities/index.js
+++ b/frontend/src/components/ViewActivities/index.js
@@ -1,8 +1,13 @@
 import React from 'react';
 import ActivityList from './activitylist.js';
 
+/**
+ * The whole view activities page.
+ * 
+ * @param {Object} props This component expects the following props:
+ * - `tripId` {string} The trip's ID. This is sent to the component through the URL. 
+ */
 class ViewActivities extends React.Component {
-  /** @inheritdoc */
   render() {
     return (
       <div className='activity-page'> 

From d82dccb45e609abe176fd3f1b34dbbe0610f49f0 Mon Sep 17 00:00:00 2001
From: ananyay <14322650+ananyeet@users.noreply.github.com>
Date: Tue, 14 Jul 2020 11:55:36 -0500
Subject: [PATCH 10/13] Fix activity index thingy

---
 frontend/src/components/ViewActivities/activityday.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/ViewActivities/activityday.js b/frontend/src/components/ViewActivities/activityday.js
index 415d42cc..faeb2b87 100644
--- a/frontend/src/components/ViewActivities/activityday.js
+++ b/frontend/src/components/ViewActivities/activityday.js
@@ -21,7 +21,7 @@ class ActivityDay extends React.Component {
       <div className='activity-day'>
         <h4>{time.timestampToDateFormatted(date.getTime())}</h4>
         {sortedActivities.map((activity, index) => (
-          <Activity activity={activity} key={index + id} className="activity"/>
+          <Activity activity={activity} key={index} className="activity"/>
         ))}
       </div>
     );

From f5a1e2c4fbd0a210a488b5457502ab97aa1bf859 Mon Sep 17 00:00:00 2001
From: ananyay <14322650+ananyeet@users.noreply.github.com>
Date: Tue, 14 Jul 2020 17:49:53 -0500
Subject: [PATCH 11/13] Remove type from documentation

---
 frontend/src/components/ViewActivities/activity.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/ViewActivities/activity.js b/frontend/src/components/ViewActivities/activity.js
index c1ea88c7..ea6e6fb9 100644
--- a/frontend/src/components/ViewActivities/activity.js
+++ b/frontend/src/components/ViewActivities/activity.js
@@ -9,7 +9,7 @@ import Accordion from 'react-bootstrap/Accordion';
  * A single activity. 
  * 
  * @param {Object} props This component expects the following props:
- * - `activity` {Object} The activity to display.
+ * - `activity` The activity to display.
  */
 class Activity extends React.Component {
   /** @inheritdoc */

From 70db450cb9910abb10b63835f6fb30f640548007 Mon Sep 17 00:00:00 2001
From: ananyay <14322650+ananyeet@users.noreply.github.com>
Date: Thu, 16 Jul 2020 13:06:42 -0500
Subject: [PATCH 12/13] return statements.

---
 frontend/src/components/Utils/time.js | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/Utils/time.js b/frontend/src/components/Utils/time.js
index 14f378db..d1d67a32 100644
--- a/frontend/src/components/Utils/time.js
+++ b/frontend/src/components/Utils/time.js
@@ -12,8 +12,7 @@ export function timestampToTimeFormatted(msTimestamp, timezone = 'America/New_Yo
     minute: '2-digit', 
     timeZone: timezone
   };
-  const formatted = date.toLocaleTimeString('en-US', formatOptions);
-  return formatted;
+  return date.toLocaleTimeString('en-US', formatOptions);;
 }
 
 /**
@@ -32,8 +31,7 @@ export function timestampToDateFormatted(msTimestamp, timezone='America/New_York
     day: 'numeric',  
     timeZone: timezone
   };
-  const formatted = date.toLocaleDateString('en-US', formatOptions);
-  return formatted;
+  return date.toLocaleDateString('en-US', formatOptions);
 }
 
 /** 
@@ -55,6 +53,5 @@ export function timestampToFormatted(msTimestamp, timezone = "America/New_York")
     minute: '2-digit', 
     timeZone: timezone
   };
-  let formatted = date.toLocaleString('en-US', formatOptions);
-  return formatted;
+  return date.toLocaleString('en-US', formatOptions);
 }

From b81ab7f9b82ae45897cefd5ee5cbc5e55dbd50c2 Mon Sep 17 00:00:00 2001
From: ananyay <14322650+ananyeet@users.noreply.github.com>
Date: Thu, 16 Jul 2020 13:08:16 -0500
Subject: [PATCH 13/13] tests pass for real this time.

---
 frontend/src/components/Utils/time.test.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/Utils/time.test.js b/frontend/src/components/Utils/time.test.js
index 729b519d..e399cb0f 100644
--- a/frontend/src/components/Utils/time.test.js
+++ b/frontend/src/components/Utils/time.test.js
@@ -1,7 +1,7 @@
-import * as utils from './utils';
+import * as utils from './time';
 
 const TZ_CHICAGO = 'America/Chicago';
-const TZ_SINGAPORE = ;
+const TZ_SINGAPORE = 'Asia/Singapore';
 
 test('new york date timestamp format', () => {
   // Month parameter is zero indexed so it's actually the 10th month.
@@ -51,8 +51,8 @@ test('other full timestamp format', () => {
   const testDate = new Date(Date.UTC(2020, 7, 23, 2, 3, 2, 4)).getTime();
   const expectedCentral = "Saturday, August 22, 2020, 9:03 PM";
   const expectedSingapore = "Sunday, August 23, 2020, 10:03 AM";
-  const actualCentral = utils.timestampToFormatted(testDate, "America/Chicago");
-  const actualSingapore = utils.timestampToFormatted(testDate, "Asia/Singapore");
+  const actualCentral = utils.timestampToFormatted(testDate, TZ_CHICAGO);
+  const actualSingapore = utils.timestampToFormatted(testDate, TZ_SINGAPORE);
   expect(actualCentral).toEqual(expectedCentral);
   expect(actualSingapore).toEqual(expectedSingapore);
 })