refactor: clean up frontend code

orbital-skylab · Jul 26, 2024 · ae5d11f · ae5d11f
1 parent 496312b
commit ae5d11f
Show file tree

Hide file tree

Showing 25 changed files with 233 additions and 190 deletions.
diff --git a/components/modals/AddCandidateModal/AddCandidateModal.cy.tsx b/components/modals/AddCandidateModal/AddCandidateModal.cy.tsx
@@ -101,7 +101,7 @@ describe("<AddCandidateModal />", () => {
     cy.get("@setOpenSpy").should("not.be.called");
     cy.get("@mutateSpy").should("not.be.called");
     cy.get("@handleCloseMenuSpy").should("not.be.called");
-    cy.contains("Project ID must be a number").should("exist");
+    cy.contains("Project ID must be an integer").should("exist");
   });
 
   it("should have a functioning return button", () => {

diff --git a/components/modals/AddCandidateModal/AddCandidateModal.tsx b/components/modals/AddCandidateModal/AddCandidateModal.tsx
@@ -9,6 +9,7 @@ import {
   GetCandidatesResponse,
   HTTP_METHOD,
 } from "@/types/api";
+import { LoadingButton } from "@mui/lab";
 import { Button, Stack } from "@mui/material";
 import { Formik } from "formik";
 import { Dispatch, FC, SetStateAction } from "react";
@@ -99,15 +100,16 @@ const AddCandidateModal: FC<Props> = ({
               >
                 Return
               </Button>
-              <Button
+              <LoadingButton
                 id="add-candidate-button"
                 size="small"
                 variant="contained"
                 onClick={formik.submitForm}
                 disabled={formik.isSubmitting}
+                loading={formik.isSubmitting}
               >
                 Add
-              </Button>
+              </LoadingButton>
             </Stack>
           </>
         )}
@@ -119,6 +121,6 @@ export default AddCandidateModal;
 
 const addCandidateValidationSchema = Yup.object().shape({
   projectId: Yup.string().required(ERRORS.REQUIRED).matches(/^\d+$/, {
-    message: "Project ID must be a number",
+    message: "Project ID must be an integer",
   }),
 });
diff --git a/components/modals/AddExternalVoterModal/AddExternalVoterModal.tsx b/components/modals/AddExternalVoterModal/AddExternalVoterModal.tsx
@@ -9,6 +9,7 @@ import {
   GetExternalVotersResponse,
   HTTP_METHOD,
 } from "@/types/api";
+import { LoadingButton } from "@mui/lab";
 import { Button, Stack } from "@mui/material";
 import { Formik } from "formik";
 import { Dispatch, FC, SetStateAction } from "react";
@@ -97,15 +98,16 @@ const AddExternalVoterModal: FC<Props> = ({
               >
                 Return
               </Button>
-              <Button
+              <LoadingButton
                 id="add-external-voter-button"
                 size="small"
                 variant="contained"
                 onClick={formik.submitForm}
                 disabled={formik.isSubmitting}
+                loading={formik.isSubmitting}
               >
                 Add
-              </Button>
+              </LoadingButton>
             </Stack>
           </>
         )}

diff --git a/components/modals/AddInternalVoterModal/AddInternalVoterModal.tsx b/components/modals/AddInternalVoterModal/AddInternalVoterModal.tsx
@@ -9,6 +9,7 @@ import {
   GetInternalVotersResponse,
   HTTP_METHOD,
 } from "@/types/api";
+import { LoadingButton } from "@mui/lab";
 import { Button, Stack } from "@mui/material";
 import { Formik } from "formik";
 import { Dispatch, FC, SetStateAction } from "react";
@@ -68,7 +69,7 @@ const AddInternalVoterModal: FC<Props> = ({
       open={open}
       handleClose={handleCloseModal}
       title="Add By Email"
-      subheader={`Enter an email to add the following user as an internal voter.`}
+      subheader={`Enter an email to add a user as an internal voter.`}
     >
       <Formik
         initialValues={initialValues}
@@ -97,15 +98,16 @@ const AddInternalVoterModal: FC<Props> = ({
               >
                 Return
               </Button>
-              <Button
+              <LoadingButton
                 id="add-internal-voter-button"
                 size="small"
                 variant="contained"
                 onClick={formik.submitForm}
                 disabled={formik.isSubmitting}
+                loading={formik.isSubmitting}
               >
                 Add
-              </Button>
+              </LoadingButton>
             </Stack>
           </>
         )}

diff --git a/components/modals/AddVoteEventModal/AddVoteEventModal.tsx b/components/modals/AddVoteEventModal/AddVoteEventModal.tsx
@@ -13,6 +13,7 @@ import {
   GetVoteEventsResponse,
   HTTP_METHOD,
 } from "@/types/api";
+import { LoadingButton } from "@mui/lab";
 import { Button, Stack } from "@mui/material";
 import { Formik, FormikHelpers } from "formik";
 import { Dispatch, FC, SetStateAction } from "react";
@@ -130,15 +131,16 @@ const AddVoteEventModal: FC<Props> = ({ open, setOpen, mutate }) => {
                 >
                   Cancel{" "}
                 </Button>
-                <Button
+                <LoadingButton
                   id="add-vote-event-button"
                   size="small"
                   variant="contained"
                   onClick={formik.submitForm}
                   disabled={formik.isSubmitting}
+                  loading={formik.isSubmitting}
                 >
                   Add
-                </Button>
+                </LoadingButton>
               </Stack>
             </>
           )}

diff --git a/components/modals/BatchAddCandidateModal/BatchAddCandidateModal.tsx b/components/modals/BatchAddCandidateModal/BatchAddCandidateModal.tsx
@@ -11,6 +11,7 @@ import {
   HTTP_METHOD,
 } from "@/types/api";
 import { LEVELS_OF_ACHIEVEMENT_WITH_ALL } from "@/types/projects";
+import { LoadingButton } from "@mui/lab";
 import { Button, Stack } from "@mui/material";
 import { Formik } from "formik";
 import { Dispatch, FC, SetStateAction } from "react";
@@ -81,7 +82,7 @@ const BatchAddCandidateModal: FC<Props> = ({
       handleClose={handleCloseModal}
       title="Batch Add Candidate"
       subheader={`Batch add projects from a specific cohort and achievement level as candidates. 
-        This will only add projects that are not already candidates.`}
+        This will perform a union of selected candidates and existing candidates.`}
     >
       <Formik
         initialValues={initialValues}
@@ -92,7 +93,7 @@ const BatchAddCandidateModal: FC<Props> = ({
           <>
             {isFetching(status) ? (
               <Stack justifyContent="center">
-                <LoadingSpinner size={30} />
+                <LoadingSpinner size={25} />
               </Stack>
             ) : (
               <Stack direction="row" marginTop="0.5rem" spacing={2}>
@@ -143,15 +144,16 @@ const BatchAddCandidateModal: FC<Props> = ({
               >
                 Return
               </Button>
-              <Button
+              <LoadingButton
                 id="batch-add-candidate-button"
                 size="small"
                 variant="contained"
                 onClick={formik.submitForm}
                 disabled={formik.isSubmitting || isFetching(status)}
+                loading={formik.isSubmitting}
               >
                 Add
-              </Button>
+              </LoadingButton>
             </Stack>
           </>
         )}

diff --git a/components/modals/DeleteCandidateModal/DeleteCandidateModal.tsx b/components/modals/DeleteCandidateModal/DeleteCandidateModal.tsx
@@ -6,6 +6,7 @@ import { Project } from "@/types/projects";
 import { Button, Stack } from "@mui/material";
 import { Dispatch, FC, SetStateAction } from "react";
 import Modal from "../Modal";
+import { LoadingButton } from "@mui/lab";
 
 type Props = {
   voteEventId: number;
@@ -70,16 +71,17 @@ const DeleteCandidateModal: FC<Props> = ({
         >
           Cancel
         </Button>
-        <Button
+        <LoadingButton
           id="delete-candidate-confirm-button"
           size="small"
           onClick={handleDeleteCandidate}
           variant="contained"
           color="error"
           disabled={isCalling(DeleteCandidate.status)}
+          loading={isCalling(DeleteCandidate.status)}
         >
           Delete
-        </Button>
+        </LoadingButton>
       </Stack>
     </Modal>
   );

diff --git a/components/modals/DeleteExternalVoterModal/DeleteExternalVoterModal.tsx b/components/modals/DeleteExternalVoterModal/DeleteExternalVoterModal.tsx
@@ -6,6 +6,7 @@ import { Button, Stack } from "@mui/material";
 import { Mutate } from "@/hooks/useFetch";
 import { Dispatch, FC, SetStateAction } from "react";
 import Modal from "../Modal";
+import { LoadingButton } from "@mui/lab";
 
 type Props = {
   externalVoter: ExternalVoter;
@@ -68,16 +69,17 @@ const DeleteExternalVoterModal: FC<Props> = ({
         >
           Cancel
         </Button>
-        <Button
+        <LoadingButton
           id="delete-external-voter-confirm-button"
           size="small"
           onClick={handleDeleteExternalVoter}
           variant="contained"
           color="error"
           disabled={isCalling(DeleteExternalVoter.status)}
+          loading={isCalling(DeleteExternalVoter.status)}
         >
           Delete
-        </Button>
+        </LoadingButton>
       </Stack>
     </Modal>
   );

diff --git a/components/modals/DeleteInternalVoterModal/DeleteInternalVoterModal.tsx b/components/modals/DeleteInternalVoterModal/DeleteInternalVoterModal.tsx
@@ -6,6 +6,7 @@ import { Button, Stack } from "@mui/material";
 import { Mutate } from "@/hooks/useFetch";
 import { Dispatch, FC, SetStateAction } from "react";
 import Modal from "../Modal";
+import { LoadingButton } from "@mui/lab";
 
 type Props = {
   voteEventId: number;
@@ -70,16 +71,17 @@ const DeleteInternalVoterModal: FC<Props> = ({
         >
           Cancel
         </Button>
-        <Button
+        <LoadingButton
           id="delete-internal-voter-confirm-button"
           size="small"
           onClick={handleDeleteInternalVoter}
           variant="contained"
           color="error"
           disabled={isCalling(DeleteInternalVoter.status)}
+          loading={isCalling(DeleteInternalVoter.status)}
         >
           Delete
-        </Button>
+        </LoadingButton>
       </Stack>
     </Modal>
   );

diff --git a/components/modals/DeleteVoteEventModal/DeleteVoteEventModal.tsx b/components/modals/DeleteVoteEventModal/DeleteVoteEventModal.tsx
@@ -6,6 +6,7 @@ import { VoteEvent } from "@/types/voteEvents";
 import { Button, Stack } from "@mui/material";
 import { Dispatch, FC, SetStateAction } from "react";
 import Modal from "../Modal";
+import { LoadingButton } from "@mui/lab";
 
 type Props = {
   voteEvent: VoteEvent;
@@ -71,16 +72,17 @@ const DeleteVoteEventModal: FC<Props> = ({
         >
           Cancel
         </Button>
-        <Button
+        <LoadingButton
           id="delete-vote-event-confirm-button"
           size="small"
           onClick={handleDeleteVoteEvent}
           variant="contained"
           color="error"
           disabled={isCalling(deleteVoteEvent.status)}
+          loading={isCalling(deleteVoteEvent.status)}
         >
           Delete
-        </Button>
+        </LoadingButton>
       </Stack>
     </Modal>
   );

diff --git a/components/modals/DeleteVoteModal/DeleteVoteModal.tsx b/components/modals/DeleteVoteModal/DeleteVoteModal.tsx
@@ -6,6 +6,7 @@ import { Vote } from "@/types/voteEvents";
 import { Button, Stack } from "@mui/material";
 import { Dispatch, FC, SetStateAction } from "react";
 import Modal from "../Modal";
+import { LoadingButton } from "@mui/lab";
 
 type Props = {
   voteEventId: number;
@@ -70,16 +71,17 @@ const DeleteVoteModal: FC<Props> = ({
         >
           Cancel
         </Button>
-        <Button
+        <LoadingButton
           id="delete-vote-confirm-button"
           size="small"
           onClick={handleDeleteVote}
           variant="contained"
           color="error"
           disabled={isCalling(DeleteVote.status)}
+          loading={isCalling(DeleteVote.status)}
         >
           Delete
-        </Button>
+        </LoadingButton>
       </Stack>
     </Modal>
   );

diff --git a/components/modals/RoleWeightsModal/RoleWeightsModal.tsx b/components/modals/RoleWeightsModal/RoleWeightsModal.tsx
@@ -74,7 +74,7 @@ const RoleWeightsModal: FC<Props> = ({ voteEvent, open, setOpen, mutate }) => {
 
     try {
       await editWeightsFilter.call(processedValues);
-      setSuccess(`Successfully updated role weights for vote event`);
+      setSuccess(`Successfully updated role weights`);
       setOpen(false);
     } catch (error) {
       setError(error);

diff --git a/components/modals/SetVoterManagementConfigModal/SetVoterManagementConfigModal.tsx b/components/modals/SetVoterManagementConfigModal/SetVoterManagementConfigModal.tsx
@@ -3,6 +3,7 @@ import useSnackbarAlert from "@/contexts/useSnackbarAlert";
 import { CALL_STATUS, isCalling } from "@/hooks/useApiCall";
 import { EditVoteEventResponse } from "@/types/api";
 import { VoteEvent } from "@/types/voteEvents";
+import { LoadingButton } from "@mui/lab";
 import { Button, Stack } from "@mui/material";
 import { Dispatch, FC, SetStateAction } from "react";
 
@@ -64,16 +65,17 @@ const SetVoterManagementConfigModal: FC<Props> = ({
         >
           Cancel
         </Button>
-        <Button
+        <LoadingButton
           id="set-voter-management-config-modal-confirm-button"
           size="small"
           variant="contained"
           color="error"
           onClick={handleConfirm}
           disabled={isCalling(setVoterManagement.status)}
+          loading={isCalling(setVoterManagement.status)}
         >
           Confirm
-        </Button>
+        </LoadingButton>
       </Stack>
     </Modal>
   );

diff --git a/components/modals/SubmitVotesModal/SubmitVotesModal.tsx b/components/modals/SubmitVotesModal/SubmitVotesModal.tsx
@@ -8,6 +8,7 @@ import {
   HTTP_METHOD,
   SubmitVotesResponse,
 } from "@/types/api";
+import { LoadingButton } from "@mui/lab";
 import { Button, Stack } from "@mui/material";
 import { Dispatch, FC, SetStateAction } from "react";
 
@@ -45,9 +46,6 @@ const SubmitVotesModal: FC<Props> = ({
       setSuccess("Submitted successfully");
       handleCloseModal();
     },
-    onError: () => {
-      setError("Something went wrong while submitting votes");
-    },
   });
 
   const handleSubmit = async () => {
@@ -93,15 +91,16 @@ const SubmitVotesModal: FC<Props> = ({
         >
           return
         </Button>
-        <Button
+        <LoadingButton
           id="submit-votes-button"
           size="small"
           onClick={handleSubmit}
           variant="contained"
           disabled={isCalling(submitVotes.status)}
+          loading={isCalling(submitVotes.status)}
         >
           Submit
-        </Button>
+        </LoadingButton>
       </Stack>
     </Modal>
   );