Move footer into modal content

regalijan · Mar 6, 2024 · 4ad29cf · 4ad29cf
1 parent 2f8ff3b
commit 4ad29cf
Showing 1 changed file with 53 additions and 53 deletions.
diff --git a/app/routes/et-members.tsx b/app/routes/et-members.tsx
@@ -324,67 +324,67 @@ export default function () {
               placeholder="New name"
             />
           </ModalBody>
-        </ModalContent>
-        <ModalFooter>
-          <Button
-            onClick={() => {
-              setAddingMemberName("");
-              closeNameChange();
-            }}
-          >
-            Cancel
-          </Button>
-          <Button
-            colorScheme="blue"
-            ml="8px"
-            onClick={async () => {
-              const nameUpdateResp = await fetch(
-                "/api/events-team/team-members/user",
-                {
-                  body: JSON.stringify({
-                    id: currentModalMember,
-                    name: addingMemberName,
-                  }),
-                  headers: {
-                    "content-type": "application/json",
+          <ModalFooter>
+            <Button
+              onClick={() => {
+                setAddingMemberName("");
+                closeNameChange();
+              }}
+            >
+              Cancel
+            </Button>
+            <Button
+              colorScheme="blue"
+              ml="8px"
+              onClick={async () => {
+                const nameUpdateResp = await fetch(
+                  "/api/events-team/team-members/user",
+                  {
+                    body: JSON.stringify({
+                      id: currentModalMember,
+                      name: addingMemberName,
+                    }),
+                    headers: {
+                      "content-type": "application/json",
+                    },
+                    method: "PATCH",
                   },
-                  method: "PATCH",
-                },
-              );
+                );
 
-              const newName = addingMemberName;
+                const newName = addingMemberName;
 
-              closeNameChange();
-              setAddingMemberName("");
+                closeNameChange();
+                setAddingMemberName("");
 
-              if (!nameUpdateResp.ok) {
-                let errorMsg = "Unknown error";
+                if (!nameUpdateResp.ok) {
+                  let errorMsg = "Unknown error";
 
-                try {
-                  errorMsg = (
-                    (await nameUpdateResp.json()) as { error: string }
-                  ).error;
-                } catch {}
+                  try {
+                    errorMsg = (
+                      (await nameUpdateResp.json()) as { error: string }
+                    ).error;
+                  } catch {}
 
-                toast({
-                  description: errorMsg,
-                  status: "error",
-                  title: "Error",
-                });
+                  toast({
+                    description: errorMsg,
+                    status: "error",
+                    title: "Error",
+                  });
 
-                return;
-              }
+                  return;
+                }
 
-              toast({
-                description: `Name changed to ${newName}`,
-                status: "success",
-                title: "Name changed",
-              });
-            }}
-          >
-            Update Name
-          </Button>
-        </ModalFooter>
+                toast({
+                  description: `Name changed to ${newName}`,
+                  status: "success",
+                  title: "Name changed",
+                });
+              }}
+            >
+              Update Name
+            </Button>
+          </ModalFooter>
+        </ModalContent>
       </Modal>
       <Modal
         isOpen={isOpen}