From ed5bcc500ec12fd5230a466788d23a35748a573c Mon Sep 17 00:00:00 2001
From: e-wai <40974372+e-wai@users.noreply.github.com>
Date: Mon, 16 Jan 2023 04:11:04 +0800
Subject: [PATCH] fix: modals await network requests

---
 frontend/src/components/common/DeleteModal.tsx        |  8 +++++++-
 frontend/src/components/pages/AccessControl/index.tsx | 11 +++++++----
 .../CampersTable/WaitlistedCampersTable.tsx           |  1 -
 frontend/src/components/pages/CampsList/index.tsx     |  3 +--
 .../RegistrationSteps/PersonalInfo/CamperCard.tsx     |  1 -
 5 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/frontend/src/components/common/DeleteModal.tsx b/frontend/src/components/common/DeleteModal.tsx
index a87fc934..a60ca3cc 100644
--- a/frontend/src/components/common/DeleteModal.tsx
+++ b/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>
diff --git a/frontend/src/components/pages/AccessControl/index.tsx b/frontend/src/components/pages/AccessControl/index.tsx
index 74609174..7ca9ecab 100644
--- a/frontend/src/components/pages/AccessControl/index.tsx
+++ b/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
diff --git a/frontend/src/components/pages/CampOverview/CampersTable/WaitlistedCampersTable.tsx b/frontend/src/components/pages/CampOverview/CampersTable/WaitlistedCampersTable.tsx
index e4aefbff..258f89cd 100644
--- a/frontend/src/components/pages/CampOverview/CampersTable/WaitlistedCampersTable.tsx
+++ b/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.`,
diff --git a/frontend/src/components/pages/CampsList/index.tsx b/frontend/src/components/pages/CampsList/index.tsx
index cf081f74..69a796d5 100644
--- a/frontend/src/components/pages/CampsList/index.tsx
+++ b/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%"}
diff --git a/frontend/src/components/pages/RegistrantExperience/RegistrationSteps/PersonalInfo/CamperCard.tsx b/frontend/src/components/pages/RegistrantExperience/RegistrationSteps/PersonalInfo/CamperCard.tsx
index 69dd1d2e..ef9ec726 100644
--- a/frontend/src/components/pages/RegistrantExperience/RegistrationSteps/PersonalInfo/CamperCard.tsx
+++ b/frontend/src/components/pages/RegistrantExperience/RegistrationSteps/PersonalInfo/CamperCard.tsx
@@ -136,7 +136,6 @@ const CamperCard = ({
           isClosable: false,
           variant: "subtle",
         });
-        onClose();
       },
     });