tweak: Move turn by turn directions in side panel

mbta · Nov 26, 2024 · dbf1345 · dbf1345
1 parent 70c3a07
commit dbf1345
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 22 deletions.
diff --git a/assets/src/components/detours/detourPanels/activeDetourPanel.tsx b/assets/src/components/detours/detourPanels/activeDetourPanel.tsx
@@ -80,12 +80,6 @@ export const ActiveDetourPanel = ({
             routeDirection={routeDirection}
           />
 
-          {connectionPoints && (
-            <ConnectionPoints connectionPoints={connectionPoints} />
-          )}
-
-          {missedStops && <MissedStops missedStops={missedStops} />}
-
           <section className="pb-3">
             <h2 className="c-diversion-panel__h2">Detour Directions</h2>
             {directions ? (
@@ -102,6 +96,12 @@ export const ActiveDetourPanel = ({
               </ListGroup>
             ) : null}
           </section>
+
+          {connectionPoints && (
+            <ConnectionPoints connectionPoints={connectionPoints} />
+          )}
+
+          {missedStops && <MissedStops missedStops={missedStops} />}
         </Panel.Body.ScrollArea>
 
         <Panel.Body.Footer>

diff --git a/assets/src/components/detours/detourPanels/pastDetourPanel.tsx b/assets/src/components/detours/detourPanels/pastDetourPanel.tsx
@@ -65,12 +65,6 @@ export const PastDetourPanel = ({
           routeDirection={routeDirection}
         />
 
-        {connectionPoints && (
-          <ConnectionPoints connectionPoints={connectionPoints} />
-        )}
-
-        {missedStops && <MissedStops missedStops={missedStops} />}
-
         <section className="pb-3">
           <h2 className="c-diversion-panel__h2">Detour Directions</h2>
           {directions ? (
@@ -87,6 +81,12 @@ export const PastDetourPanel = ({
             </ListGroup>
           ) : null}
         </section>
+
+        {connectionPoints && (
+          <ConnectionPoints connectionPoints={connectionPoints} />
+        )}
+
+        {missedStops && <MissedStops missedStops={missedStops} />}
       </Panel.Body.ScrollArea>
     </Panel.Body>
   </Panel>

diff --git a/assets/src/components/detours/diversionPage.tsx b/assets/src/components/detours/diversionPage.tsx
@@ -143,15 +143,15 @@ export const DiversionPage = ({
     `Detour ${routeName} ${routeDirection}`,
     routeOrigin,
     ,
+    "Turn-by-Turn Directions:",
+    ...(extendedDirections?.map((v) => v.instruction) ?? []),
+    ,
     "Connection Points:",
     connectionPoints?.start?.name ?? "N/A",
     connectionPoints?.end?.name ?? "N/A",
     ,
     `Missed Stops (${missedStops?.length}):`,
     ...(missedStops?.map(({ name }) => name) ?? ["no stops"]),
-    ,
-    "Turn-by-Turn Directions:",
-    ...(extendedDirections?.map((v) => v.instruction) ?? []),
   ].join("\n")
 
   const routes = useContext(RoutesContext)

diff --git a/assets/tests/components/detours/diversionPage.test.tsx b/assets/tests/components/detours/diversionPage.test.tsx
@@ -1291,19 +1291,19 @@ describe("DiversionPage", () => {
           `Detour ${routeName} ${routeDirection}`,
           routeOrigin,
           ,
-          "Connection Points:",
-          start.name,
-          end.name,
-          ,
-          `Missed Stops (${stops.length}):`,
-          ...stops.map(({ name }) => name),
-          ,
           "Turn-by-Turn Directions:",
           "From Avenue 1 & Street 2",
           "Turn left on Main Street",
           "Turn right on High Street",
           "Turn sharp right on Broadway",
           "Regular Route",
+          ,
+          "Connection Points:",
+          start.name,
+          end.name,
+          ,
+          `Missed Stops (${stops.length}):`,
+          ...stops.map(({ name }) => name),
         ].join("\n")
       )
     )