antaeus.keycloak.react 2.0.0 → 2.1.1

package/dist/index.js

@@ -17,7 +17,7 @@ var defaultConfig = {
   scope: "openid profile email offline_access",
   features: {
     deviceFlow: false,
-    sessionMonitor: false,
+    sessionMonitor: true,
     autoRefresh: true
   },
   silentRenew: {
@@ -62,7 +62,11 @@ var KeycloakConfigBuilder = class {
       scope: config.scope,
       automaticSilentRenew: config.silentRenew.enabled,
       loadUserInfo: config.advanced.loadUserInfo,
-      silent_redirect_uri: config.silentRenew.silentRedirectUri
+      silent_redirect_uri: config.silentRenew.silentRedirectUri,
+      // Add PKCE support (required for public clients)
+      ...config.advanced.codeChallengeMethod && {
+        response_mode: "query"
+      }
     };
     return oidcSettings;
   }
@@ -200,14 +204,14 @@ function useTokenLifecycle(options) {
       log("Refresh already in progress, skipping");
       return;
     }
-    if (checkRefreshTokenLifetime()) {
-      log("Refresh token exceeded max lifetime, cannot refresh");
-      setIsRefreshTokenExpired(true);
-      onRefreshTokenExpired?.();
-      return;
-    }
+    setIsRefreshing(true);
     try {
-      setIsRefreshing(true);
+      if (checkRefreshTokenLifetime()) {
+        log("Refresh token exceeded max lifetime, cannot refresh");
+        setIsRefreshTokenExpired(true);
+        onRefreshTokenExpired?.();
+        return;
+      }
       onRefreshStart?.();
       log("Starting token refresh");
       await auth.signinSilent();
@@ -242,7 +246,11 @@ function useTokenLifecycle(options) {
       onRefreshTokenExpired?.();
       const key = getStorageKey();
       localStorage.removeItem(key);
-      await auth.removeUser();
+      try {
+        await auth.removeUser();
+      } catch (error) {
+        log("Error removing user after max lifetime:", error);
+      }
       return false;
     }
     const expiresAt = auth.user.expires_at;
@@ -321,7 +329,9 @@ function useTokenLifecycle(options) {
         onRefreshTokenExpired?.();
         const key = getStorageKey();
         localStorage.removeItem(key);
-        auth.removeUser();
+        auth.removeUser().catch((error) => {
+          log("Error removing user during periodic check:", error);
+        });
       }
     }, 5 * 60 * 1e3);
     return () => clearInterval(intervalId);
