From 9e39a0b0201b1c2b40ece7dad87e0af4c409fd66 Mon Sep 17 00:00:00 2001
From: Phil Darnowsky <pdarnowsky@mbta.com>
Date: Thu, 30 Jan 2020 14:16:12 -0500
Subject: [PATCH] Render multi-day storm schedule dates correctly

It's possible for a storm schedule to span several days; however, to
this point, we were implicitly assuming that all storm schedules are one
day long and only showing the start date. Corrected for storm schedules
that span multiple days.
---
 apps/site/assets/ts/helpers/service.ts         | 12 ++++++++++--
 .../schedule/__tests__/ServiceSelectorTest.tsx | 18 +++++++++++++++++-
 .../__snapshots__/ServiceSelectorTest.tsx.snap |  8 +++++++-
 3 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/apps/site/assets/ts/helpers/service.ts b/apps/site/assets/ts/helpers/service.ts
index ad85027070..1a01c6fa12 100644
--- a/apps/site/assets/ts/helpers/service.ts
+++ b/apps/site/assets/ts/helpers/service.ts
@@ -45,6 +45,9 @@ export const groupByType = (
   return { ...acc, [currentServiceType]: updatedGroup };
 };
 
+const startToEnd = (startDateObject: Date, endDateObject: Date): string =>
+  `${formattedDate(startDateObject)} to ${formattedDate(endDateObject)}`;
+
 export const groupServiceByDate = (
   service: ServiceWithServiceDate,
   ratingEndDate: string
@@ -81,10 +84,15 @@ export const groupServiceByDate = (
         ? "current"
         : "future";
 
+    const stormServicePeriod =
+      startDate === endDate
+        ? formattedDate(startDateObject)
+        : startToEnd(startDateObject, endDateObject);
+
     return [
       {
         type,
-        servicePeriod: formattedDate(new Date(startDateObject)),
+        servicePeriod: stormServicePeriod,
         service
       }
     ];
@@ -133,7 +141,7 @@ export const serviceDate = (
       return `starts ${formattedDate(startDateObject)}`;
     }
   }
-  return `${formattedDate(startDateObject)} to ${formattedDate(endDateObject)}`;
+  return startToEnd(startDateObject, endDateObject);
 };
 
 type MonthInteger = number | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11;
diff --git a/apps/site/assets/ts/schedule/__tests__/ServiceSelectorTest.tsx b/apps/site/assets/ts/schedule/__tests__/ServiceSelectorTest.tsx
index 27ee7ef6e0..10c0f19964 100644
--- a/apps/site/assets/ts/schedule/__tests__/ServiceSelectorTest.tsx
+++ b/apps/site/assets/ts/schedule/__tests__/ServiceSelectorTest.tsx
@@ -103,11 +103,27 @@ const services: ServiceInSelector[] = [
     added_dates_notes: {},
     added_dates: [],
     "default_service?": false
+  },
+  {
+    valid_days: [1, 2, 3, 4, 5],
+    typicality: "unplanned_disruption",
+    type: "weekday",
+    start_date: "2019-07-22",
+    service_date: "2019-07-09",
+    removed_dates_notes: {},
+    removed_dates: [],
+    name: "Weekday",
+    id: "BUS319-storm-1",
+    end_date: "2019-07-23",
+    description: "Storm (reduced service)",
+    added_dates_notes: {},
+    added_dates: [],
+    "default_service?": false
   }
 ];
 
 describe("ServiceSelector", () => {
-  it("it renders", () => {
+  it("renders", () => {
     createReactRoot();
     const tree = renderer.create(
       <ServiceSelector
diff --git a/apps/site/assets/ts/schedule/__tests__/__snapshots__/ServiceSelectorTest.tsx.snap b/apps/site/assets/ts/schedule/__tests__/__snapshots__/ServiceSelectorTest.tsx.snap
index 30a2829ac2..f30e3702ce 100644
--- a/apps/site/assets/ts/schedule/__tests__/__snapshots__/ServiceSelectorTest.tsx.snap
+++ b/apps/site/assets/ts/schedule/__tests__/__snapshots__/ServiceSelectorTest.tsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`ServiceSelector it renders 1`] = `
+exports[`ServiceSelector renders 1`] = `
 Array [
   <h3>
     Daily Schedule
@@ -72,6 +72,12 @@ Array [
             Storm service, 
             July 15
           </option>
+          <option
+            value="BUS319-storm-1"
+          >
+            Storm service, 
+            July 22 to July 23
+          </option>
         </optgroup>
       </select>
       <span