fix: modals await network requests

frontend/src/components/common/DeleteModal.tsx

@@ -50,7 +50,13 @@ const DeleteModal = ({
             <Button mr={3} onClick={onClose}>
               <Text>Cancel</Text>
             </Button>
-            <Button colorScheme="red" onClick={onDelete}>
+            <Button
+              colorScheme="red"
+              onClick={() => {
+                onClose();
+                onDelete();
+              }}
+            >
               {buttonLabel}
             </Button>
           </HStack>

frontend/src/components/pages/AccessControl/index.tsx

@@ -182,7 +182,6 @@ const AccessControlPage = (): JSX.Element => {
         duration: 3000,
       });
     }
-    onClose();
     setUserToChangeStatus(null);
   };
 
@@ -217,9 +216,13 @@ const AccessControlPage = (): JSX.Element => {
         buttonColor={userToChangeStatus?.active ? "red" : "green"}
         isOpen={isOpen}
         onClose={onClose}
-        onChangeStatus={() =>
-          userToChangeStatus && handleStatusChange(userToChangeStatus)
-        }
+        onChangeStatus={() => {
+          if (userToChangeStatus) {
+            handleStatusChange(userToChangeStatus);
+          }
+
+          onClose();
+        }}
       />
       <Text mb="35px" textStyle="displayXLarge">
         FON Staff Access Control

frontend/src/components/pages/CampOverview/CampersTable/WaitlistedCampersTable.tsx

@@ -108,7 +108,6 @@ const WaitlistedCampersTable = ({
         waitlistedCamper.id,
       );
 
-      onClose();
       if (deletedWaitlistedCamperResponse) {
         toast({
           description: `${camperToDeleteName} has been removed from the waitlist for this camp session.`,

frontend/src/components/pages/CampsList/index.tsx

@@ -71,7 +71,6 @@ const CampsListPage = (): React.ReactElement => {
         duration: 3000,
       });
     }
-    onDeleteModalClose();
     setCampToDelete(null);
   };
 
@@ -89,7 +88,7 @@ const CampsListPage = (): React.ReactElement => {
         buttonLabel="Remove"
         isOpen={isDeleteModalOpen}
         onClose={onDeleteModalClose}
-        onDelete={() => handleConfirmDelete()}
+        onDelete={handleConfirmDelete}
       />
       <Flex
         width={isDrawerOpen ? "calc(100% - 500px)" : "100%"}

frontend/src/components/pages/RegistrantExperience/RegistrationSteps/PersonalInfo/CamperCard.tsx

@@ -136,7 +136,6 @@ const CamperCard = ({
           isClosable: false,
           variant: "subtle",
         });
-        onClose();
       },
     });