Merge pull request #5173 from HSLdevcom/DT-6552

DT-6552 Ability to pass explicit itinerary for ItineraryPageMap
HSLdevcom · Nov 22, 2024 · 4647033 · 4647033
2 parents d564555 + da135f2
commit 4647033
Show file tree

Hide file tree

Showing 6 changed files with 213 additions and 155 deletions.
diff --git a/app/component/itinerary/ItineraryPage.js b/app/component/itinerary/ItineraryPage.js
@@ -74,9 +74,9 @@ import {
   updateClient,
 } from './ItineraryPageUtils';
 import ItineraryTabs from './ItineraryTabs';
+import planConnection from './PlanConnection';
 import NaviContainer from './navigator/NaviContainer';
 import NavigatorIntroModal from './navigator/navigatorintro/NavigatorIntroModal';
-import planConnection from './PlanConnection';
 
 const MAX_QUERY_COUNT = 4; // number of attempts to collect enough itineraries
 
@@ -151,6 +151,9 @@ export default function ItineraryPage(props, context) {
   const [topicsState, setTopicsState] = useState(null);
   const [mapState, setMapState] = useState({});
   const [naviMode, setNaviMode] = useState(false);
+  const [storedItinerary, setStoredItinerary] = useState(
+    getLatestNavigatorItinerary(),
+  );
 
   const { config, router } = context;
   const { match, breakpoint } = props;
@@ -657,7 +660,7 @@ export default function ItineraryPage(props, context) {
 
   const storeItineraryAndStartNavigation = itinerary => {
     setNavigation(true);
-    setLatestNavigatorItinerary({
+    const itineraryWithParams = {
       itinerary,
       params: {
         from: params.from,
@@ -667,7 +670,9 @@ export default function ItineraryPage(props, context) {
         hash,
         secondHash,
       },
-    });
+    };
+    setLatestNavigatorItinerary(itineraryWithParams);
+    setStoredItinerary(itineraryWithParams);
   };
 
   // save url-defined location to old searches
@@ -761,7 +766,6 @@ export default function ItineraryPage(props, context) {
     updateLocalStorage(true);
     addFeedbackly(context);
 
-    const storedItinerary = getLatestNavigatorItinerary();
     if (isStoredItineraryRelevant(storedItinerary, match)) {
       setNavigation(true);
     } else {
@@ -1036,6 +1040,12 @@ export default function ItineraryPage(props, context) {
       itineraryContainsDepartureFromVehicleRentalStation,
       planEdges?.[activeIndex]?.node,
     );
+
+    const explicitItinerary =
+      !!detailView && naviMode && !!storedItinerary.itinerary
+        ? storedItinerary.itinerary
+        : undefined;
+
     return (
       <ItineraryPageMap
         {...mwtProps}
@@ -1049,10 +1059,11 @@ export default function ItineraryPage(props, context) {
         planEdges={planEdges}
         topics={topicsState}
         active={activeIndex}
-        showActive={!!detailView}
+        showActiveOnly={!!detailView}
         showVehicles={showVehicles()}
         showDurationBubble={planEdges?.[0]?.node.legs?.length === 1}
         objectsToHide={objectsToHide}
+        itinerary={explicitItinerary}
       />
     );
   }
@@ -1152,9 +1163,8 @@ export default function ItineraryPage(props, context) {
     );
   } else if (detailView) {
     if (naviMode) {
-      const { itinerary: storedItinerary } = getLatestNavigatorItinerary();
       const itineraryForNavigator =
-        storedItinerary || combinedEdges[selectedIndex]?.node;
+        storedItinerary.itinerary || combinedEdges[selectedIndex]?.node;
 
       content = (
         <>

diff --git a/app/component/itinerary/PlanConnection.js b/app/component/itinerary/PlanConnection.js
@@ -65,23 +65,31 @@ const planConnection = graphql`
             co2
           }
           legs {
-            ...ItineraryLine_legs
+            legId: id
             mode
+            rentedBike
+            duration
             distance
             transitLeg
-            legId: id
             interlineWithPreviousLeg
+            headsign
+            realtimeState
             intermediatePlaces {
               arrival {
                 scheduledTime
                 estimated {
                   time
                 }
               }
+              stop {
+                gtfsId
+                lat
+                lon
+                name
+                code
+                platformCode
+              }
             }
-            duration
-            headsign
-            realtimeState
             start {
               scheduledTime
               estimated {
@@ -101,17 +109,32 @@ const planConnection = graphql`
               shortName
               color
               gtfsId
+              type
+              agency {
+                name
+              }
             }
             trip {
               gtfsId
               directionId
               stoptimesForDate {
+                stop {
+                  gtfsId
+                }
                 scheduledDeparture
               }
+              stoptimes {
+                stop {
+                  gtfsId
+                }
+                pickupType
+              }
             }
             from {
               lat
               lon
+              name
+              vertexType
               stop {
                 gtfsId
                 name
@@ -126,6 +149,8 @@ const planConnection = graphql`
                 }
               }
               vehicleRentalStation {
+                lat
+                lon
                 stationId
                 name
                 rentalNetwork {
@@ -137,12 +162,16 @@ const planConnection = graphql`
               }
               rentalVehicle {
                 vehicleId
+                rentalNetwork {
+                  networkId
+                }
               }
             }
             to {
               lat
               lon
               name
+              vertexType
               stop {
                 gtfsId
                 name
@@ -161,6 +190,9 @@ const planConnection = graphql`
                 name
               }
               vehicleRentalStation {
+                lat
+                lon
+                stationId
                 name
                 rentalNetwork {
                   networkId

diff --git a/app/component/itinerary/navigator/NaviContainer.js b/app/component/itinerary/navigator/NaviContainer.js
@@ -48,7 +48,7 @@ function NaviContainer(
         }
         time={time}
         position={position}
-      />{' '}
+      />
       <NaviBottom setNavigation={setNavigation} arrival={arrivalTime} />
     </>
   );

diff --git a/app/component/map/ItineraryLine.js b/app/component/map/ItineraryLine.js
@@ -1,25 +1,24 @@
 import PropTypes from 'prop-types';
 /* eslint-disable react/no-array-index-key */
 
-import React from 'react';
-import { createFragmentContainer, graphql } from 'react-relay';
 import polyUtil from 'polyline-encoded';
+import React from 'react';
 import { intlShape } from 'react-intl';
-import { configShape, legShape } from '../../util/shapes';
-import { getRouteMode } from '../../util/modeUtils';
-import StopMarker from './non-tile-layer/StopMarker';
-import Line from './Line';
-import VehicleMarker from './non-tile-layer/VehicleMarker';
-import { getMiddleOf } from '../../util/geo-utils';
 import { isBrowser } from '../../util/browser';
+import { getMiddleOf } from '../../util/geo-utils';
 import {
-  isCallAgencyPickupType,
-  getLegText,
   getInterliningLegs,
+  getLegText,
+  isCallAgencyPickupType,
 } from '../../util/legUtils';
-import SpeechBubble from './SpeechBubble';
+import { getRouteMode } from '../../util/modeUtils';
+import { configShape, legShape } from '../../util/shapes';
 import { durationToString } from '../../util/timeUtils';
+import Line from './Line';
+import StopMarker from './non-tile-layer/StopMarker';
 import TransitLegMarkers from './non-tile-layer/TransitLegMarkers';
+import VehicleMarker from './non-tile-layer/VehicleMarker';
+import SpeechBubble from './SpeechBubble';
 
 class ItineraryLine extends React.Component {
   static contextTypes = {
@@ -243,107 +242,4 @@ class ItineraryLine extends React.Component {
   }
 }
 
-export default createFragmentContainer(ItineraryLine, {
-  legs: graphql`
-    fragment ItineraryLine_legs on Leg @relay(plural: true) {
-      mode
-      rentedBike
-      start {
-        scheduledTime
-        estimated {
-          time
-        }
-      }
-      end {
-        scheduledTime
-        estimated {
-          time
-        }
-      }
-      duration
-      distance
-      legGeometry {
-        points
-      }
-      transitLeg
-      interlineWithPreviousLeg
-      route {
-        gtfsId
-        shortName
-        color
-        type
-        agency {
-          name
-        }
-      }
-      from {
-        lat
-        lon
-        name
-        vertexType
-        vehicleRentalStation {
-          lat
-          lon
-          stationId
-          rentalNetwork {
-            networkId
-          }
-          availableVehicles {
-            total
-          }
-        }
-        rentalVehicle {
-          vehicleId
-          rentalNetwork {
-            networkId
-          }
-        }
-        stop {
-          gtfsId
-          code
-          platformCode
-        }
-      }
-      to {
-        lat
-        lon
-        name
-        vertexType
-        vehicleRentalStation {
-          lat
-          lon
-          stationId
-          rentalNetwork {
-            networkId
-          }
-          availableVehicles {
-            total
-          }
-        }
-        stop {
-          gtfsId
-          code
-          platformCode
-        }
-      }
-      trip {
-        stoptimes {
-          stop {
-            gtfsId
-          }
-          pickupType
-        }
-      }
-      intermediatePlaces {
-        stop {
-          gtfsId
-          lat
-          lon
-          name
-          code
-          platformCode
-        }
-      }
-    }
-  `,
-});
+export default ItineraryLine;
-Original file line number
+Diff line change
@@ Expand Up / @@ -48,7 +48,7 @@ function NaviContainer( @@
             }
             time={time}
             position={position}
-          />{' '}
+          />
           <NaviBottom setNavigation={setNavigation} arrival={arrivalTime} />
         </>
       );
@@ Expand Down @@