[ES-2031] api status checking flag

Signed-off-by: Zeeshan Mehboob <[email protected]>
Infosys · Jan 8, 2025 · 4c18c16 · 4c18c16
1 parent 56e7ab4
commit 4c18c16
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 25 deletions.
diff --git a/signup-ui/src/pages/EkycVerificationPage/EkycVerificationPage.tsx b/signup-ui/src/pages/EkycVerificationPage/EkycVerificationPage.tsx
@@ -27,6 +27,7 @@ import {
   setHashCodeSelector,
   setKycProviderSelector,
   setKycProvidersListSelector,
+  setProviderListStatusSelector,
   stepSelector,
   useEkycVerificationStore,
 } from "./useEkycVerificationStore";
@@ -51,6 +52,7 @@ export const EkycVerificationPage = ({
     setKycProvider,
     setKycProviderList,
     setHashCode,
+    setProviderListStatus,
   } = useEkycVerificationStore(
     useCallback(
       (state) => ({
@@ -60,6 +62,7 @@ export const EkycVerificationPage = ({
         setKycProvider: setKycProviderSelector(state),
         setKycProviderList: setKycProvidersListSelector(state),
         setHashCode: setHashCodeSelector(state),
+        setProviderListStatus: setProviderListStatusSelector(state),
       }),
       []
     )
@@ -109,6 +112,7 @@ export const EkycVerificationPage = ({
                 setCriticalError(errors[0]);
               } else {
                 setKycProviderList(response?.identityVerifiers);
+                setProviderListStatus(true);
                 if (response?.identityVerifiers.length === 1) {
                   setKycProvider(response?.identityVerifiers[0]);
                 }

diff --git a/signup-ui/src/pages/EkycVerificationPage/KycProviderList/KycProviderList.tsx b/signup-ui/src/pages/EkycVerificationPage/KycProviderList/KycProviderList.tsx
@@ -15,10 +15,7 @@ import {
 } from "~components/ui/step";
 import { useL2Hash } from "~hooks/useL2Hash";
 import langConfigService from "~services/langConfig.service";
-import {
-  DefaultEkyVerificationProp,
-  UpdateProcessRequestDto,
-} from "~typings/types";
+import { DefaultEkyVerificationProp } from "~typings/types";
 import LoadingIndicator from "~/common/LoadingIndicator";
 
 import {
@@ -43,24 +40,18 @@ export const KycProviderList = ({
 
   const { state } = useL2Hash();
 
-  const {
-    setStep,
-    setKycProvider,
-    kycProvider,
-    providerListStore,
-    hashCode,
-  } = useEkycVerificationStore(
-    useCallback(
-      (state: EkycVerificationStore) => ({
-        setStep: setStepSelector(state),
-        setKycProvider: setKycProviderSelector(state),
-        kycProvider: kycProviderSelector(state),
-        providerListStore: kycProvidersListSelector(state),
-        hashCode: hashCodeSelector(state),
-      }),
-      []
-    )
-  );
+  const { setStep, setKycProvider, kycProvider, providerListStore } =
+    useEkycVerificationStore(
+      useCallback(
+        (state: EkycVerificationStore) => ({
+          setStep: setStepSelector(state),
+          setKycProvider: setKycProviderSelector(state),
+          kycProvider: kycProviderSelector(state),
+          providerListStore: kycProvidersListSelector(state),
+        }),
+        []
+      )
+    );
 
   const [cancelButton, setCancelButton] = useState<boolean>(false);
   const [kycProvidersList, setKycProvidersList] = useState<any>([]);

diff --git a/signup-ui/src/pages/EkycVerificationPage/VerificationSteps/VerificationSteps.tsx b/signup-ui/src/pages/EkycVerificationPage/VerificationSteps/VerificationSteps.tsx
@@ -21,6 +21,7 @@ import {
   EkycVerificationStore,
   kycProvidersListSelector,
   setStepSelector,
+  providerListStatusSelector,
   useEkycVerificationStore,
 } from "../useEkycVerificationStore";
 import { checkBrowserCompatible } from "./utils/checkBrowserCompatible";
@@ -34,12 +35,13 @@ export const VerificationSteps = ({
   });
   const [cancelButton, setCancelButton] = useState<boolean>(false);
   const [isLoading, setIsLoading] = useState<boolean>(true);
-  const { setStep, providerListStore } =
+  const { setStep, providerListStore, providerListStatus } =
     useEkycVerificationStore(
       useCallback(
         (state: EkycVerificationStore) => ({
           setStep: setStepSelector(state),
           providerListStore: kycProvidersListSelector(state),
+          providerListStatus: providerListStatusSelector(state),
         }),
         []
       )
@@ -120,10 +122,10 @@ export const VerificationSteps = ({
   };
 
   useEffect(() => {
-    if (providerListStore !== null) {
+    if (providerListStatus) {
       setIsLoading(false);
     }
-  }, [providerListStore]);
+  }, [providerListStatus]);
 
   return (
     <>

diff --git a/signup-ui/src/pages/EkycVerificationPage/useEkycVerificationStore.tsx b/signup-ui/src/pages/EkycVerificationPage/useEkycVerificationStore.tsx
@@ -39,6 +39,8 @@ export type EkycVerificationStore = {
   setErrorBannerMessage: (errorBannerMessage: string | null) => void;
   slotId: string | null;
   setSlotId: (slotId: string | null) => void;
+  providerListStatus: boolean;
+  setProviderListStatus: (providerListStatus: boolean) => void;
 };
 
 export const useEkycVerificationStore = create<EkycVerificationStore>()(
@@ -97,6 +99,12 @@ export const useEkycVerificationStore = create<EkycVerificationStore>()(
       if (isEqual(current.slotId, slotId)) return;
       set((state) => ({ slotId }));
     },
+    providerListStatus: false,
+    setProviderListStatus: (providerListStatus: boolean) => {
+      const current = get();
+      if (isEqual(current.providerListStatus, providerListStatus)) return;
+      set((state) => ({ providerListStatus }));
+    },
   }))
 );
 
@@ -172,3 +180,11 @@ export const slotIdSelector = (
 export const setSlotIdSelector = (
   state: EkycVerificationStore
 ): EkycVerificationStore["setSlotId"] => state.setSlotId;
+
+export const providerListStatusSelector = (
+  state: EkycVerificationStore
+): EkycVerificationStore["providerListStatus"] => state.providerListStatus;
+
+export const setProviderListStatusSelector = (
+  state: EkycVerificationStore
+): EkycVerificationStore["setProviderListStatus"] => state.setProviderListStatus;