fix: Active submission prompt persisting past first save

Also migrates to Notistack for this specific page

src/content/organizations/OrganizationView.tsx

@@ -6,12 +6,12 @@ import {
   OutlinedInput, Select, Stack, Typography,
   styled,
 } from '@mui/material';
+import { useSnackbar } from 'notistack';
 import { cloneDeep } from 'lodash';
 import { Controller, useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';
 import bannerSvg from '../../assets/banner/profile_banner.png';
 import profileIcon from '../../assets/icons/organization.svg';
-import GenericAlert from '../../components/GenericAlert';
 import SuspenseLoader from '../../components/SuspenseLoader';
 import {
   CREATE_ORG, CreateOrgResp,
@@ -156,13 +156,13 @@ const inactiveSubmissionStatus: SubmissionStatus[] = ["Completed", "Archived"];
  */
 const OrganizationView: FC<Props> = ({ _id }: Props) => {
   const navigate = useNavigate();
+  const { enqueueSnackbar } = useSnackbar();
 
   const [organization, setOrganization] = useState<Organization | null>(null);
   const [dataSubmissions, setDataSubmissions] = useState<Partial<Submission>[] | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [saving, setSaving] = useState<boolean>(false);
   const [confirmOpen, setConfirmOpen] = useState<boolean>(false);
-  const [changesAlert, setChangesAlert] = useState<string>("");
 
   const assignedStudies: string[] = useMemo(() => {
     const activeStudies = {};
@@ -258,7 +258,7 @@ const OrganizationView: FC<Props> = ({ _id }: Props) => {
 
       setOrganization(null);
       setDataSubmissions(null);
-      setChangesAlert("This organization has been successfully added.");
+      enqueueSnackbar("This organization has been successfully added.", { variant: "default" });
       reset();
     } else {
       const { data: d, errors } = await editOrganization({ variables: { orgID: organization._id, ...variables, } })
@@ -270,12 +270,12 @@ const OrganizationView: FC<Props> = ({ _id }: Props) => {
         return;
       }
 
-      setChangesAlert("All changes have been saved");
+      enqueueSnackbar("All changes have been saved.", { variant: "default" });
       setFormValues(data);
+      setOrganization((prev: Organization) => ({ ...prev, studies: d.editOrganization.studies }));
     }
 
     setError(null);
-    setTimeout(() => setChangesAlert(""), 10000);
   };
 
   /**
@@ -331,11 +331,6 @@ const OrganizationView: FC<Props> = ({ _id }: Props) => {
 
   return (
     <>
-      <GenericAlert open={!!changesAlert} key="organization-changes-alert">
-        <span>
-          {changesAlert}
-        </span>
-      </GenericAlert>
       <StyledBanner />
       <StyledContainer maxWidth="lg">
         <Stack

src/graphql/editOrganization.ts

@@ -4,10 +4,20 @@ export const mutation = gql`
   mutation editOrganization($orgID: ID!, $name: String, $conciergeID: String, $studies: [ApprovedStudyInput], $status: String) {
     editOrganization(orgID: $orgID, name: $name, conciergeID: $conciergeID, studies: $studies, status: $status) {
       _id
+      name
+      status
+      conciergeID
+      conciergeName
+      studies {
+        studyName
+        studyAbbreviation
+      }
+      createdAt
+      updateAt
     }
   }
 `;
 
 export type Response = {
-  editOrganization: Pick<Organization, "_id">;
+  editOrganization: Organization;
 };

src/graphql/getOrganization.ts

@@ -12,6 +12,8 @@ export const query = gql`
         studyName
         studyAbbreviation
       }
+      createdAt
+      updateAt
     }
     listSubmissions(first: -1, offset: 0, orderBy: "updatedAt", sortDirection: "ASC", organization: $organization, status: "All") {
       submissions {