feat(app): sets up btn loading/disabled state

kemalkem1 · Nov 17, 2023 · 1a09da7 · 1a09da7
1 parent e6d67c9
commit 1a09da7
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 34 deletions.
diff --git a/app/components/InitiateReverifyStampsButton.tsx b/app/components/InitiateReverifyStampsButton.tsx
@@ -14,23 +14,20 @@ import { LoadButton } from "./LoadButton";
 import { getPlatformSpec } from "../config/platforms";
 // -- Utils
 import { StampClaimForPlatform, StampClaimingContext } from "../context/stampClaimingContext";
-import { rejects } from "assert";
-import { resolve } from "path";
-import { ReactJSXElement } from "@emotion/react/types/jsx-namespace";
 
 export type ExpiredStampModalProps = {
   isOpen: boolean;
   onClose: () => void;
 };
 
 type WaitCondition = {
-  doContinue: (value: string) => void;
+  doContinue: () => void;
 };
 
 export const ReverifyStampsModal = ({ isOpen, onClose }: ExpiredStampModalProps) => {
   const { expiredProviders } = useContext(CeramicContext);
   const [isReverifyingStamps, setIsReverifyingStamps] = useState(false);
-  const [isClaimStampInProgress, setIsClaimStampInProgress] = useState(false);
+  const [currentStepCompleted, setCurrentStepCompleted] = useState(true);
   const { claimCredentials } = useContext(StampClaimingContext);
   const [waitForNext, setWaitForNext] = useState<WaitCondition>();
   const toast = useToast();
@@ -55,24 +52,15 @@ export const ReverifyStampsModal = ({ isOpen, onClose }: ExpiredStampModalProps)
     return possibleProviders.filter((provider) => expiredProviders.includes(provider)).length > 0;
   });
 
-  const handleClaimStep = async (
-    step: number, // Index in the for
-    status: string // "wait_confirmation" | "in_progress" | "all_done",
-  ): Promise<string> => {
-    console.log(status, step);
-
+  const handleClaimStep = async (step: number, status: string): Promise<void> => {
+    setCurrentStepCompleted(false);
     if (status === "in_progress") {
-      // console.log(step)
-      // setIsClaimStampInProgress(true);
-      // enable button
-    } else if (status === "all_done") {
-      // setIsClaimStampInProgress(false);
+      setCurrentStepCompleted(true);
     } else {
-      return new Promise<string>((resolve) => {
+      return new Promise<void>((resolve) => {
         setWaitForNext({ doContinue: resolve });
       });
     }
-    return "NO MATCH";
   };
 
   const reverifyStamps = async () => {
@@ -109,7 +97,7 @@ export const ReverifyStampsModal = ({ isOpen, onClose }: ExpiredStampModalProps)
 
   const handleNextClick = () => {
     if (waitForNext) {
-      waitForNext.doContinue("NEXT");
+      waitForNext.doContinue();
     }
   };
 
@@ -149,12 +137,15 @@ export const ReverifyStampsModal = ({ isOpen, onClose }: ExpiredStampModalProps)
             <Button onClick={onClose} variant="secondary">
               Cancel
             </Button>
-            <LoadButton data-testid="delete-duplicate" onClick={handleNextClick} isLoading={isClaimStampInProgress}>
-              Next
-            </LoadButton>
-            <LoadButton data-testid="delete-duplicate" onClick={reverifyStamps} isLoading={isReverifyingStamps}>
-              Reverify Stamps
-            </LoadButton>
+            {isReverifyingStamps ? (
+              <LoadButton data-testid="delete-duplicate" onClick={handleNextClick} isLoading={currentStepCompleted}>
+                Next
+              </LoadButton>
+            ) : (
+              <LoadButton data-testid="delete-duplicate" onClick={reverifyStamps} isLoading={isReverifyingStamps}>
+                Reverify Stamps
+              </LoadButton>
+            )}
           </div>
         </div>
       </ModalContent>

diff --git a/app/context/stampClaimingContext.tsx b/app/context/stampClaimingContext.tsx
@@ -63,14 +63,14 @@ export type StampClaimForPlatform = {
 
 export interface StampClaimingContextState {
   claimCredentials: (
-    handleClaimStep: (step: number, status: string) => Promise<string>,
+    handleClaimStep: (step: number, status: string) => Promise<void>,
     platformGroups: StampClaimForPlatform[]
   ) => Promise<void>;
 }
 
 const startingState: StampClaimingContextState = {
   claimCredentials: async (
-    handleClaimStep: (step: number, status: string) => Promise<string>,
+    handleClaimStep: (step: number, status: string) => Promise<void>,
     platformGroups: StampClaimForPlatform[]
   ) => {},
 };
@@ -129,17 +129,13 @@ export const StampClaimingContextProvider = ({ children }: { children: any }) =>
 
   // fetch VCs from IAM server
   const claimCredentials = async (
-    handleClaimStep: (step: number, status: string) => Promise<string>,
+    handleClaimStep: (step: number, status: string) => Promise<void>,
     platformGroups: StampClaimForPlatform[]
   ): Promise<any> => {
     for (let i = 0; i < platformGroups.length; i++) {
-      const { platformId, selectedProviders } = platformGroups[i];
-
-      if (platformId !== "EVMBulkVerify") {
-        const value = await handleClaimStep(i, "wait_confirmation");
-      }
-
       try {
+        const { platformId, selectedProviders } = platformGroups[i];
+        if (platformId !== "EVMBulkVerify") await handleClaimStep(i, "wait_confirmation");
         datadogLogs.logger.info("Saving Stamp", { platform: platformId });
         const platform = platforms.get(platformId as PLATFORM_ID)?.platform;