Merge pull request #11 from Achintha444/fix-loading-glitch

Fixed the loading glitch
Achintha444 · Dec 29, 2024 · c027027 · c027027
2 parents c1e2306 + 35ec7df
commit c027027
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/src/states/internalAuthData/providers/internalAuthDataProvider.tsx b/src/states/internalAuthData/providers/internalAuthDataProvider.tsx
@@ -1,5 +1,5 @@
 import { useAuthContext } from "@asgardeo/auth-react";
-import { FunctionComponent, PropsWithChildren, ReactElement, useEffect, useState } from "react";
+import { FunctionComponent, PropsWithChildren, ReactElement, useCallback, useEffect, useState } from "react";
 import { useNavigate } from "react-router";
 import InternalAuthDataContext from "../contexts/internalAuthDataContext";
 
@@ -31,6 +31,7 @@ const InternalAuthDataProvider: FunctionComponent<InternalAuthDataProviderProps>
     useEffect(() => {
         const loadUserData = async () => {
             try {
+                setIsAuthenticationLoading(true);
                 const authenticated = await isAuthenticated();
 
                 if (authenticated) {
@@ -57,14 +58,14 @@ const InternalAuthDataProvider: FunctionComponent<InternalAuthDataProviderProps>
         };
 
         loadUserData();
-    }, [ isAuthenticated ]); //
+    }, []); //
 
     /**
      * Navigates to the provided route if the user is authenticated.
      *
      * @param route - Route to navigate to.
      */
-    const navigateToRouteOnAuthentication = (route: string): void => {
+    const navigateToRouteOnAuthentication = useCallback((route: string): void => {
         setIsAuthenticationLoading(true);
 
         isAuthenticated().then((response) => {
@@ -74,7 +75,7 @@ const InternalAuthDataProvider: FunctionComponent<InternalAuthDataProviderProps>
         }).finally(() => {
             setIsAuthenticationLoading(false);
         });
-    };
+    }, [ isAuthenticated, navigate ]);
 
     return (
         <InternalAuthDataContext.Provider