feat(client): redirect home after adding or editing an event

benji6 · Jul 1, 2024 · 989647f · 989647f
1 parent d2dad4d
commit 989647f
Show file tree

Hide file tree

Showing 25 changed files with 535 additions and 486 deletions.
diff --git a/client/cypress/e2e/leg-raises.cy.ts b/client/cypress/e2e/leg-raises.cy.ts
@@ -59,7 +59,7 @@ describe("leg raises", () => {
       cy.get(SELECTORS.legRaisesValueInput).type(testValue);
       const expectedTime = Math.round(Date.now() / 1e3);
       cy.get(SELECTORS.eventAddSubmitButton).click();
-      cy.location("pathname").should("equal", "/leg-raises/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.eventCardValue)
         .first()
         .should("have.text", `${testValue} leg raises`);
@@ -72,7 +72,7 @@ describe("leg raises", () => {
 
     it("works with 1 leg raise", () => {
       cy.get(SELECTORS.legRaisesValueInput).type("1{enter}");
-      cy.location("pathname").should("equal", "/leg-raises/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.eventCardValue)
         .first()
         .should("have.text", "1 leg raise");

diff --git a/client/cypress/e2e/push-ups.cy.ts b/client/cypress/e2e/push-ups.cy.ts
@@ -59,7 +59,7 @@ describe("push-ups", () => {
       cy.get(SELECTORS.pushUpsValueInput).type(testValue);
       const expectedTime = Math.round(Date.now() / 1e3);
       cy.get(SELECTORS.eventAddSubmitButton).click();
-      cy.location("pathname").should("equal", "/push-ups/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.eventCardValue)
         .first()
         .should("have.text", `${testValue} push-ups`);
@@ -72,7 +72,7 @@ describe("push-ups", () => {
 
     it("works with 1 push-up", () => {
       cy.get(SELECTORS.pushUpsValueInput).type("1{enter}");
-      cy.location("pathname").should("equal", "/push-ups/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.eventCardValue).first().should("have.text", "1 push-up");
     });
   });

diff --git a/client/cypress/e2e/run.cy.ts b/client/cypress/e2e/run.cy.ts
@@ -44,23 +44,23 @@ describe("run", () => {
 
     it("works when only provided with distance", () => {
       cy.get(SELECTORS.runMetersInput).type("1234{enter}");
-      cy.location("pathname").should("equal", "/runs/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.runCardDistance).first().should("have.text", "1.2 km");
     });
 
     it("works when only provided with time", () => {
       cy.get(SELECTORS.runMinutesInput).select("9");
       cy.get(SELECTORS.runSecondsInput).select("30");
       cy.get(SELECTORS.eventAddSubmitButton).click();
-      cy.location("pathname").should("equal", "/runs/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.runCardTime).first().should("have.text", "09:30");
     });
 
     it("works when provided with both distance and time", () => {
       cy.get(SELECTORS.runMetersInput).type("123");
       cy.get(SELECTORS.runMinutesInput).select("10");
       cy.get(SELECTORS.eventAddSubmitButton).click();
-      cy.location("pathname").should("equal", "/runs/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.runCardDistance).first().should("have.text", "123 m");
       cy.get(SELECTORS.runCardTime).first().should("have.text", "10:00");
     });

diff --git a/client/cypress/e2e/sit-ups.cy.ts b/client/cypress/e2e/sit-ups.cy.ts
@@ -59,7 +59,7 @@ describe("sit-ups", () => {
       cy.get(SELECTORS.sitUpsValueInput).type(testValue);
       const expectedTime = Math.round(Date.now() / 1e3);
       cy.get(SELECTORS.eventAddSubmitButton).click();
-      cy.location("pathname").should("equal", "/sit-ups/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.eventCardValue)
         .first()
         .should("have.text", `${testValue} sit-ups`);
@@ -72,7 +72,7 @@ describe("sit-ups", () => {
 
     it("works with 1 sit-up", () => {
       cy.get(SELECTORS.sitUpsValueInput).type("1{enter}");
-      cy.location("pathname").should("equal", "/sit-ups/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.eventCardValue).first().should("have.text", "1 sit-up");
     });
   });

diff --git a/client/cypress/e2e/sleep.cy.ts b/client/cypress/e2e/sleep.cy.ts
@@ -50,7 +50,7 @@ describe("sleep", () => {
       cy.get(SELECTORS.hoursSleptInput).select("8");
       cy.get(SELECTORS.minutesSleptInput).select("10");
       cy.get(SELECTORS.eventAddSubmitButton).click();
-      cy.location("pathname").should("equal", "/sleeps/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.sleepCardValue)
         .first()
         .should("have.text", "8 hr & 10 min");

diff --git a/client/cypress/e2e/weight.cy.ts b/client/cypress/e2e/weight.cy.ts
@@ -53,7 +53,7 @@ describe("weight", () => {
       cy.get(SELECTORS.weightValueInput).type(`${testValue}{enter}`);
       const expectedTime = Math.round(Date.now() / 1e3);
 
-      cy.location("pathname").should("equal", "/weights/log");
+      cy.location("pathname").should("equal", "/");
       cy.get(SELECTORS.eventCardValue)
         .first()
         .should("have.text", `${testValue} kg`);

diff --git a/client/src/components/pages/LegRaises/AddLegRaises.tsx b/client/src/components/pages/LegRaises/AddLegRaises.tsx
@@ -6,40 +6,45 @@ import { TextField } from "eri";
 import { captureException } from "../../../sentry";
 import deviceSlice from "../../../store/deviceSlice";
 import eventsSlice from "../../../store/eventsSlice";
-import { useNavigate } from "react-router-dom";
 
 export default function AddLegRaises() {
-  const navigate = useNavigate();
   const dispatch = useDispatch();
   const [error, setError] = useState<string | undefined>();
   const geolocation = useSelector(deviceSlice.selectors.geolocation);
   const formRef = useRef<HTMLFormElement>(null);
 
-  const onSubmit = () => {
-    const formEl = formRef.current;
-    if (!formEl) return captureException(Error("Form ref is undefined"));
-    const inputEl: HTMLInputElement = formEl[FIELDS.legRaises.name];
-    const { valueAsNumber } = inputEl;
-
-    if (inputEl.validity.valueMissing) return setError(ERRORS.required);
-    if (inputEl.validity.rangeOverflow) return setError(ERRORS.rangeOverflow);
-    if (inputEl.validity.rangeUnderflow) return setError(ERRORS.rangeUnderflow);
-    if (inputEl.validity.stepMismatch) return setError(ERRORS.integer);
+  return (
+    <AddEvent
+      eventType="leg-raises"
+      ref={formRef}
+      onSubmit={(): true | void => {
+        const formEl = formRef.current;
+        if (!formEl) {
+          captureException(Error("Form ref is undefined"));
+          return;
+        }
+        const inputEl: HTMLInputElement = formEl[FIELDS.legRaises.name];
+        const { valueAsNumber } = inputEl;
 
-    dispatch(
-      eventsSlice.actions.add({
-        type: "v1/leg-raises/create",
-        createdAt: new Date().toISOString(),
-        payload: geolocation
-          ? { location: geolocation, value: valueAsNumber }
-          : { value: valueAsNumber },
-      }),
-    );
-    navigate("/leg-raises/log");
-  };
+        if (inputEl.validity.valueMissing) return setError(ERRORS.required);
+        if (inputEl.validity.rangeOverflow)
+          return setError(ERRORS.rangeOverflow);
+        if (inputEl.validity.rangeUnderflow)
+          return setError(ERRORS.rangeUnderflow);
+        if (inputEl.validity.stepMismatch) return setError(ERRORS.integer);
 
-  return (
-    <AddEvent eventType="leg-raises" ref={formRef} onSubmit={onSubmit}>
+        dispatch(
+          eventsSlice.actions.add({
+            type: "v1/leg-raises/create",
+            createdAt: new Date().toISOString(),
+            payload: geolocation
+              ? { location: geolocation, value: valueAsNumber }
+              : { value: valueAsNumber },
+          }),
+        );
+        return true;
+      }}
+    >
       <TextField {...FIELDS.legRaises} error={error} />
     </AddEvent>
   );

diff --git a/client/src/components/pages/LegRaises/EditLegRaises.tsx b/client/src/components/pages/LegRaises/EditLegRaises.tsx
@@ -1,15 +1,14 @@
 import { ERRORS, FIELDS } from "../../../constants";
 import { useDispatch, useSelector } from "react-redux";
-import { useNavigate, useParams } from "react-router-dom";
 import { useRef, useState } from "react";
 import EditEvent from "../../shared/EditEvent";
 import RedirectHome from "../../shared/RedirectHome";
 import { TextField } from "eri";
 import { captureException } from "../../../sentry";
 import eventsSlice from "../../../store/eventsSlice";
+import { useParams } from "react-router-dom";
 
 export default function EditLegRaises() {
-  const navigate = useNavigate();
   const dispatch = useDispatch();
   const [error, setError] = useState<string | undefined>();
   const { id } = useParams();
@@ -20,31 +19,6 @@ export default function EditLegRaises() {
 
   const formRef = useRef<HTMLFormElement>(null);
 
-  const onSubmit = () => {
-    const formEl = formRef.current;
-    if (!formEl) return captureException(Error("Form ref is undefined"));
-    setShowNoUpdateError(false);
-
-    const inputEl: HTMLInputElement = formEl[FIELDS.legRaises.name];
-    const { valueAsNumber } = inputEl;
-
-    if (inputEl.validity.valueMissing) return setError(ERRORS.required);
-    if (inputEl.validity.rangeOverflow) return setError(ERRORS.rangeOverflow);
-    if (inputEl.validity.rangeUnderflow) return setError(ERRORS.rangeUnderflow);
-
-    if (valueAsNumber === legRaises.value) return setShowNoUpdateError(true);
-
-    dispatch(
-      eventsSlice.actions.add({
-        type: "v1/leg-raises/update",
-        createdAt: new Date().toISOString(),
-        // The user is redirected if `id` is not defined
-        payload: { id: id!, value: valueAsNumber },
-      }),
-    );
-    navigate("/");
-  };
-
   if (!id) return <RedirectHome />;
   const legRaises = normalizedLegRaises.byId[id];
   if (!legRaises) return <RedirectHome />;
@@ -54,7 +28,35 @@ export default function EditLegRaises() {
       eventType="leg-raises"
       id={id}
       location={legRaises.location}
-      onSubmit={onSubmit}
+      onSubmit={(): true | void => {
+        const formEl = formRef.current;
+        if (!formEl) {
+          captureException(Error("Form ref is undefined"));
+          return;
+        }
+        setShowNoUpdateError(false);
+
+        const inputEl: HTMLInputElement = formEl[FIELDS.legRaises.name];
+        const { valueAsNumber } = inputEl;
+
+        if (inputEl.validity.valueMissing) return setError(ERRORS.required);
+        if (inputEl.validity.rangeOverflow)
+          return setError(ERRORS.rangeOverflow);
+        if (inputEl.validity.rangeUnderflow)
+          return setError(ERRORS.rangeUnderflow);
+
+        if (valueAsNumber === legRaises.value)
+          return setShowNoUpdateError(true);
+
+        dispatch(
+          eventsSlice.actions.add({
+            type: "v1/leg-raises/update",
+            createdAt: new Date().toISOString(),
+            payload: { id, value: valueAsNumber },
+          }),
+        );
+        return true;
+      }}
       ref={formRef}
       showNoUpdateError={showNoUpdateError}
       updatedAt={legRaises.updatedAt}

diff --git a/client/src/components/pages/Meditation/Meditate/MeditationTimer/index.tsx b/client/src/components/pages/Meditation/Meditate/MeditationTimer/index.tsx
@@ -87,7 +87,7 @@ export default function MeditationTimer() {
         payload,
       }),
     );
-    navigate("/meditation/log");
+    navigate("/");
   }, [
     dispatch,
     geolocation,

diff --git a/client/src/components/pages/Meditation/Meditate/OpenEndedMeditation/index.tsx b/client/src/components/pages/Meditation/Meditate/OpenEndedMeditation/index.tsx
@@ -29,7 +29,7 @@ export default function OpenEndedMeditation() {
         payload,
       }),
     );
-    navigate("/meditation/log");
+    navigate("/");
   }, [dispatch, geolocation, navigate, roundedSecondsElapsed]);
   const onPause = useCallback(() => {
     noSleep.disable();

diff --git a/client/src/components/pages/Mood/AddMood.tsx b/client/src/components/pages/Mood/AddMood.tsx
@@ -9,10 +9,8 @@ import deviceSlice from "../../../store/deviceSlice";
 import eventsSlice from "../../../store/eventsSlice";
 import { moodToColor } from "../../../utils";
 import useDarkMode from "../../hooks/useDarkMode";
-import { useNavigate } from "react-router-dom";
 
 export default function AddMood() {
-  const navigate = useNavigate();
   const darkMode = useDarkMode();
   const dispatch = useDispatch();
   const [moodError, setMoodError] = useState<string | undefined>();
@@ -22,37 +20,6 @@ export default function AddMood() {
   const geolocation = useSelector(deviceSlice.selectors.geolocation);
   const formRef = useRef<HTMLFormElement>(null);
 
-  const onSubmit = () => {
-    const formEl = formRef.current;
-    if (!formEl) return captureException(Error("Form ref is undefined"));
-
-    const descriptionEl: HTMLInputElement = formEl[FIELDS.description.name];
-    const descriptionValue = descriptionEl.value;
-    const explorationValue: string = formEl[FIELDS.exploration.name].value;
-    const moodValue: string = formEl[FIELDS.mood.name].value;
-
-    if (!moodValue) setMoodError(ERRORS.required);
-
-    const descriptionFieldError = descriptionEl.validity.patternMismatch;
-    setDescriptionError(descriptionFieldError ? ERRORS.specialCharacters : "");
-
-    if (descriptionFieldError || !moodValue) return;
-
-    const payload: Mood = { mood: Number(moodValue) };
-    if (descriptionValue) payload.description = descriptionValue.trim();
-    if (explorationValue) payload.exploration = explorationValue.trim();
-    if (geolocation) payload.location = geolocation;
-
-    dispatch(
-      eventsSlice.actions.add({
-        type: "v1/moods/create",
-        createdAt: new Date().toISOString(),
-        payload,
-      }),
-    );
-    navigate("/");
-  };
-
   const currentHour = new Date().getHours();
   const timeOfDay =
     currentHour < 4
@@ -67,7 +34,41 @@ export default function AddMood() {
     <AddEvent
       eventType="moods"
       ref={formRef}
-      onSubmit={onSubmit}
+      onSubmit={(): true | void => {
+        const formEl = formRef.current;
+        if (!formEl) {
+          captureException(Error("Form ref is undefined"));
+          return;
+        }
+
+        const descriptionEl: HTMLInputElement = formEl[FIELDS.description.name];
+        const descriptionValue = descriptionEl.value;
+        const explorationValue: string = formEl[FIELDS.exploration.name].value;
+        const moodValue: string = formEl[FIELDS.mood.name].value;
+
+        if (!moodValue) setMoodError(ERRORS.required);
+
+        const descriptionFieldError = descriptionEl.validity.patternMismatch;
+        setDescriptionError(
+          descriptionFieldError ? ERRORS.specialCharacters : "",
+        );
+
+        if (descriptionFieldError || !moodValue) return;
+
+        const payload: Mood = { mood: Number(moodValue) };
+        if (descriptionValue) payload.description = descriptionValue.trim();
+        if (explorationValue) payload.exploration = explorationValue.trim();
+        if (geolocation) payload.location = geolocation;
+
+        dispatch(
+          eventsSlice.actions.add({
+            type: "v1/moods/create",
+            createdAt: new Date().toISOString(),
+            payload,
+          }),
+        );
+        return true;
+      }}
       subheading={`How are you feeling this ${timeOfDay}?`}
     >
       <RadioButton.Group