address review comments

ral-facilities · Aug 17, 2023 · 1352b47 · 1352b47
1 parent bfc63a9
commit 1352b47
Show file tree

Hide file tree

Showing 12 changed files with 145 additions and 165 deletions.
diff --git a/src/api/sessions.tsx b/src/api/sessions.tsx
@@ -4,6 +4,7 @@ import {
   UseMutationResult,
   useQuery,
   UseQueryResult,
+  useQueryClient,
 } from '@tanstack/react-query';
 import { Session, SessionListItem, SessionResponse } from '../app.types';
 import { useAppSelector } from '../state/hooks';
@@ -32,10 +33,14 @@ export const useSaveSession = (): UseMutationResult<
   Session
 > => {
   const { apiUrl } = useAppSelector(selectUrls);
+  const queryClient = useQueryClient();
   return useMutation((session: Session) => saveSession(apiUrl, session), {
     onError: (error) => {
       console.log('Got error ' + error.message);
     },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['sessionList'] });
+    },
   });
 };
 
@@ -65,12 +70,17 @@ export const useEditSession = (): UseMutationResult<
   SessionResponse
 > => {
   const { apiUrl } = useAppSelector(selectUrls);
+  const queryClient = useQueryClient();
   return useMutation(
     (session: SessionResponse) => editSession(apiUrl, session),
     {
       onError: (error) => {
         console.log('Got error ' + error.message);
       },
+      onSuccess: () => {
+        queryClient.invalidateQueries({ queryKey: ['sessionList'] });
+        queryClient.invalidateQueries({ queryKey: ['session'] });
+      },
     }
   );
 };
@@ -94,12 +104,16 @@ export const useDeleteSession = (): UseMutationResult<
   SessionResponse
 > => {
   const { apiUrl } = useAppSelector(selectUrls);
+  const queryClient = useQueryClient();
   return useMutation(
     (session: SessionResponse) => deleteSession(apiUrl, session),
     {
       onError: (error) => {
         console.log('Got error ' + error.message);
       },
+      onSuccess: () => {
+        queryClient.invalidateQueries({ queryKey: ['sessionList'] });
+      },
     }
   );
 };

diff --git a/src/session/__snapshots__/sessionDrawer.component.test.tsx.snap b/src/session/__snapshots__/sessionDrawer.component.test.tsx.snap
@@ -68,7 +68,7 @@ exports[`session Drawer renders correctly 1`] = `
                 </span>
               </div>
               <div
-                class="MuiBox-root css-0"
+                class="MuiBox-root css-epvm6"
               >
                 <button
                   aria-label="edit Session 3 session"
@@ -136,7 +136,7 @@ exports[`session Drawer renders correctly 1`] = `
                 </span>
               </div>
               <div
-                class="MuiBox-root css-0"
+                class="MuiBox-root css-epvm6"
               >
                 <button
                   aria-label="edit Session 1 session"
@@ -204,7 +204,7 @@ exports[`session Drawer renders correctly 1`] = `
                 </span>
               </div>
               <div
-                class="MuiBox-root css-0"
+                class="MuiBox-root css-epvm6"
               >
                 <button
                   aria-label="edit Session 4 session"
@@ -272,7 +272,7 @@ exports[`session Drawer renders correctly 1`] = `
                 </span>
               </div>
               <div
-                class="MuiBox-root css-0"
+                class="MuiBox-root css-epvm6"
               >
                 <button
                   aria-label="edit Session 2 session"

