From 259009b489aeb89524c89f0b60ecd0e66b332f8b Mon Sep 17 00:00:00 2001
From: Kayla Firestack <kfirestack@mbta.com>
Date: Fri, 24 Jan 2025 09:16:55 -0500
Subject: [PATCH] fix(ts/routeLadder): show dropdown on mobile breakpoint

---
 assets/src/components/routeLadder.tsx         |  2 +-
 .../__snapshots__/ladderPage.test.tsx.snap    | 14 ++++++------
 .../__snapshots__/minimalLadder.test.tsx.snap |  4 ++--
 .../__snapshots__/routeLadder.test.tsx.snap   | 22 +++++++++----------
 .../__snapshots__/routeLadders.test.tsx.snap  |  4 ++--
 5 files changed, 23 insertions(+), 23 deletions(-)

diff --git a/assets/src/components/routeLadder.tsx b/assets/src/components/routeLadder.tsx
index 1c650b674..0aefad50b 100644
--- a/assets/src/components/routeLadder.tsx
+++ b/assets/src/components/routeLadder.tsx
@@ -85,7 +85,7 @@ export const Header = ({
         >
           <Dropdown className="border-box inherit-box">
             <Dropdown.Toggle
-              className="c-route-ladder__dropdown-button d-none d-sm-flex"
+              className="c-route-ladder__dropdown-button d-flex"
               aria-labelledby={joinTruthy([routePillId, routeOptionsToggleId])}
             >
               <ThreeDotsVertical />
diff --git a/assets/tests/components/__snapshots__/ladderPage.test.tsx.snap b/assets/tests/components/__snapshots__/ladderPage.test.tsx.snap
index 044e2cafa..6d6a774f2 100644
--- a/assets/tests/components/__snapshots__/ladderPage.test.tsx.snap
+++ b/assets/tests/components/__snapshots__/ladderPage.test.tsx.snap
@@ -304,7 +304,7 @@ exports[`LadderPage renders with alerts 1`] = `
                 <button
                   aria-expanded="false"
                   aria-labelledby="route-pill:r17: route-options-toggle:r18:"
-                  class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                  class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                   id="react-aria-:r19:"
                   type="button"
                 >
@@ -377,7 +377,7 @@ exports[`LadderPage renders with alerts 1`] = `
                 <button
                   aria-expanded="false"
                   aria-labelledby="route-pill:r1a: route-options-toggle:r1b:"
-                  class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                  class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                   id="react-aria-:r1c:"
                   type="button"
                 >
@@ -677,7 +677,7 @@ exports[`LadderPage renders with route tabs 1`] = `
                 <button
                   aria-expanded="false"
                   aria-labelledby="route-pill:r0: route-options-toggle:r1:"
-                  class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                  class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                   id="react-aria-:r2:"
                   type="button"
                 >
@@ -929,7 +929,7 @@ exports[`LadderPage renders with selectedRoutes in different order than routes d
                 <button
                   aria-expanded="false"
                   aria-labelledby="route-pill:rr: route-options-toggle:rs:"
-                  class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                  class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                   id="react-aria-:rt:"
                   type="button"
                 >
@@ -1002,7 +1002,7 @@ exports[`LadderPage renders with selectedRoutes in different order than routes d
                 <button
                   aria-expanded="false"
                   aria-labelledby="route-pill:ru: route-options-toggle:rv:"
-                  class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                  class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                   id="react-aria-:r10:"
                   type="button"
                 >
@@ -1254,7 +1254,7 @@ exports[`LadderPage renders with timepoints 1`] = `
                 <button
                   aria-expanded="false"
                   aria-labelledby="route-pill:r11: route-options-toggle:r12:"
-                  class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                  class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                   id="react-aria-:r13:"
                   type="button"
                 >
@@ -1445,7 +1445,7 @@ exports[`LadderPage renders with timepoints 1`] = `
                 <button
                   aria-expanded="false"
                   aria-labelledby="route-pill:r14: route-options-toggle:r15:"
-                  class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                  class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                   id="react-aria-:r16:"
                   type="button"
                 >
diff --git a/assets/tests/components/__snapshots__/minimalLadder.test.tsx.snap b/assets/tests/components/__snapshots__/minimalLadder.test.tsx.snap
index 625457044..c8f00bade 100644
--- a/assets/tests/components/__snapshots__/minimalLadder.test.tsx.snap
+++ b/assets/tests/components/__snapshots__/minimalLadder.test.tsx.snap
@@ -24,7 +24,7 @@ exports[`MinimalLadders renders route ladders 1`] = `
               <button
                 aria-expanded="false"
                 aria-labelledby="route-pill:r0: route-options-toggle:r1:"
-                class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                 id="react-aria-:r2:"
                 type="button"
               >
@@ -215,7 +215,7 @@ exports[`MinimalLadders renders route ladders 1`] = `
               <button
                 aria-expanded="false"
                 aria-labelledby="route-pill:r3: route-options-toggle:r4:"
-                class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+                class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
                 id="react-aria-:r5:"
                 type="button"
               >
diff --git a/assets/tests/components/__snapshots__/routeLadder.test.tsx.snap b/assets/tests/components/__snapshots__/routeLadder.test.tsx.snap
index da1a21dbc..01ada2517 100644
--- a/assets/tests/components/__snapshots__/routeLadder.test.tsx.snap
+++ b/assets/tests/components/__snapshots__/routeLadder.test.tsx.snap
@@ -17,7 +17,7 @@ exports[`routeLadder displays loading if we are fetching the timepoints 1`] = `
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:r1a: route-options-toggle:r1b:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:r1c:"
             type="button"
           >
@@ -95,7 +95,7 @@ exports[`routeLadder displays no crowding data for a bus coming off a route with
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:r14: route-options-toggle:r15:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:r16:"
             type="button"
           >
@@ -396,7 +396,7 @@ exports[`routeLadder doesn't display crowding data for a vehicle coming off a ro
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:r17: route-options-toggle:r18:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:r19:"
             type="button"
           >
@@ -640,7 +640,7 @@ exports[`routeLadder doesn't render a bus that's off-course but nonrevenue 1`] =
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:r11: route-options-toggle:r12:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:r13:"
             type="button"
           >
@@ -851,7 +851,7 @@ exports[`routeLadder renders a route ladder 1`] = `
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:r0: route-options-toggle:r1:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:r2:"
             type="button"
           >
@@ -1020,7 +1020,7 @@ exports[`routeLadder renders a route ladder with crowding instead of vehicles 1`
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:ru: route-options-toggle:rv:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:r10:"
             type="button"
           >
@@ -1325,7 +1325,7 @@ exports[`routeLadder renders a route ladder with laying over vehicles 1`] = `
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:rr: route-options-toggle:rs:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:rt:"
             type="button"
           >
@@ -1569,7 +1569,7 @@ exports[`routeLadder renders a route ladder with the new header and detour dropd
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:r6: route-options-toggle:r7:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:r8:"
             type="button"
           >
@@ -1738,7 +1738,7 @@ exports[`routeLadder renders a route ladder with the new header format 1`] = `
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:r3: route-options-toggle:r4:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:r5:"
             type="button"
           >
@@ -1907,7 +1907,7 @@ exports[`routeLadder renders a route ladder with vehicles 1`] = `
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:rl: route-options-toggle:rm:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:rn:"
             type="button"
           >
@@ -2243,7 +2243,7 @@ exports[`routeLadder renders a route ladder with vehicles in the incoming box 1`
           <button
             aria-expanded="false"
             aria-labelledby="route-pill:ro: route-options-toggle:rp:"
-            class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+            class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
             id="react-aria-:rq:"
             type="button"
           >
diff --git a/assets/tests/components/__snapshots__/routeLadders.test.tsx.snap b/assets/tests/components/__snapshots__/routeLadders.test.tsx.snap
index 8ec91a702..ca184889b 100644
--- a/assets/tests/components/__snapshots__/routeLadders.test.tsx.snap
+++ b/assets/tests/components/__snapshots__/routeLadders.test.tsx.snap
@@ -21,7 +21,7 @@ exports[`RouteLadders renders a route ladder 1`] = `
             <button
               aria-expanded="false"
               aria-labelledby="route-pill:r0: route-options-toggle:r1:"
-              class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+              class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
               id="react-aria-:r2:"
               type="button"
             >
@@ -212,7 +212,7 @@ exports[`RouteLadders renders a route ladder 1`] = `
             <button
               aria-expanded="false"
               aria-labelledby="route-pill:r3: route-options-toggle:r4:"
-              class="c-route-ladder__dropdown-button d-none d-sm-flex dropdown-toggle btn btn-primary"
+              class="c-route-ladder__dropdown-button d-flex dropdown-toggle btn btn-primary"
               id="react-aria-:r5:"
               type="button"
             >