fixup! feat: Activate detour flow

mbta · Sep 23, 2024 · 013e2af · 013e2af
1 parent 72d2d82
commit 013e2af
Show file tree

Hide file tree

Showing 2 changed files with 55 additions and 7 deletions.
diff --git a/assets/src/models/createDetourMachine.ts b/assets/src/models/createDetourMachine.ts
@@ -499,8 +499,18 @@ export const createDetourMachine = setup({
               },
               states: {
                 "Selecting Duration": {
-                  initial: "No Duration Selected",
+                  initial: "Begin",
                   states: {
+                    Begin: {
+                      always: [
+                        {
+                          guard: ({ context: { selectedDuration } }) =>
+                            selectedDuration === undefined,
+                          target: "No Duration Selected",
+                        },
+                        { target: "Duration Selected" },
+                      ],
+                    },
                     "No Duration Selected": {},
                     "Duration Selected": {
                       on: {
@@ -516,7 +526,7 @@ export const createDetourMachine = setup({
 
                   on: {
                     "detour.share.activate-modal.select-duration": {
-                      target: "Selecting Duration.Duration Selected",
+                      target: "Selecting Duration",
                       actions: assign({
                         selectedDuration: ({ event }) => event.duration,
                       }),
@@ -527,8 +537,18 @@ export const createDetourMachine = setup({
                   },
                 },
                 "Selecting Reason": {
-                  initial: "No Reason Selected",
+                  initial: "Begin",
                   states: {
+                    Begin: {
+                      always: [
+                        {
+                          guard: ({ context: { selectedReason } }) =>
+                            selectedReason === undefined,
+                          target: "No Reason Selected",
+                        },
+                        { target: "Reason Selected" },
+                      ],
+                    },
                     "No Reason Selected": {},
                     "Reason Selected": {
                       on: {
@@ -543,10 +563,10 @@ export const createDetourMachine = setup({
                   },
                   on: {
                     "detour.share.activate-modal.back": {
-                      target: "Selecting Duration.Duration Selected",
+                      target: "Selecting Duration",
                     },
                     "detour.share.activate-modal.select-reason": {
-                      target: "Selecting Reason.Reason Selected",
+                      target: "Selecting Reason",
                       actions: assign({
                         selectedReason: ({ event }) => event.reason,
                       }),
@@ -559,7 +579,7 @@ export const createDetourMachine = setup({
                 Confirming: {
                   on: {
                     "detour.share.activate-modal.back": {
-                      target: "Selecting Reason.Reason Selected",
+                      target: "Selecting Reason",
                     },
                     "detour.share.activate-modal.activate": {
                       target: "Done",

diff --git a/assets/tests/components/detours/diversionPage.activate.test.tsx b/assets/tests/components/detours/diversionPage.activate.test.tsx
@@ -160,7 +160,9 @@ describe("DiversionPage activate workflow", () => {
     })
 
     test("clicking the activate button shows the first screen of the activate flow modal", async () => {
-      await diversionPageOnSelectDurationModalScreen()
+      await diversionPageOnReviewScreen()
+
+      await userEvent.click(activateDetourButton.get())
 
       expect(
         screen.getByRole("heading", { name: "Share Detour Details" })
@@ -224,6 +226,19 @@ describe("DiversionPage activate workflow", () => {
       expect(step1Heading.query()).not.toBeInTheDocument()
       expect(step2Heading.get()).toBeVisible()
     })
+
+    test("re-opening the modal after selecting an option keeps that option selected", async () => {
+      await diversionPageOnSelectDurationModalScreen()
+
+      await userEvent.click(threeHoursRadio.get())
+      await userEvent.click(cancelButton.get())
+
+      await userEvent.click(activateDetourButton.get())
+
+      expect(step1Heading.query()).toBeVisible()
+      expect(threeHoursRadio.get()).toBeChecked()
+      expect(nextButton.get()).toBeEnabled()
+    })
   })
 
   describe("from the reason-selection screen on the activate modal", () => {
@@ -292,6 +307,19 @@ describe("DiversionPage activate workflow", () => {
       expect(step2Heading.query()).not.toBeInTheDocument()
       expect(step3Heading.get()).toBeVisible()
     })
+
+    test("returning to this screen after hitting the 'Back' button leaves the option selected", async () => {
+      await diversionPageOnSelectReasonModalScreen()
+
+      await userEvent.click(paradeRadio.get())
+      await userEvent.click(backButton.get())
+      await userEvent.click(nextButton.get())
+
+      expect(step2Heading.get()).toBeVisible()
+
+      expect(paradeRadio.get()).toBeChecked()
+      expect(nextButton.get()).toBeEnabled()
+    })
   })
 
   describe("from the confirmation screen on the activate modal", () => {