diff --git a/src/session/deleteSessionDialogue.component.test.tsx b/src/session/deleteSessionDialogue.component.test.tsx
@@ -10,7 +10,6 @@ describe('delete session dialogue', () => {
   let props: DeleteSessionDialogueProps;
   let user;
   const onClose = jest.fn();
-  const refetchSessionsList = jest.fn();
   const onDeleteLoadedsession = jest.fn();
 
   const createView = (): RenderResult => {
@@ -28,7 +27,6 @@ describe('delete session dialogue', () => {
     props = {
       open: true,
       onClose: onClose,
-      refetchSessionsList: refetchSessionsList,
       sessionData: sessionData,
       onDeleteLoadedsession: onDeleteLoadedsession,
       loadedSessionId: undefined,
@@ -77,7 +75,6 @@ describe('delete session dialogue', () => {
     await waitFor(() => {
       expect(onClose).toHaveBeenCalled();
     });
-    expect(refetchSessionsList).toHaveBeenCalled();
   });
 
   it('calls handleDeleteSession when continue button is clicked with a valid session name and clears loaded session id', async () => {
@@ -89,7 +86,6 @@ describe('delete session dialogue', () => {
     await waitFor(() => {
       expect(onClose).toHaveBeenCalled();
     });
-    expect(refetchSessionsList).toHaveBeenCalled();
     expect(onDeleteLoadedsession).toHaveBeenCalled();
   });
 });
diff --git a/src/session/deleteSessionDialogue.component.tsx b/src/session/deleteSessionDialogue.component.tsx
@@ -14,20 +14,13 @@ export interface DeleteSessionDialogueProps {
   open: boolean;
   onClose: () => void;
   sessionData: SessionResponse | undefined;
-  refetchSessionsList: () => void;
   loadedSessionId: string | undefined;
   onDeleteLoadedsession: () => void;
 }
 
 const DeleteSessionDialogue = (props: DeleteSessionDialogueProps) => {
-  const {
-    open,
-    onClose,
-    sessionData,
-    refetchSessionsList,
-    loadedSessionId,
-    onDeleteLoadedsession,
-  } = props;
+  const { open, onClose, sessionData, loadedSessionId, onDeleteLoadedsession } =
+    props;
 
   const [error, setError] = useState(false);
   const [errorMessage, setErrorMessage] = React.useState<string | undefined>(
@@ -40,7 +33,6 @@ const DeleteSessionDialogue = (props: DeleteSessionDialogueProps) => {
     if (sessionData) {
       deleteSession(sessionData)
         .then((response) => {
-          refetchSessionsList();
           if (loadedSessionId === sessionData._id) {
             onDeleteLoadedsession();
           }
@@ -59,7 +51,6 @@ const DeleteSessionDialogue = (props: DeleteSessionDialogueProps) => {
     loadedSessionId,
     onClose,
     onDeleteLoadedsession,
-    refetchSessionsList,
     sessionData,
   ]);
 

diff --git a/src/session/sessionDialogue.component.test.tsx b/src/session/sessionDialogue.component.test.tsx
@@ -13,7 +13,6 @@ describe('session dialogue', () => {
   const onChangeSessionName = jest.fn();
   const onChangeSessionSummary = jest.fn();
   const onChangeLoadedSessionId = jest.fn();
-  const refetchSessionsList = jest.fn();
   const onChangeAutoSaveSessionId = jest.fn();
 
   const createView = (): RenderResult => {
@@ -31,7 +30,6 @@ describe('session dialogue', () => {
         onChangeSessionSummary: onChangeSessionSummary,
         requestType: 'create',
         onChangeLoadedSessionId: onChangeLoadedSessionId,
-        refetchSessionsList: refetchSessionsList,
         onChangeAutoSaveSessionId: onChangeAutoSaveSessionId,
       };
 
@@ -97,7 +95,6 @@ describe('session dialogue', () => {
       await waitFor(() => {
         expect(onClose).toHaveBeenCalled();
       });
-      expect(refetchSessionsList).toHaveBeenCalled();
       expect(onChangeLoadedSessionId).toHaveBeenCalledWith('1');
       expect(onChangeAutoSaveSessionId).toHaveBeenCalledWith(undefined);
     });
@@ -122,7 +119,6 @@ describe('session dialogue', () => {
         onChangeSessionSummary: onChangeSessionSummary,
         requestType: 'edit',
         onChangeLoadedSessionId: onChangeLoadedSessionId,
-        refetchSessionsList: refetchSessionsList,
         sessionData: sessionData,
         onChangeAutoSaveSessionId: onChangeAutoSaveSessionId,
       };
@@ -161,8 +157,6 @@ describe('session dialogue', () => {
       await waitFor(() => {
         expect(onClose).toHaveBeenCalled();
       });
-      expect(refetchSessionsList).toHaveBeenCalled();
-      expect(onChangeAutoSaveSessionId).toHaveBeenCalledWith(undefined);
     });
   });
 });
diff --git a/src/session/sessionDialogue.component.tsx b/src/session/sessionDialogue.component.tsx
@@ -20,7 +20,6 @@ export interface SessionDialogueProps {
   onChangeSessionSummary: (sessionSummary: string) => void;
   requestType: 'edit' | 'create';
   onChangeLoadedSessionId: (loadedSessionId: string | undefined) => void;
-  refetchSessionsList: () => void;
   onChangeAutoSaveSessionId: (autoSaveSessionId: string | undefined) => void;
   sessionData?: SessionResponse;
 }
@@ -36,7 +35,6 @@ const SessionDialogue = (props: SessionDialogueProps) => {
     requestType,
     sessionData,
     onChangeLoadedSessionId,
-    refetchSessionsList,
     onChangeAutoSaveSessionId,
   } = props;
 
@@ -65,7 +63,6 @@ const SessionDialogue = (props: SessionDialogueProps) => {
       };
       saveSession(session)
         .then((response) => {
-          refetchSessionsList();
           onChangeAutoSaveSessionId(undefined);
           onChangeLoadedSessionId(response);
           handleClose();
@@ -83,7 +80,6 @@ const SessionDialogue = (props: SessionDialogueProps) => {
     handleClose,
     onChangeAutoSaveSessionId,
     onChangeLoadedSessionId,
-    refetchSessionsList,
     saveSession,
     sessionName,
     sessionSummary,
@@ -103,8 +99,6 @@ const SessionDialogue = (props: SessionDialogueProps) => {
 
       editSession(session)
         .then((response) => {
-          refetchSessionsList();
-          onChangeAutoSaveSessionId(undefined);
           handleClose();
         })
         .catch((error) => {
@@ -116,15 +110,7 @@ const SessionDialogue = (props: SessionDialogueProps) => {
       setError(true);
       setErrorMessage('Please enter a name');
     }
-  }, [
-    sessionName,
-    sessionData,
-    sessionSummary,
-    editSession,
-    refetchSessionsList,
-    onChangeAutoSaveSessionId,
-    handleClose,
-  ]);
+  }, [sessionName, sessionData, sessionSummary, editSession, handleClose]);
 
   return (
     <Dialog open={open} onClose={handleClose} maxWidth="lg">

diff --git a/src/session/sessionDrawer.component.test.tsx b/src/session/sessionDrawer.component.test.tsx
@@ -10,8 +10,7 @@ describe('session Drawer', () => {
   const openSessionEdit = jest.fn();
   const openSessionDelete = jest.fn();
   const onChangeLoadedSessionId = jest.fn();
-  const onChangeSelectedSessionTimestamp = jest.fn();
-  const refetchSessionsData = jest.fn();
+  const onChangeLoadedSessionTimestamp = jest.fn();
   const onChangeAutoSaveSessionId = jest.fn();
   let user;
   let props: SessionDrawerProps;
@@ -25,10 +24,10 @@ describe('session Drawer', () => {
       openSessionEdit: openSessionEdit,
       openSessionDelete: openSessionDelete,
       loadedSessionId: undefined,
+      loadedSessionData: undefined,
       onChangeLoadedSessionId: onChangeLoadedSessionId,
       sessionsList: SessionsListJSON,
-      onChangeSelectedSessionTimestamp: onChangeSelectedSessionTimestamp,
-      refetchSessionsData: refetchSessionsData,
+      onChangeLoadedSessionTimestamp: onChangeLoadedSessionTimestamp,
       onChangeAutoSaveSessionId: onChangeAutoSaveSessionId,
     };
   });
@@ -67,11 +66,11 @@ describe('session Drawer', () => {
       expect(session1).toHaveStyle('background-color: primary.main');
     });
 
-    expect(onChangeSelectedSessionTimestamp).toHaveBeenCalledWith(
+    expect(onChangeLoadedSessionTimestamp).toHaveBeenCalledWith(
       '2023-06-29T10:30:00',
       true
     );
-    expect(refetchSessionsData).toHaveBeenCalledWith('1');
+
     expect(onChangeAutoSaveSessionId).toHaveBeenCalledWith(undefined);
   });