From bc47dd80d37fa3d830fe801f184306495462d961 Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 13:08:51 -0400
Subject: [PATCH 01/11] setup react query instead of useaccount store

---
 .../projects/$projectId/_projectLayout.tsx    | 20 +++++--------
 .../$projectId/_projectLayout/index.tsx       | 12 ++++++--
 .../_submissionLayout.tsx                     | 17 +++++------
 .../_submissionLayout/index.tsx               | 29 +++++++++++++++++--
 4 files changed, 49 insertions(+), 29 deletions(-)

diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout.tsx
index 00c03324..a5b040c1 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout.tsx
@@ -1,9 +1,7 @@
 import { ProjectsSkeleton } from "@/components/Projects";
-import { useAccountProject } from "@/components/Projects/projectStore";
 import { useBreadCrumb } from "@/components/Shared/layout/SideNav/breadCrumbStore";
 import { PageGrid } from "@/components/Shared/PageGrid";
 import { useGetProject } from "@/hooks/api/useProjects";
-import { AccountProject } from "@/models/Project";
 import {
   createFileRoute,
   Navigate,
@@ -22,28 +20,24 @@ export const Route = createFileRoute(
 });
 
 function ProjectLayout() {
-  const { setAccountProject } = useAccountProject();
   const { projectId: projectIdParam } = useParams({ strict: false });
   const projectId = Number(projectIdParam);
-  const { data, isLoading, isError, error } = useGetProject({
+  const {
+    data: accountProject,
+    isLoading,
+    isError,
+    error,
+  } = useGetProject({
     projectId,
   });
-  const accountProject = data as AccountProject;
   const META_TITLE = `Project ${projectId}`;
   const matches = useRouterState({ select: (s) => s.matches });
   const { replaceBreadcrumb } = useBreadCrumb();
   useEffect(() => {
     if (accountProject) {
-      setAccountProject(accountProject);
       replaceBreadcrumb(META_TITLE, accountProject?.project.name || "");
     }
-  }, [
-    accountProject,
-    matches,
-    setAccountProject,
-    replaceBreadcrumb,
-    META_TITLE,
-  ]);
+  }, [accountProject, matches, replaceBreadcrumb, META_TITLE]);
 
   if (isLoading) {
     return (
diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/index.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/index.tsx
index 20ba070d..abf04bc0 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/index.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/index.tsx
@@ -1,8 +1,8 @@
 import { PageGrid } from "@/components/Shared/PageGrid";
 import { Grid } from "@mui/material";
-import { createFileRoute } from "@tanstack/react-router";
+import { createFileRoute, Navigate, useParams } from "@tanstack/react-router";
 import { Project as ProjectComponent } from "@/components/Projects/Project";
-import { useAccountProject } from "@/components/Projects/projectStore";
+import { useGetProject } from "@/hooks/api/useProjects";
 
 export const Route = createFileRoute(
   "/_authenticated/_dashboard/projects/$projectId/_projectLayout/"
@@ -14,7 +14,13 @@ export const Route = createFileRoute(
 });
 
 function ProjectPage() {
-  const { accountProject } = useAccountProject();
+  const { projectId: projectIdParam } = useParams({ strict: false });
+  const projectId = Number(projectIdParam);
+  const { data: accountProject } = useGetProject({
+    projectId,
+  });
+
+  if (!accountProject) return <Navigate to="/error" />;
 
   return (
     <PageGrid>
diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout.tsx
index 53ade1a5..54575afb 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout.tsx
@@ -1,8 +1,8 @@
-import { useAccountProject } from "@/components/Projects/projectStore";
 import { ContentBoxSkeleton } from "@/components/Shared/ContentBox/ContentBoxSkeleton";
 import { useBreadCrumb } from "@/components/Shared/layout/SideNav/breadCrumbStore";
 import { PageGrid } from "@/components/Shared/PageGrid";
 import { useGetSubmissionPackage } from "@/hooks/api/usePackages";
+import { useGetProject } from "@/hooks/api/useProjects";
 import { Grid } from "@mui/material";
 import {
   createFileRoute,
@@ -20,11 +20,15 @@ export const Route = createFileRoute(
 });
 
 export default function SubmissionLayout() {
+  const { projectId: projectIdParam } = useParams({ strict: false });
+  const projectId = Number(projectIdParam);
+  const { data: accountProject } = useGetProject({
+    projectId,
+  });
   const { submissionPackageId: submissionPackageIdParam } = useParams({
     strict: false,
   });
   const submissionPackageId = Number(submissionPackageIdParam);
-  const { accountProject, setSubmissionPackage } = useAccountProject();
   const META_TITLE = `Submission ${submissionPackageId}`;
   const { data: submissionPackage, isPending: isSubPackageLoading } =
     useGetSubmissionPackage({
@@ -36,16 +40,9 @@ export default function SubmissionLayout() {
 
   useEffect(() => {
     if (submissionPackage) {
-      setSubmissionPackage(submissionPackage);
       replaceBreadcrumb(META_TITLE, submissionPackage?.name || "");
     }
-  }, [
-    submissionPackage,
-    matches,
-    setSubmissionPackage,
-    replaceBreadcrumb,
-    META_TITLE,
-  ]);
+  }, [submissionPackage, matches, replaceBreadcrumb, META_TITLE]);
 
   if (isSubPackageLoading) {
     return (
diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/index.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/index.tsx
index 595fe9a3..ca1c01d0 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/index.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/index.tsx
@@ -4,13 +4,19 @@ import { ContentBox } from "@/components/Shared/ContentBox";
 import { YellowBar } from "@/components/Shared/YellowBar";
 import ItemsTable from "@/components/Submission/ItemsTable";
 import { Box, Button, Grid, Typography } from "@mui/material";
-import { createFileRoute, useNavigate } from "@tanstack/react-router";
+import {
+  createFileRoute,
+  Navigate,
+  useNavigate,
+  useParams,
+} from "@tanstack/react-router";
 import { BCDesignTokens } from "epic.theme";
 import { PageGrid } from "@/components/Shared/PageGrid";
 import SubmissionStatusChip from "@/components/Submission/SubmissionStatusChip";
 import { SUBMISSION_STATUS } from "@/models/Submission";
 import { InfoBox } from "@/components/Submission/InfoBox";
-import { useAccountProject } from "@/components/Projects/projectStore";
+import { useGetSubmissionPackage } from "@/hooks/api/usePackages";
+import { useGetProject } from "@/hooks/api/useProjects";
 
 export const Route = createFileRoute(
   "/_authenticated/_dashboard/projects/$projectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/"
@@ -19,9 +25,26 @@ export const Route = createFileRoute(
 });
 
 export default function SubmissionPage() {
-  const { accountProject, submissionPackage } = useAccountProject();
+  const { projectId: projectIdParam } = useParams({ strict: false });
+  const projectId = Number(projectIdParam);
+  const { data: accountProject } = useGetProject({
+    projectId,
+  });
+  const { submissionPackageId: submissionPackageIdParam } = useParams({
+    strict: false,
+  });
+  const submissionPackageId = Number(submissionPackageIdParam);
+  const { data: submissionPackage } = useGetSubmissionPackage({
+    packageId: submissionPackageId,
+    enabled: Boolean(accountProject?.id),
+  });
+
   const navigate = useNavigate();
 
+  if (!accountProject || !submissionPackage) {
+    return <Navigate to={"/error"} />;
+  }
+
   return (
     <PageGrid>
       <Grid item xs={12} lg={10}>

From d15c5d1729af4f3157834c5b85b2f4b358274a21 Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 13:09:32 -0400
Subject: [PATCH 02/11] remove project store

---
 .../src/components/Projects/projectStore.ts   | 36 -------------------
 1 file changed, 36 deletions(-)
 delete mode 100644 submit-web/src/components/Projects/projectStore.ts

diff --git a/submit-web/src/components/Projects/projectStore.ts b/submit-web/src/components/Projects/projectStore.ts
deleted file mode 100644
index 06a2a3c5..00000000
--- a/submit-web/src/components/Projects/projectStore.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import {
-  createDefaultSubmissionPackage,
-  SubmissionPackage,
-} from "@/models/Package";
-import { AccountProject, createDefaultAccountProject } from "@/models/Project";
-import { create } from "zustand";
-
-// Define the store state and actions
-interface AccountProjectStore {
-  accountProject: AccountProject;
-  submissionPackage: SubmissionPackage;
-  setAccountProject: (accountProject: AccountProject) => void;
-  setSubmissionPackage: (submissionPackage: SubmissionPackage) => void;
-  reset: () => void;
-}
-
-// Create the Zustand store
-export const useAccountProject = create<AccountProjectStore>((set) => ({
-  accountProject: createDefaultAccountProject(),
-  submissionPackage: createDefaultSubmissionPackage(),
-  setAccountProject: (accountProject) => {
-    set(() => ({
-      accountProject,
-    }));
-  },
-  setSubmissionPackage: (submissionPackage) => {
-    set(() => ({
-      submissionPackage,
-    }));
-  },
-  reset: () => {
-    set({
-      accountProject: createDefaultAccountProject(),
-    });
-  },
-}));

From 338c0fc1130ddd061059c7d52a11324e76b16792 Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 13:14:22 -0400
Subject: [PATCH 03/11] setup refetch

---
 .../projects/$projectId/_projectLayout/new-submission.tsx     | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
index 74f74a3c..be14c444 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
@@ -16,7 +16,7 @@ import { Box, Grid, Typography } from "@mui/material";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
 import { BCDesignTokens } from "epic.theme";
 import { useEffect } from "react";
-
+import { useQueryClient } from "@tanstack/react-query";
 export const Route = createFileRoute(
   "/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission"
 )({
@@ -28,6 +28,7 @@ export function NewManagementPlan() {
   // get the projectId from the route
   const { projectId } = Route.useParams();
   const { setIsOpen } = useLoaderBackdrop();
+  const queryClient = useQueryClient();
   const { data: accountProject, isPending: isProjectPending } = useGetProject({
     projectId: Number(projectId),
   });
@@ -41,6 +42,7 @@ export function NewManagementPlan() {
     navigate({
       to: `/projects/${projectId}/submission-packages/${createdSubmissionPackage.id}`,
     });
+    queryClient.invalidateQueries({ queryKey: ["project", projectId] });
   };
   const {
     mutate: createSubmissionPackage,

From a192c65555878efc8befc4f9f8708ad8f1b2016e Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 13:20:40 -0400
Subject: [PATCH 04/11] setup query client inside the
 usecreatesubmissionpackage hook

---
 submit-web/src/hooks/api/usePackages.tsx             | 12 ++++++++++--
 .../$projectId/_projectLayout/new-submission.tsx     |  6 ++----
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/submit-web/src/hooks/api/usePackages.tsx b/submit-web/src/hooks/api/usePackages.tsx
index 42e52f3b..2454e92b 100644
--- a/submit-web/src/hooks/api/usePackages.tsx
+++ b/submit-web/src/hooks/api/usePackages.tsx
@@ -1,8 +1,10 @@
 import { request } from "@/utils/axiosUtils";
-import { useMutation, useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { Options } from "./types";
 import { SubmissionPackage } from "@/models/Package";
 
+const queryClient = useQueryClient();
+
 const createSubmissionPackage = ({
   accountProjectId,
   data,
@@ -17,10 +19,16 @@ const createSubmissionPackage = ({
   });
 };
 
-export const useCreateSubmissionPackage = (options?: Options) => {
+export const useCreateSubmissionPackage = (
+  projectId: string,
+  options?: Options
+) => {
   return useMutation({
     mutationFn: createSubmissionPackage,
     ...options,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["project", projectId] });
+    },
   });
 };
 
diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
index be14c444..ff409646 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
@@ -16,7 +16,7 @@ import { Box, Grid, Typography } from "@mui/material";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
 import { BCDesignTokens } from "epic.theme";
 import { useEffect } from "react";
-import { useQueryClient } from "@tanstack/react-query";
+
 export const Route = createFileRoute(
   "/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission"
 )({
@@ -28,7 +28,6 @@ export function NewManagementPlan() {
   // get the projectId from the route
   const { projectId } = Route.useParams();
   const { setIsOpen } = useLoaderBackdrop();
-  const queryClient = useQueryClient();
   const { data: accountProject, isPending: isProjectPending } = useGetProject({
     projectId: Number(projectId),
   });
@@ -42,12 +41,11 @@ export function NewManagementPlan() {
     navigate({
       to: `/projects/${projectId}/submission-packages/${createdSubmissionPackage.id}`,
     });
-    queryClient.invalidateQueries({ queryKey: ["project", projectId] });
   };
   const {
     mutate: createSubmissionPackage,
     isPending: isCreatingSubmissionPackagePending,
-  } = useCreateSubmissionPackage({
+  } = useCreateSubmissionPackage(projectId, {
     onError: onCreateFailure,
     onSuccess: onCreateSuccess,
   });

From 0f1b79b12aec2a7074ab91c92e6f42022a438a8d Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 13:21:30 -0400
Subject: [PATCH 05/11] revert setting it up inside a hook since its not
 allowed

---
 submit-web/src/hooks/api/usePackages.tsx             | 12 ++----------
 .../$projectId/_projectLayout/new-submission.tsx     |  6 ++++--
 2 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/submit-web/src/hooks/api/usePackages.tsx b/submit-web/src/hooks/api/usePackages.tsx
index 2454e92b..42e52f3b 100644
--- a/submit-web/src/hooks/api/usePackages.tsx
+++ b/submit-web/src/hooks/api/usePackages.tsx
@@ -1,10 +1,8 @@
 import { request } from "@/utils/axiosUtils";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { useMutation, useQuery } from "@tanstack/react-query";
 import { Options } from "./types";
 import { SubmissionPackage } from "@/models/Package";
 
-const queryClient = useQueryClient();
-
 const createSubmissionPackage = ({
   accountProjectId,
   data,
@@ -19,16 +17,10 @@ const createSubmissionPackage = ({
   });
 };
 
-export const useCreateSubmissionPackage = (
-  projectId: string,
-  options?: Options
-) => {
+export const useCreateSubmissionPackage = (options?: Options) => {
   return useMutation({
     mutationFn: createSubmissionPackage,
     ...options,
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ["project", projectId] });
-    },
   });
 };
 
diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
index ff409646..be14c444 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
@@ -16,7 +16,7 @@ import { Box, Grid, Typography } from "@mui/material";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
 import { BCDesignTokens } from "epic.theme";
 import { useEffect } from "react";
-
+import { useQueryClient } from "@tanstack/react-query";
 export const Route = createFileRoute(
   "/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission"
 )({
@@ -28,6 +28,7 @@ export function NewManagementPlan() {
   // get the projectId from the route
   const { projectId } = Route.useParams();
   const { setIsOpen } = useLoaderBackdrop();
+  const queryClient = useQueryClient();
   const { data: accountProject, isPending: isProjectPending } = useGetProject({
     projectId: Number(projectId),
   });
@@ -41,11 +42,12 @@ export function NewManagementPlan() {
     navigate({
       to: `/projects/${projectId}/submission-packages/${createdSubmissionPackage.id}`,
     });
+    queryClient.invalidateQueries({ queryKey: ["project", projectId] });
   };
   const {
     mutate: createSubmissionPackage,
     isPending: isCreatingSubmissionPackagePending,
-  } = useCreateSubmissionPackage(projectId, {
+  } = useCreateSubmissionPackage({
     onError: onCreateFailure,
     onSuccess: onCreateSuccess,
   });

From fa544c81f20443cb21138bde1c71c595eb49cec0 Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 13:24:45 -0400
Subject: [PATCH 06/11] setup missed input mask

---
 .../src/components/SubmissionItem/ContactInformation/index.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/submit-web/src/components/SubmissionItem/ContactInformation/index.tsx b/submit-web/src/components/SubmissionItem/ContactInformation/index.tsx
index 8ed8df8e..3ec15c14 100644
--- a/submit-web/src/components/SubmissionItem/ContactInformation/index.tsx
+++ b/submit-web/src/components/SubmissionItem/ContactInformation/index.tsx
@@ -156,8 +156,9 @@ export const ContactInformation = () => {
                     />
                   </Grid>
                   <Grid item xs={12}>
-                    <ControlledTextField
+                    <ControlledInputMask
                       name="primaryContact.workPhoneNumber"
+                      mask="(999) 999-9999"
                       label="Work Phone Number"
                     />
                   </Grid>

From b8cc4f7d9170d9490caa9b7a77c306fa3b20b776 Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 13:47:06 -0400
Subject: [PATCH 07/11] invalidate query inside mutation level

---
 submit-web/src/hooks/api/usePackages.tsx              | 11 +++++++++--
 .../$projectId/_projectLayout/new-submission.tsx      |  4 +---
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/submit-web/src/hooks/api/usePackages.tsx b/submit-web/src/hooks/api/usePackages.tsx
index 42e52f3b..6cba49e9 100644
--- a/submit-web/src/hooks/api/usePackages.tsx
+++ b/submit-web/src/hooks/api/usePackages.tsx
@@ -1,5 +1,5 @@
 import { request } from "@/utils/axiosUtils";
-import { useMutation, useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { Options } from "./types";
 import { SubmissionPackage } from "@/models/Package";
 
@@ -17,10 +17,17 @@ const createSubmissionPackage = ({
   });
 };
 
-export const useCreateSubmissionPackage = (options?: Options) => {
+export const useCreateSubmissionPackage = (
+  projectId: string,
+  options?: Options
+) => {
+  const queryClient = useQueryClient();
   return useMutation({
     mutationFn: createSubmissionPackage,
     ...options,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["project", projectId] });
+    },
   });
 };
 
diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
index be14c444..a6d33da5 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
@@ -28,7 +28,6 @@ export function NewManagementPlan() {
   // get the projectId from the route
   const { projectId } = Route.useParams();
   const { setIsOpen } = useLoaderBackdrop();
-  const queryClient = useQueryClient();
   const { data: accountProject, isPending: isProjectPending } = useGetProject({
     projectId: Number(projectId),
   });
@@ -42,12 +41,11 @@ export function NewManagementPlan() {
     navigate({
       to: `/projects/${projectId}/submission-packages/${createdSubmissionPackage.id}`,
     });
-    queryClient.invalidateQueries({ queryKey: ["project", projectId] });
   };
   const {
     mutate: createSubmissionPackage,
     isPending: isCreatingSubmissionPackagePending,
-  } = useCreateSubmissionPackage({
+  } = useCreateSubmissionPackage(projectId, {
     onError: onCreateFailure,
     onSuccess: onCreateSuccess,
   });

From 581e584ca81d02eeebd643261341729c4c3e1034 Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 13:55:16 -0400
Subject: [PATCH 08/11] small fix for linting

---
 submit-web/src/components/Submission/SubmissionItemTableRow.tsx | 2 +-
 .../projects/$projectId/_projectLayout/new-submission.tsx       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/submit-web/src/components/Submission/SubmissionItemTableRow.tsx b/submit-web/src/components/Submission/SubmissionItemTableRow.tsx
index c4ec1586..bec8b26c 100644
--- a/submit-web/src/components/Submission/SubmissionItemTableRow.tsx
+++ b/submit-web/src/components/Submission/SubmissionItemTableRow.tsx
@@ -18,7 +18,7 @@ type SubmissionItemTableRowProps = {
 const StyledTableCell = styled(TableCell)(() => ({
   borderTop: `1px solid ${BCDesignTokens.themeBlue20}`,
   borderBottom: `1px solid ${BCDesignTokens.themeBlue20}`,
-  padding: `${BCDesignTokens.layoutPaddingSmall} !important`,
+  padding: `${BCDesignTokens.layoutPaddingXsmall} !important`,
   "&:first-of-type": {
     borderLeft: `1px solid ${BCDesignTokens.themeBlue20}`,
     borderTopLeftRadius: 5,
diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
index a6d33da5..ff409646 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
@@ -16,7 +16,7 @@ import { Box, Grid, Typography } from "@mui/material";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
 import { BCDesignTokens } from "epic.theme";
 import { useEffect } from "react";
-import { useQueryClient } from "@tanstack/react-query";
+
 export const Route = createFileRoute(
   "/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission"
 )({

From 7bd1d376d93f26c38ead1532ab4542ae25569d2b Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 14:05:36 -0400
Subject: [PATCH 09/11] setup options on success

---
 .../src/components/Submission/SubmissionItemTableRow.tsx       | 1 +
 submit-web/src/hooks/api/usePackages.tsx                       | 3 +++
 2 files changed, 4 insertions(+)

diff --git a/submit-web/src/components/Submission/SubmissionItemTableRow.tsx b/submit-web/src/components/Submission/SubmissionItemTableRow.tsx
index bec8b26c..3ff5b9da 100644
--- a/submit-web/src/components/Submission/SubmissionItemTableRow.tsx
+++ b/submit-web/src/components/Submission/SubmissionItemTableRow.tsx
@@ -75,6 +75,7 @@ export default function SubmissionItemTableRow({
             style={{
               color: BCDesignTokens.typographyColorLink,
               textDecoration: "none",
+              marginRight: BCDesignTokens.layoutMarginSmall,
             }}
             to={`/projects/${projectId}/submission-packages/${submissionPackageId}/submissions/${item.id}`}
           >
diff --git a/submit-web/src/hooks/api/usePackages.tsx b/submit-web/src/hooks/api/usePackages.tsx
index 6cba49e9..3fd1dc47 100644
--- a/submit-web/src/hooks/api/usePackages.tsx
+++ b/submit-web/src/hooks/api/usePackages.tsx
@@ -27,6 +27,9 @@ export const useCreateSubmissionPackage = (
     ...options,
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ["project", projectId] });
+      if (options && options.onSuccess) {
+        options.onSuccess();
+      }
     },
   });
 };

From 10539fba46e8e34b35111d72320a1976d488bc66 Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Fri, 13 Sep 2024 14:15:54 -0400
Subject: [PATCH 10/11] setup options

---
 submit-web/src/hooks/api/usePackages.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/submit-web/src/hooks/api/usePackages.tsx b/submit-web/src/hooks/api/usePackages.tsx
index 3fd1dc47..e352a2b1 100644
--- a/submit-web/src/hooks/api/usePackages.tsx
+++ b/submit-web/src/hooks/api/usePackages.tsx
@@ -26,9 +26,11 @@ export const useCreateSubmissionPackage = (
     mutationFn: createSubmissionPackage,
     ...options,
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ["project", projectId] });
       if (options && options.onSuccess) {
         options.onSuccess();
+        queryClient.invalidateQueries({
+          queryKey: ["project", projectId],
+        });
       }
     },
   });

From 5242bdae4863159e3fa10989a8280595000863c8 Mon Sep 17 00:00:00 2001
From: David Nunez <david.nunez@aot-technologies.com>
Date: Mon, 16 Sep 2024 10:22:52 -0400
Subject: [PATCH 11/11] revert to working version

---
 submit-web/src/hooks/api/usePackages.tsx         | 16 ++--------------
 .../$projectId/_projectLayout/new-submission.tsx |  7 ++++++-
 2 files changed, 8 insertions(+), 15 deletions(-)

diff --git a/submit-web/src/hooks/api/usePackages.tsx b/submit-web/src/hooks/api/usePackages.tsx
index e352a2b1..42e52f3b 100644
--- a/submit-web/src/hooks/api/usePackages.tsx
+++ b/submit-web/src/hooks/api/usePackages.tsx
@@ -1,5 +1,5 @@
 import { request } from "@/utils/axiosUtils";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { useMutation, useQuery } from "@tanstack/react-query";
 import { Options } from "./types";
 import { SubmissionPackage } from "@/models/Package";
 
@@ -17,22 +17,10 @@ const createSubmissionPackage = ({
   });
 };
 
-export const useCreateSubmissionPackage = (
-  projectId: string,
-  options?: Options
-) => {
-  const queryClient = useQueryClient();
+export const useCreateSubmissionPackage = (options?: Options) => {
   return useMutation({
     mutationFn: createSubmissionPackage,
     ...options,
-    onSuccess: () => {
-      if (options && options.onSuccess) {
-        options.onSuccess();
-        queryClient.invalidateQueries({
-          queryKey: ["project", projectId],
-        });
-      }
-    },
   });
 };
 
diff --git a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
index ff409646..0db0ddba 100644
--- a/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
+++ b/submit-web/src/routes/_authenticated/_dashboard/projects/$projectId/_projectLayout/new-submission.tsx
@@ -13,6 +13,7 @@ import { useCreateSubmissionPackage } from "@/hooks/api/usePackages";
 import { useGetProject } from "@/hooks/api/useProjects";
 import { SubmissionPackage } from "@/models/Package";
 import { Box, Grid, Typography } from "@mui/material";
+import { useQueryClient } from "@tanstack/react-query";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
 import { BCDesignTokens } from "epic.theme";
 import { useEffect } from "react";
@@ -26,6 +27,7 @@ export const Route = createFileRoute(
 
 export function NewManagementPlan() {
   // get the projectId from the route
+  const queryClient = useQueryClient();
   const { projectId } = Route.useParams();
   const { setIsOpen } = useLoaderBackdrop();
   const { data: accountProject, isPending: isProjectPending } = useGetProject({
@@ -37,6 +39,9 @@ export function NewManagementPlan() {
     notify.error("Failed to create submission package");
 
   const onCreateSuccess = (createdSubmissionPackage: SubmissionPackage) => {
+    queryClient.invalidateQueries({
+      queryKey: ["project", projectId],
+    });
     notify.success("Submission package created successfully");
     navigate({
       to: `/projects/${projectId}/submission-packages/${createdSubmissionPackage.id}`,
@@ -45,7 +50,7 @@ export function NewManagementPlan() {
   const {
     mutate: createSubmissionPackage,
     isPending: isCreatingSubmissionPackagePending,
-  } = useCreateSubmissionPackage(projectId, {
+  } = useCreateSubmissionPackage({
     onError: onCreateFailure,
     onSuccess: onCreateSuccess,
   });