feat: Store week of submission and submission date separately (#96)

hack4impact-utk · Jan 11, 2025 · edb6ee8 · edb6ee8
1 parent fe36c3d
commit edb6ee8
Show file tree

Hide file tree

Showing 42 changed files with 126 additions and 87 deletions.
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -4,7 +4,7 @@ import { AppRouterCacheProvider } from "@mui/material-nextjs/v14-appRouter";
 import type { Metadata } from "next";
 import { Roboto } from "next/font/google";
 
-import Header from "@/components/Header";
+import { Header } from "@/components/Header";
 import NextAuthProvider from "@/providers/NextAuthProvider";
 import theme from "@/styles/theme";
 

diff --git a/src/components/AdminDashboard/PendingApplicationDashboard/AcceptPendingApplicationButton.tsx b/src/components/AdminDashboard/PendingApplicationDashboard/AcceptPendingApplicationButton.tsx
@@ -4,10 +4,11 @@ import { Check } from "@mui/icons-material";
 import Button from "@mui/material/Button";
 import React, { Dispatch, SetStateAction } from "react";
 
-import { Row } from "@/components/AdminDashboard/PendingApplicationDashboard";
 import { handleApproveProgramApplication } from "@/server/api/program-enrollments/public-mutations";
 import { ProgramEnrollment } from "@/types";
 
+import { Row } from ".";
+
 type AcceptPendingApplicationButtonProps = {
   programEnrollment: ProgramEnrollment;
   rows: Row[];

diff --git a/...d/PendingApplicationDashboard/PendingApplicationInfoModal/GeneralInformationResponses.tsx b/...d/PendingApplicationDashboard/PendingApplicationInfoModal/GeneralInformationResponses.tsx
@@ -1,8 +1,9 @@
 import { Box, Typography } from "@mui/material";
 
-import FormResponse from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/FormResponse";
 import { GeneralInformationSection } from "@/types/EnrollmentForm";
 
+import FormResponse from "./FormResponse";
+
 type GeneralInformationResponsesProps = {
   generalInformationSection: GeneralInformationSection;
 };

diff --git a/...ard/PendingApplicationDashboard/PendingApplicationInfoModal/ProgramSelectionResponses.tsx b/...ard/PendingApplicationDashboard/PendingApplicationInfoModal/ProgramSelectionResponses.tsx
@@ -1,7 +1,8 @@
 import { Box, Typography } from "@mui/material";
 
-import FormResponse from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/FormResponse";
-import { ProgramSelectionSection } from "@/types/EnrollmentForm";
+import { ProgramSelectionSection } from "@/types";
+
+import FormResponse from "./FormResponse";
 
 type ProgramSelectionResponsesProps = {
   programSelectionSection: ProgramSelectionSection;

diff --git a/...endingApplicationInfoModal/ProgramSpecificResponses/GetPreventativeScreeningResponses.tsx b/...endingApplicationInfoModal/ProgramSpecificResponses/GetPreventativeScreeningResponses.tsx
@@ -1,8 +1,9 @@
 import { Box, Typography } from "@mui/material";
 
-import FormResponse from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/FormResponse";
 import { ProgramSpecificQuestionsSection } from "@/types/EnrollmentForm";
 
+import FormResponse from "../FormResponse";
+
 type GetPreventativeScreeningResponsesProps = {
   programSpecificQuestionsSection: ProgramSpecificQuestionsSection;
 };

diff --git a/...icationInfoModal/ProgramSpecificResponses/HealthyHabitsAndDiabetesPreventionResponses.tsx b/...icationInfoModal/ProgramSpecificResponses/HealthyHabitsAndDiabetesPreventionResponses.tsx
@@ -1,9 +1,10 @@
 import { Box, Typography } from "@mui/material";
 
-import FormResponse from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/FormResponse";
-import { ProgramSpecificQuestionsSection } from "@/types/EnrollmentForm";
+import { ProgramSpecificQuestionsSection } from "@/types";
 import getBmiClassification from "@/utils/getBmiClassification";
 
+import FormResponse from "../FormResponse";
+
 type HealthyHabitsAndDiabetesPreventionResponsesProps = {
   programSpecificQuestionsSection: ProgramSpecificQuestionsSection;
 };

diff --git a/...shboard/PendingApplicationInfoModal/ProgramSpecificResponses/RigsWithoutCigsResponses.tsx b/...shboard/PendingApplicationInfoModal/ProgramSpecificResponses/RigsWithoutCigsResponses.tsx
@@ -1,7 +1,8 @@
 import { Box, Typography } from "@mui/material";
 
-import FormResponse from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/FormResponse";
-import { ProgramSpecificQuestionsSection } from "@/types/EnrollmentForm";
+import { ProgramSpecificQuestionsSection } from "@/types";
+
+import FormResponse from "../FormResponse";
 
 type RigsWithoutCigsResponsesProps = {
   programSpecificQuestionsSection: ProgramSpecificQuestionsSection;

diff --git a/...ashboard/PendingApplicationInfoModal/ProgramSpecificResponses/VaccineVoucherResponses.tsx b/...ashboard/PendingApplicationInfoModal/ProgramSpecificResponses/VaccineVoucherResponses.tsx
@@ -1,7 +1,8 @@
 import { Box, Typography } from "@mui/material";
 
-import FormResponse from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/FormResponse";
-import { ProgramSpecificQuestionsSection } from "@/types/EnrollmentForm";
+import { ProgramSpecificQuestionsSection } from "@/types";
+
+import FormResponse from "../FormResponse";
 
 type VaccineVoucherResponsesProps = {
   programSpecificQuestionsSection: ProgramSpecificQuestionsSection;

diff --git a/...endingApplicationDashboard/PendingApplicationInfoModal/ProgramSpecificResponses/index.tsx b/...endingApplicationDashboard/PendingApplicationInfoModal/ProgramSpecificResponses/index.tsx
@@ -1,10 +1,11 @@
 import { Box, Typography } from "@mui/material";
 
-import GetPreventativeScreeningResponses from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/ProgramSpecificResponses/GetPreventativeScreeningResponses";
-import HealthyHabitsAndDiabetesPreventionResponses from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/ProgramSpecificResponses/HealthyHabitsAndDiabetesPreventionResponses";
-import RigsWithoutCigsResponses from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/ProgramSpecificResponses/RigsWithoutCigsResponses";
-import VaccineVoucherResponses from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/ProgramSpecificResponses/VaccineVoucherResponses";
-import { ProgramSpecificQuestionsSection } from "@/types/EnrollmentForm";
+import { ProgramSpecificQuestionsSection } from "@/types";
+
+import GetPreventativeScreeningResponses from "./GetPreventativeScreeningResponses";
+import HealthyHabitsAndDiabetesPreventionResponses from "./HealthyHabitsAndDiabetesPreventionResponses";
+import RigsWithoutCigsResponses from "./RigsWithoutCigsResponses";
+import VaccineVoucherResponses from "./VaccineVoucherResponses";
 
 type ProgramSpecificResponsesProps = {
   programSpecificQuestionsSection: ProgramSpecificQuestionsSection;

diff --git a/...d/PendingApplicationDashboard/PendingApplicationInfoModal/QualifyingQuestionResponses.tsx b/...d/PendingApplicationDashboard/PendingApplicationInfoModal/QualifyingQuestionResponses.tsx
@@ -1,7 +1,8 @@
 import { Box, Typography } from "@mui/material";
 
-import FormResponse from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/FormResponse";
-import { QualifyingQuestionsSection } from "@/types/EnrollmentForm";
+import { QualifyingQuestionsSection } from "@/types";
+
+import FormResponse from "./FormResponse";
 
 type QualifyingQuestionResponsesProps = {
   qualifyingQuestionsSection: QualifyingQuestionsSection;

diff --git a/...mponents/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/index.tsx b/...mponents/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/index.tsx
@@ -4,12 +4,13 @@ import InfoIcon from "@mui/icons-material/Info";
 import { Box, Button, Fade, Modal, Typography } from "@mui/material";
 import { useState } from "react";
 
-import GeneralInformationResponses from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/GeneralInformationResponses";
-import ProgramSelectionResponses from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/ProgramSelectionResponses";
-import ProgramSpecificResponses from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/ProgramSpecificResponses";
-import QualifyingQuestionResponses from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal/QualifyingQuestionResponses";
 import { EnrollmentForm } from "@/types";
 
+import GeneralInformationResponses from "./GeneralInformationResponses";
+import ProgramSelectionResponses from "./ProgramSelectionResponses";
+import ProgramSpecificResponses from "./ProgramSpecificResponses";
+import QualifyingQuestionResponses from "./QualifyingQuestionResponses";
+
 const style = {
   position: "absolute",
   top: "50%",

diff --git a/src/components/AdminDashboard/PendingApplicationDashboard/RejectPendingApplicationButton.tsx b/src/components/AdminDashboard/PendingApplicationDashboard/RejectPendingApplicationButton.tsx
@@ -11,11 +11,12 @@ import React, { Dispatch, SetStateAction, useState } from "react";
 import { useForm } from "react-hook-form";
 import { z } from "zod";
 
-import { Row } from "@/components/AdminDashboard/PendingApplicationDashboard";
 import ControlledTextField from "@/components/controlled/ControlledTextField";
 import { handleRejectProgramApplication } from "@/server/api/program-enrollments/public-mutations";
 import { ProgramEnrollment } from "@/types";
 
+import { Row } from ".";
+
 const rejectionReasonSchema = z.object({
   rejectionReason: z.string().min(1, { message: "Reason is required" }),
 });

diff --git a/src/components/AdminDashboard/PendingApplicationDashboard/index.tsx b/src/components/AdminDashboard/PendingApplicationDashboard/index.tsx
@@ -5,11 +5,12 @@ import { Box, Snackbar, TextField, Typography } from "@mui/material";
 import { DataGrid, GridColDef } from "@mui/x-data-grid";
 import { useState } from "react";
 
-import AcceptPendingApplicationButton from "@/components/AdminDashboard/PendingApplicationDashboard/AcceptPendingApplicationButton";
-import PendingApplicationInfoModal from "@/components/AdminDashboard/PendingApplicationDashboard/PendingApplicationInfoModal";
-import RejectPendingApplicationButton from "@/components/AdminDashboard/PendingApplicationDashboard/RejectPendingApplicationButton";
 import { ClientUser, Program, ProgramEnrollment } from "@/types";
 
+import AcceptPendingApplicationButton from "./AcceptPendingApplicationButton";
+import PendingApplicationInfoModal from "./PendingApplicationInfoModal";
+import RejectPendingApplicationButton from "./RejectPendingApplicationButton";
+
 export type Row = {
   id?: string;
   lastName: string;

diff --git a/src/components/AdminDashboard/Sidebar/CollapsibleSidebarButton.tsx b/src/components/AdminDashboard/Sidebar/CollapsibleSidebarButton.tsx
@@ -10,7 +10,7 @@ import {
 } from "@mui/material";
 import { ReactNode } from "react";
 
-import getButtonStyles from "@/components/AdminDashboard/Sidebar/getButtonStyles";
+import getButtonStyles from "./getButtonStyles";
 
 type CollapsibleSidebarButtonProps = {
   pathname: string;

diff --git a/src/components/AdminDashboard/Sidebar/SidebarButton.tsx b/src/components/AdminDashboard/Sidebar/SidebarButton.tsx
@@ -10,7 +10,7 @@ import {
 import Link from "next/link";
 import { ReactNode } from "react";
 
-import getButtonStyles from "@/components/AdminDashboard/Sidebar/getButtonStyles";
+import getButtonStyles from "./getButtonStyles";
 
 type SidebarButtonProps = {
   pathname: string;

diff --git a/src/components/AdminDashboard/Sidebar/index.tsx b/src/components/AdminDashboard/Sidebar/index.tsx
@@ -13,8 +13,8 @@ import { Box, Collapse, Drawer, List, Toolbar, useTheme } from "@mui/material";
 import { usePathname } from "next/navigation";
 import { useState } from "react";
 
-import CollapsibleSidebarButton from "@/components/AdminDashboard/Sidebar/CollapsibleSidebarButton";
-import SidebarButton from "@/components/AdminDashboard/Sidebar/SidebarButton";
+import CollapsibleSidebarButton from "./CollapsibleSidebarButton";
+import SidebarButton from "./SidebarButton";
 
 const drawerWidth = 200;
 

diff --git a/src/components/ChangePassword/ChangePasswordForm.tsx b/src/components/ChangePassword/ChangePasswordForm.tsx
@@ -8,9 +8,10 @@ import { useState } from "react";
 import { useForm } from "react-hook-form";
 import { z } from "zod";
 
-import ControlledTextField from "@/components/controlled/ControlledTextField";
 import { handleChangePassword } from "@/server/api/users/public-mutations";
 
+import ControlledTextField from "../controlled/ControlledTextField";
+
 const changePasswordFormSchema = z
   .object({
     oldPassword: z.string().min(8, {

diff --git a/.../HealthyHabitsHistory/HealthyHabitsTrackingFormList/HealthyHabitsTrackingFormListItem.tsx b/.../HealthyHabitsHistory/HealthyHabitsTrackingFormList/HealthyHabitsTrackingFormListItem.tsx
@@ -12,10 +12,11 @@ import {
 } from "@mui/material";
 import { useState } from "react";
 
-import HealthyHabitsTrackingFormModal from "@/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/HealthyHabitsTrackingFormList/HealthyHabitsTrackingFormModal";
 import { HealthyHabitsTrackingForm } from "@/types";
 import dayjsUtil from "@/utils/dayjsUtil";
 
+import HealthyHabitsTrackingFormModal from "./HealthyHabitsTrackingFormModal";
+
 type HealthyHabitsTrackingFormListItemProps = {
   form: HealthyHabitsTrackingForm;
   handleDelete: (form: HealthyHabitsTrackingForm) => void;
@@ -50,7 +51,7 @@ export default function HealthyHabitsTrackingFormListItem({
         </Avatar>
       </ListItemAvatar>
       <ListItemText
-        primary={dayjsUtil.utc(form.submittedDate).format("MM/DD/YYYY")}
+        primary={`Week of ${dayjsUtil.utc(form.weekOfSubmission).format("MM/DD/YYYY")}`}
       />
     </ListItem>
   );

diff --git a/...its/HealthyHabitsHistory/HealthyHabitsTrackingFormList/HealthyHabitsTrackingFormModal.tsx b/...its/HealthyHabitsHistory/HealthyHabitsTrackingFormList/HealthyHabitsTrackingFormModal.tsx
@@ -49,10 +49,14 @@ export default function HealthyHabitsTrackingFormModal({
         <Fade in={open}>
           <Box sx={style}>
             <Typography id="transition-modal-title" variant="h4">
-              {dayjsUtil.utc(form.submittedDate).format("MM/DD/YYYY")}
+              {`Week of ${dayjsUtil.utc(form.weekOfSubmission).format("MM/DD/YYYY")}`}
             </Typography>
 
             <Box sx={{ display: "flex", flexDirection: "column", gap: 2 }}>
+              <FormResponse
+                label="Submitted Date"
+                value={dayjsUtil.utc(form.submittedDate).format("MM/DD/YYYY")}
+              />
               <FormResponse
                 label="Health Conditions"
                 value={form.healthConditions}

diff --git a/...lientDashboard/HealthyHabits/HealthyHabitsHistory/HealthyHabitsTrackingFormList/index.tsx b/...lientDashboard/HealthyHabits/HealthyHabitsHistory/HealthyHabitsTrackingFormList/index.tsx
@@ -3,10 +3,11 @@
 import { Box, List, Snackbar, Typography } from "@mui/material";
 import { Dispatch, SetStateAction, useState } from "react";
 
-import HealthyHabitsTrackingFormListItem from "@/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/HealthyHabitsTrackingFormList/HealthyHabitsTrackingFormListItem";
 import { handleHealthyHabitsTrackingFormDeletion } from "@/server/api/healthy-habits-tracking-forms/public-mutations";
 import { ClientUser, HealthyHabitsTrackingForm } from "@/types";
 
+import HealthyHabitsTrackingFormListItem from "./HealthyHabitsTrackingFormListItem";
+
 type HealthyHabitsTrackingFormListProps = {
   trackingForms: HealthyHabitsTrackingForm[];
   setTrackingForms: Dispatch<SetStateAction<HealthyHabitsTrackingForm[]>>;
@@ -23,7 +24,7 @@ export default function HealthyHabitsTrackingFormList({
 
   const handleDelete = async (form: HealthyHabitsTrackingForm) => {
     const confirm = window.confirm(
-      "Are you sure you want to delete this health tracking record?",
+      "Are you sure you want to delete this tracking form?",
     );
 
     if (!confirm) {

diff --git a/src/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/ModularBarChart.tsx b/src/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/ModularBarChart.tsx
@@ -23,11 +23,13 @@ export default function ModularBarChart({
   const getChartData = () => {
     return trackingForms
       .sort((a, b) =>
-        dayjsUtil.utc(a.submittedDate).diff(dayjsUtil.utc(b.submittedDate)),
+        dayjsUtil
+          .utc(a.weekOfSubmission)
+          .diff(dayjsUtil.utc(b.weekOfSubmission)),
       )
       .map((form) => ({
         value: Number(form[dataKey]) || 0,
-        label: `Week of ${dayjsUtil.utc(form.submittedDate).format("MM/DD/YY")}`,
+        label: `Week of ${dayjsUtil.utc(form.weekOfSubmission).format("MM/DD/YY")}`,
       }));
   };
 

diff --git a/src/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/ModularLineChart.tsx b/src/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/ModularLineChart.tsx
@@ -42,11 +42,11 @@ export default function ModularLineChart({
 
   const getChartDataAndSeries = (): ChartConfig => {
     const sortedData = trackingForms.sort((a, b) =>
-      dayjsUtil.utc(a.submittedDate).diff(dayjsUtil.utc(b.submittedDate)),
+      dayjsUtil.utc(a.weekOfSubmission).diff(dayjsUtil.utc(b.weekOfSubmission)),
     );
 
     const chartData: RegularChartDataPoint[] = sortedData.map((entry) => ({
-      x: dayjsUtil.utc(entry.submittedDate).toDate(),
+      x: dayjsUtil.utc(entry.weekOfSubmission).toDate(),
       y: entry[dataKey] as number,
       ...(dataKey2 && { y2: entry[dataKey2] as number }),
     }));

diff --git a/src/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/index.tsx b/src/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/index.tsx
@@ -3,11 +3,12 @@
 import { Box, Typography } from "@mui/material";
 import { useState } from "react";
 
-import HealthyHabitsTrackingFormList from "@/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/HealthyHabitsTrackingFormList";
-import ModularBarChart from "@/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/ModularBarChart";
-import ModularLineChart from "@/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory/ModularLineChart";
 import { ClientUser, HealthyHabitsTrackingForm } from "@/types";
 
+import HealthyHabitsTrackingFormList from "./HealthyHabitsTrackingFormList";
+import ModularBarChart from "./ModularBarChart";
+import ModularLineChart from "./ModularLineChart";
+
 type HealthyHabitsHistoryProps = {
   initialForms: HealthyHabitsTrackingForm[];
   user: ClientUser;

diff --git a/src/components/ClientDashboard/HealthyHabits/HealthyHabitsTracking.tsx b/src/components/ClientDashboard/HealthyHabits/HealthyHabitsTracking.tsx
@@ -24,12 +24,12 @@ import { Controller, useForm } from "react-hook-form";
 
 import ControlledTextField from "@/components/controlled/ControlledTextField";
 import { handleHealthyHabitsTrackingFormSubmission } from "@/server/api/healthy-habits-tracking-forms/public-mutations";
-import { ClientUser } from "@/types";
 import {
+  ClientUser,
   HealthyHabitsFormValues,
   HealthyHabitsTrackingForm,
   healthyHabitsValidator,
-} from "@/types/HealthyHabitsTrackingForm";
+} from "@/types";
 import apiErrors from "@/utils/constants/apiErrors";
 import dayjsUtil from "@/utils/dayjsUtil";
 import getClosestPastSunday from "@/utils/getClosestPastSunday";
@@ -53,7 +53,8 @@ export default function HealthyHabitsTracking({
   } = useForm<HealthyHabitsFormValues>({
     resolver: zodResolver(healthyHabitsValidator),
     defaultValues: {
-      submittedDate: getClosestPastSunday(),
+      submittedDate: dayjsUtil().utc().format("MM/DD/YYYY"),
+      weekOfSubmission: "",
       healthConditions: "",
       devices: {
         hasScale: false,
@@ -86,6 +87,9 @@ export default function HealthyHabitsTracking({
     const healthyHabitsTrackingForm: HealthyHabitsTrackingForm = {
       ...data,
       submittedDate: dayjsUtil(data.submittedDate).utc().toISOString(),
+      weekOfSubmission: getClosestPastSunday(
+        dayjsUtil(data.submittedDate, "MM/DD/YYYY"),
+      ),
       user,
     };
 
@@ -99,7 +103,9 @@ export default function HealthyHabitsTracking({
       error ===
       apiErrors.healthyHabitsTrackingForm.healthyHabitsTrackingFormAlreadyExists
     ) {
-      setSnackbarMessage("You have already submitted the form for this week.");
+      setSnackbarMessage(
+        "You have already submitted the form for the selected week.",
+      );
     } else {
       setSnackbarMessage("An unknown error occurred");
     }
@@ -141,9 +147,7 @@ export default function HealthyHabitsTracking({
                     }
                     label="Date"
                     format="MM/DD/YYYY"
-                    shouldDisableDate={(day) => {
-                      return day.day() !== 0;
-                    }}
+                    disableFuture={true}
                   />
                 </LocalizationProvider>
                 <FormHelperText>{errors.submittedDate?.message}</FormHelperText>

diff --git a/src/components/ClientDashboard/HealthyHabits/index.tsx b/src/components/ClientDashboard/HealthyHabits/index.tsx
@@ -1,12 +1,13 @@
 "use client";
 import { Box, Divider, Tab, Tabs, Typography } from "@mui/material";
-import { useState } from "react";
+import { SyntheticEvent, useState } from "react";
 
-import HealthyHabitsHistory from "@/components/ClientDashboard/HealthyHabits/HealthyHabitsHistory";
-import HealthyHabitsInfo from "@/components/ClientDashboard/HealthyHabits/HealthyHabitsInfo";
-import HealthyHabitsTracking from "@/components/ClientDashboard/HealthyHabits/HealthyHabitsTracking";
 import { ClientUser } from "@/types";
 
+import HealthyHabitsHistory from "./HealthyHabitsHistory";
+import HealthyHabitsInfo from "./HealthyHabitsInfo";
+import HealthyHabitsTracking from "./HealthyHabitsTracking";
+
 type HealthyHabitsSections = "tracking" | "history" | "info";
 
 type HealthyHabitsProps = {
@@ -18,7 +19,7 @@ export default function HealthyHabits({ user }: HealthyHabitsProps) {
     useState<HealthyHabitsSections>("tracking");
 
   const handleTabChange = (
-    _event: React.SyntheticEvent,
+    _event: SyntheticEvent,
     newValue: HealthyHabitsSections,
   ) => {
     setSelectedSection(newValue);