Jdl/upcoming departures playground

assets/ts/schedule/components/ScheduleFinder.tsx

@@ -1,5 +1,5 @@
 import React, { ReactElement } from "react";
-import { useDispatch, useSelector } from "react-redux";
+import { useSelector } from "react-redux";
 import { Dispatch } from "redux";
 import { Route, DirectionId } from "../../__v3api";
 import {
@@ -44,43 +44,18 @@ const ScheduleFinder = ({
   scheduleNote,
   hasServiceToday
 }: Props): ReactElement<HTMLElement> => {
-  const dispatch = useDispatch();
   const { modalOpen, selectedOrigin } = useSelector(
     (state: StoreProps) => state
   );
 
   const currentDirection = useDirectionChangeEvent(directionId);
-  const openOriginModal = (): void => {
-    if (!modalOpen) {
-      dispatch({
-        type: "OPEN_MODAL",
-        newStoreValues: {
-          modalMode: "origin"
-        }
-      });
-    }
-  };
 
   const openScheduleModal = (): void => {
     if (selectedOrigin !== undefined && !modalOpen) {
-      dispatch({
-        type: "OPEN_MODAL",
-        newStoreValues: {
-          modalMode: "schedule"
-        }
-      });
+      document.location.href = `/departures/?route_id=${route.id}&direction_id=${directionId}&stop_id=${selectedOrigin}`;
     }
   };
 
-  const handleOriginSelectClick = (): void => {
-    dispatch({
-      type: "OPEN_MODAL",
-      newStoreValues: {
-        modalMode: "origin"
-      }
-    });
-  };
-
   const isFerryRoute = routeToModeName(route) === "ferry";
 
   return (
@@ -92,7 +67,6 @@ const ScheduleFinder = ({
       <ScheduleFinderForm
         onDirectionChange={changeDirection}
         onOriginChange={changeOrigin}
-        onOriginSelectClick={openOriginModal}
         onSubmit={openScheduleModal}
         route={route}
         selectedDirection={currentDirection}
@@ -104,7 +78,6 @@ const ScheduleFinder = ({
           closeModal={closeModal}
           directionChanged={changeDirection}
           initialDirection={currentDirection}
-          handleOriginSelectClick={handleOriginSelectClick}
           originChanged={changeOrigin}
           route={route}
           routePatternsByDirection={routePatternsByDirection}

assets/ts/schedule/components/SchedulePage.tsx

@@ -57,13 +57,6 @@ export const changeOrigin = (
       selectedOrigin: origin
     }
   });
-  // reopen modal depending on choice:
-  dispatch({
-    type: "OPEN_MODAL",
-    newStoreValues: {
-      modalMode: origin ? "schedule" : "origin"
-    }
-  });
 };
 
 export const changeDirection = (
@@ -88,15 +81,6 @@ const closeModal = (dispatch: Dispatch): void => {
   updateURL("");
 };
 
-export const handleOriginSelectClick = (dispatch: Dispatch): void => {
-  dispatch({
-    type: "OPEN_MODAL",
-    newStoreValues: {
-      modalMode: "origin"
-    }
-  });
-};
-
 const getDirectionAndMap = (
   schedulePageData: SchedulePageData,
   mapData: MapData,
@@ -239,7 +223,6 @@ const ScheduleNote = ({
           closeModal={closeModal}
           directionChanged={changeDirection}
           initialDirection={currentDirection}
-          handleOriginSelectClick={handleOriginSelectClick}
           originChanged={changeOrigin}
           route={route}
           routePatternsByDirection={routePatternsByDirection}

assets/ts/schedule/components/__tests__/ScheduleFinderTest.tsx

@@ -256,47 +256,5 @@ describe("ScheduleFinder", () => {
     expect(lastSelectedOriginElement.selected).toBeFalse();
   });
 
-  it("Opens the origin modal when clicking on the origin drop-down in the schedule modal", async () => {
-    const user = userEvent.setup();
-    const dispatchSpy = jest.fn();
-    jest.spyOn(reactRedux, "useDispatch").mockImplementation(() => dispatchSpy);
-
-    renderWithProviders(
-      <ScheduleFinder
-        route={route}
-        stops={stops}
-        directionId={0}
-        services={services}
-        routePatternsByDirection={routePatternsByDirection}
-        today={today}
-        updateURL={() => {}}
-        changeDirection={() => {}}
-        changeOrigin={() => {}}
-        closeModal={() => {}}
-        scheduleNote={null}
-        hasServiceToday={true}
-      />,
-      {
-        preloadedState: {
-          modalOpen: true,
-          selectedOrigin: "123",
-          modalMode: "schedule"
-        }
-      }
-    );
-
-    // select the last node (i.e. origin drop-down) and choose an option
-    const scheduleFinderModal = screen.getByLabelText(/Schedules on the.*/);
-    const originSelectElement = within(scheduleFinderModal).getByTestId(
-      "schedule-finder-origin-select"
-    );
-    await user.click(originSelectElement);
-
-    expect(dispatchSpy).toHaveBeenCalledWith({
-      type: "OPEN_MODAL",
-      newStoreValues: {
-        modalMode: "origin"
-      }
-    });
-  });
+
 });

assets/ts/schedule/components/__tests__/SchedulePageTest.tsx

@@ -11,8 +11,7 @@ import { MapData, StaticMapData } from "../../../leaflet/components/__mapdata";
 import {
   SchedulePage,
   changeOrigin,
-  changeDirection,
-  handleOriginSelectClick
+  changeDirection
 } from "../SchedulePage";
 import * as schedulePage from "../SchedulePage";
 import * as routePatternsByDirectionData from "./test-data/routePatternsByDirectionData.json";
@@ -575,65 +574,9 @@ describe("SchedulePage", () => {
 
     await user.click(originSelect);
 
-    expect(dispatchSpy).toHaveBeenCalledTimes(2);
+    expect(dispatchSpy).toHaveBeenCalledTimes(1);
   });
 
-  it("Opens the origin modal", async () => {
-    const user = userEvent.setup();
-    const dispatchSpy = jest.fn();
-    jest.spyOn(reactRedux, "useDispatch").mockImplementation(() => {
-      return dispatchSpy;
-    });
-    renderWithProviders(
-      <SchedulePage
-        mapData={mapData}
-        noBranches={false}
-        schedulePageData={{
-          schedule_note: null,
-          connections: [],
-          fares,
-          fare_link: fareLink, // eslint-disable-line camelcase
-          hours,
-          holidays,
-          pdfs,
-          teasers,
-          route,
-          services,
-          stops,
-          direction_id: 0,
-          route_patterns: routePatternsByDirection,
-          today: "2019-12-05",
-          stop_tree: stopTreeData,
-          route_stop_lists: [testRouteStopList],
-          alerts: [],
-          "service_today?": true,
-          variant: null
-        }}
-      />
-    );
-
-    jest.spyOn(reactRedux, "useSelector").mockImplementation(() => {
-      return {
-        selectedDirection: 0,
-        selectedOrigin: "place-welln",
-        modalMode: "origin",
-        modalOpen: false
-      };
-    });
-
-    const buttons = screen.getAllByRole("button");
-    expect(buttons.length).toBeGreaterThan(1);
-
-    await user.click(buttons[1]);
-
-    // first call is with INITIALIZE
-    expect(dispatchSpy).toHaveBeenNthCalledWith(2, {
-      type: "OPEN_MODAL",
-      newStoreValues: {
-        modalMode: "origin"
-      }
-    });
-  });
 
   it("Closes the schedule modal", async () => {
     const user = userEvent.setup();
@@ -732,96 +675,6 @@ describe("SchedulePage", () => {
     );
   });
 
-  it("Opens the origin modal when clicking on the origin drop-down in the schedule modal", async () => {
-    const user = userEvent.setup();
-    const changeOriginSpy = jest.spyOn(schedulePage, "handleOriginSelectClick");
-
-    renderWithProviders(
-      <SchedulePage
-        mapData={mapData}
-        noBranches={false}
-        schedulePageData={{
-          schedule_note: scheduleNoteData,
-          connections: [],
-          fares,
-          fare_link: fareLink, // eslint-disable-line camelcase
-          hours,
-          holidays,
-          pdfs,
-          teasers,
-          route,
-          services,
-          stops,
-          direction_id: 0,
-          route_patterns: routePatternsByDirection,
-          today: "2019-12-05",
-          stop_tree: stopTreeData,
-          route_stop_lists: [testRouteStopList],
-          alerts: [],
-          "service_today?": true,
-          variant: null
-        }}
-      />,
-      {
-        preloadedState: {
-          selectedDirection: 0,
-          selectedOrigin: "place-welln",
-          modalMode: "schedule",
-          modalOpen: true
-        }
-      }
-    );
-    const originSelect = await waitFor(() =>
-      screen.getByTestId("schedule-finder-origin-select")
-    );
-
-    await user.click(originSelect);
-
-    await waitFor(() =>
-      expect(changeOriginSpy).toHaveBeenCalledWith(expect.any(Function))
-    );
-  });
-
-  it("Changes the origin", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(
-      <SchedulePage
-        mapData={mapData}
-        noBranches={false}
-        schedulePageData={{
-          schedule_note: null,
-          connections: [],
-          fares,
-          fare_link: fareLink, // eslint-disable-line camelcase
-          hours,
-          holidays,
-          pdfs,
-          teasers,
-          route,
-          services,
-          stops,
-          direction_id: 0,
-          route_patterns: routePatternsByDirection,
-          today: "2019-12-05",
-          stop_tree: stopTreeData,
-          route_stop_lists: [testRouteStopList],
-          alerts: [],
-          "service_today?": true,
-          variant: null
-        }}
-      />
-    );
-
-    const dispatchSpy = jest.fn();
-    jest.spyOn(reactRedux, "useDispatch").mockImplementation(() => {
-      return dispatchSpy;
-    });
-    const originSelect = screen.getByTestId("schedule-finder-origin-select");
-    await user.selectOptions(originSelect, "123");
-
-    expect(dispatchSpy).toHaveBeenCalledTimes(2);
-  });
-
   it("Checks if it is a unidirectional route", () => {
     const dispatchSpy = jest.fn();
     jest.spyOn(reactRedux, "useDispatch").mockImplementation(() => {
@@ -959,7 +812,7 @@ describe("SchedulePage", () => {
   });
 
   describe("changeOrigin", () => {
-    it("should call the dispatch function twice", () => {
+    it("should call the dispatch function once", () => {
       const dispatchSpy = jest.fn();
       const testOrigin = "test-origin";
       changeOrigin(testOrigin, dispatchSpy);
@@ -969,12 +822,6 @@ describe("SchedulePage", () => {
           selectedOrigin: testOrigin
         }
       });
-      expect(dispatchSpy).toHaveBeenCalledWith({
-        type: "OPEN_MODAL",
-        newStoreValues: {
-          modalMode: "schedule"
-        }
-      });
     });
   });
 
@@ -993,16 +840,4 @@ describe("SchedulePage", () => {
     });
   });
 
-  describe("handleOriginSelectClick", () => {
-    it("should call the dispatch function setting the new direction in the state", () => {
-      const dispatchSpy = jest.fn();
-      handleOriginSelectClick(dispatchSpy);
-      expect(dispatchSpy).toHaveBeenCalledWith({
-        type: "OPEN_MODAL",
-        newStoreValues: {
-          modalMode: "origin"
-        }
-      });
-    });
-  });
 });