@@ -498,22 +508,28 @@ var SessionMonitor = ({
 }) => {
   const auth = useAuth();
   const [timeRemaining, setTimeRemaining] = react.useState(null);
+  const [initialTimeRemaining, setInitialTimeRemaining] = react.useState(null);
   const [minimized, setMinimized] = react.useState(startMinimized);
   const [warningTriggered, setWarningTriggered] = react.useState(false);
   const [criticalTriggered, setCriticalTriggered] = react.useState(false);
   react.useEffect(() => {
     if (!auth.isAuthenticated || !auth.user?.expires_at) {
       setTimeRemaining(null);
+      setInitialTimeRemaining(null);
       return;
     }
+    let logoutTimeoutId = null;
     const updateTimeRemaining = () => {
       const expiresAt = auth.user.expires_at;
       const now = Math.floor(Date.now() / 1e3);
       const remaining = expiresAt - now;
+      if (initialTimeRemaining === null && remaining > 0) {
+        setInitialTimeRemaining(remaining);
+      }
       if (remaining <= 0) {
         setTimeRemaining(0);
         onExpired?.();
-        setTimeout(() => {
+        logoutTimeoutId = setTimeout(() => {
           auth.signoutRedirect();
         }, 2e3);
       } else {
@@ -529,13 +545,19 @@ var SessionMonitor = ({
     };
     updateTimeRemaining();
     const interval = setInterval(updateTimeRemaining, 1e3);
-    return () => clearInterval(interval);
+    return () => {
+      clearInterval(interval);
+      if (logoutTimeoutId) {
+        clearTimeout(logoutTimeoutId);
+      }
+    };
   }, [
     auth,
     warningThreshold,
     criticalThreshold,
     warningTriggered,
     criticalTriggered,
+    initialTimeRemaining,
     onWarning,
     onCritical,
     onExpired
@@ -558,9 +580,9 @@ var SessionMonitor = ({
     return "normal";
   }, [timeRemaining, warningThreshold, criticalThreshold]);
   const getProgress = react.useCallback(() => {
-    if (!timeRemaining || !auth.user?.expires_in) return 100;
-    return timeRemaining / auth.user.expires_in * 100;
-  }, [timeRemaining, auth.user]);
+    if (!timeRemaining || !initialTimeRemaining) return 100;
+    return Math.max(0, Math.min(100, timeRemaining / initialTimeRemaining * 100));
+  }, [timeRemaining, initialTimeRemaining]);
   if (!auth.isAuthenticated || timeRemaining === null) {
     return null;
   }
@@ -873,12 +895,27 @@ function buildZeroConfig(props) {
   const { authority, clientId, preset = "default", config: overrides = {} } = props;
   const presetConfig = mergeWithPreset(preset, overrides);
   const fullConfig = {
-    ...defaultConfig,
-    ...presetConfig,
     authority,
     clientId,
-    redirectUri: presetConfig.redirectUri || (typeof window !== "undefined" ? window.location.origin + "/" : "/"),
-    postLogoutRedirectUri: presetConfig.postLogoutRedirectUri || (typeof window !== "undefined" ? window.location.origin + "/" : "/")
+    redirectUri: presetConfig.redirectUri || defaultConfig.redirectUri || (typeof window !== "undefined" ? window.location.origin + "/" : "/"),
+    postLogoutRedirectUri: presetConfig.postLogoutRedirectUri || defaultConfig.postLogoutRedirectUri || (typeof window !== "undefined" ? window.location.origin + "/" : "/"),
+    scope: presetConfig.scope || defaultConfig.scope,
+    features: {
+      ...defaultConfig.features,
+      ...presetConfig.features
+    },
+    silentRenew: {
+      ...defaultConfig.silentRenew,
+      ...presetConfig.silentRenew
+    },
+    advanced: {
+      ...defaultConfig.advanced,
+      ...presetConfig.advanced
+    },
+    events: {
+      ...defaultConfig.events,
+      ...presetConfig.events
+    }
   };
   return fullConfig;
 }
@@ -973,6 +1010,7 @@ var ProtectedRoute = ({
   const { hasAnyRole, hasAllRoles } = useRoles();
   const { hasAnyScope, hasAllScopes } = useScopes();
   const location = reactRouterDom.useLocation();
+  const hasRedirected = react.useRef(false);
   const isAuthenticated = !auth.isLoading && auth.isAuthenticated;
   const policyAccess = policy && auth.user ? policy(auth.user, { location }) : null;
   const roleAccess = requiredRoles.length > 0 ? requireAllRoles ? hasAllRoles(requiredRoles) : hasAnyRole(requiredRoles) : null;
@@ -984,12 +1022,21 @@ var ProtectedRoute = ({
     }
   }, [unauthorizedReason, onUnauthorized]);
   react.useEffect(() => {
-    if (!auth.isLoading && !auth.isAuthenticated) {
+    if (!auth.isLoading && !auth.isAuthenticated && !hasRedirected.current) {
+      hasRedirected.current = true;
       auth.signinRedirect({
         redirect_uri: window.location.origin + location.pathname + location.search
+      }).catch((error) => {
+        hasRedirected.current = false;
+        console.error("[ProtectedRoute] Signin redirect failed:", error);
       });
     }
-  }, [auth.isLoading, auth.isAuthenticated, auth, location.pathname, location.search]);
+  }, [auth.isLoading, auth.isAuthenticated, location.pathname, location.search]);
+  react.useEffect(() => {
+    if (auth.isAuthenticated) {
+      hasRedirected.current = false;
+    }
+  }, [auth.isAuthenticated]);
   if (auth.isLoading) {
     return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent || /* @__PURE__ */ jsxRuntime.jsx(DefaultLoadingComponent, {}) });
   }
@@ -1357,8 +1404,17 @@ var DeviceLogin = ({
           });
           if (userManagerRef.current) {
             await userManagerRef.current.storeUser(user);
+            const events = userManagerRef.current.events;
+            if (events && events._userLoaded) {
+              events._userLoaded.raise(user);
+            }
+          }
+          if (onSuccess) {
+            await new Promise((resolve) => setTimeout(resolve, 100));
+            onSuccess(user);
+          } else {
+            window.location.reload();
           }
-          onSuccess?.(user);
         }
       } catch (err) {
         if (!err.message.includes("authorization_pending")) {
@@ -1445,14 +1501,14 @@ function useProtectedFetch(options = {}) {
     },
     [baseUrl]
   );
-  const getAuthHeader = react.useCallback(() => {
+  const getAuthHeader = () => {
     if (!auth.user?.access_token) {
       return {};
     }
     return {
       Authorization: `Bearer ${auth.user.access_token}`
     };
-  }, [auth.user]);
+  };
   const buildHeaders = react.useCallback(
     (requestHeaders) => {
       const headers = new Headers(requestHeaders);
@@ -1465,7 +1521,7 @@ function useProtectedFetch(options = {}) {
       });
       return headers;
     },
-    [getAuthHeader, customHeaders]
+    [customHeaders]
   );
   const protectedFetch = react.useCallback(
     async (url, init) => {