@multiplatform.one/keycloak 2.0.9 → 2.0.11

package/src/provider/AuthProvider/{AuthProvider.native.tsx → index.native.tsx}

@@ -1,7 +1,7 @@
 /**
- * File: /src/provider/AuthProvider/AuthProvider.native.tsx
+ * File: /src/provider/AuthProvider/index.native.tsx
  * Project: @multiplatform.one/keycloak
- * File Created: 09-01-2024 11:29:20
+ * File Created: 19-11-2024 20:26:31
  * Author: Clay Risser
  * -----
  * BitSpur (c) Copyright 2021 - 2024
@@ -26,7 +26,7 @@ import {
   useAuthRequest,
   useAutoDiscovery,
 } from "expo-auth-session";
-import React, { useState, useEffect, useMemo, useCallback } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { Loading } from "../../Loading";
 import { Keycloak, KeycloakConfigContext } from "../../keycloak";
 import type {
@@ -37,37 +37,58 @@ import { KeycloakContext } from "../../keycloak/context";
 import { persist, useAuthStore } from "../../state";
 import { isTokenExpired, validOrRefreshableToken } from "../../token";
 import { AfterAuth } from "../AfterAuth";
-import type { AuthProviderProps, Tokens } from "./AuthProvider";
+import type { AuthProviderProps, MessageSchema, Tokens } from "./shared";
 
 const REFRESH_THRESHOLD = 5;
 
 export function AuthProvider({
   children,
+  disabled,
   keycloakConfig,
   loadingComponent,
 }: AuthProviderProps) {
   const [keycloak, setKeycloak] = useState<Keycloak>();
   const authStore = useAuthStore();
-  if (!authStore) return <Loading loadingComponent={loadingComponent} />;
   const initialRefreshToken = useMemo(
-    () => validOrRefreshableToken((persist && authStore.refreshToken) || false),
-    [],
+    () =>
+      validOrRefreshableToken(
+        persist && authStore !== undefined && authStore?.refreshToken,
+      ),
+    [persist, authStore],
   );
   const keycloakUrl = `${keycloakConfig?.url}/realms/${keycloakConfig?.realm}`;
   const clientId =
     keycloakConfig.publicClientId || keycloakConfig?.clientId || "";
   const discovery = useAutoDiscovery(keycloakUrl);
   const redirectUri = makeRedirectUri();
-  const [tokens, setTokens] = useState<Tokens<false>>({
-    refreshToken: initialRefreshToken,
-    token: validOrRefreshableToken(
-      (persist && authStore.token) || false,
-      initialRefreshToken,
-    ),
-    idToken: validOrRefreshableToken(
-      (persist && authStore.idToken) || false,
-      initialRefreshToken,
-    ),
+  const [tokens, setTokens] = useState<Tokens<false>>(() => {
+    if (response?.type === "success" && response.params) {
+      const refreshToken = validOrRefreshableToken(
+        response.params.refresh_token,
+      );
+      return {
+        refreshToken,
+        token: validOrRefreshableToken(
+          response.params.access_token,
+          refreshToken,
+        ),
+        idToken: validOrRefreshableToken(
+          response.params.id_token,
+          refreshToken,
+        ),
+      };
+    }
+    return {
+      refreshToken: initialRefreshToken,
+      token: validOrRefreshableToken(
+        persist && authStore !== undefined ? authStore.token : undefined,
+        initialRefreshToken,
+      ),
+      idToken: validOrRefreshableToken(
+        persist && authStore !== undefined ? authStore.idToken : undefined,
+        initialRefreshToken,
+      ),
+    };
   });
   const scopes = useMemo(
     () => [
@@ -83,15 +104,34 @@ export function AuthProvider({
   const [request, response, promptAsync] = useAuthRequest(
     {
       clientId,
-      redirectUri: redirectUri,
+      redirectUri,
       scopes,
     },
     discovery,
   );
 
   useEffect(() => {
-    if (!discovery || !response?.type || !request?.codeVerifier || !clientId)
+    if (authStore === undefined) return;
+    if (!persist) return;
+    if (tokens.token || tokens.refreshToken || tokens.idToken) return;
+    if (response?.type === "success") return;
+    setTokens({
+      refreshToken: initialRefreshToken,
+      token: validOrRefreshableToken(authStore.token, initialRefreshToken),
+      idToken: validOrRefreshableToken(authStore.idToken, initialRefreshToken),
+    });
+  }, [authStore, persist, response, initialRefreshToken]);
+
+  useEffect(() => {
+    if (
+      disabled ||
+      !discovery ||
+      !response?.type ||
+      !request?.codeVerifier ||
+      !clientId
+    ) {
       return;
+    }
     (async () => {
       if (
         response?.type === "success" &&
@@ -120,6 +160,7 @@ export function AuthProvider({
       }
     })();
   }, [
+    disabled,
     !discovery,
     request?.codeVerifier,
     response?.type === "success" ? response?.params?.code : undefined,
@@ -129,6 +170,7 @@ export function AuthProvider({
   ]);
 
   const resetTokens = useCallback(() => {
+    if (disabled || authStore === undefined) return;
     authStore.idToken = "";
     authStore.refreshToken = "";
     authStore.token = "";
@@ -137,10 +179,10 @@ export function AuthProvider({
       token: undefined,
       idToken: undefined,
     });
-  }, []);
+  }, [disabled, authStore]);
 
   const refreshTokens = useCallback(async () => {
-    if (!discovery) return;
+    if (disabled || !discovery || !tokens || authStore === undefined) return;
     if (typeof tokens.refreshToken === "string") {
       if (!isTokenExpired(tokens.refreshToken)) {
         const tokenResponse = await refreshAsync(
@@ -152,10 +194,19 @@ export function AuthProvider({
           discovery,
         );
         if (tokenResponse) {
+          const refreshToken = validOrRefreshableToken(
+            tokenResponse.refreshToken,
+          );
           setTokens({
-            idToken: tokenResponse.idToken,
-            refreshToken: tokenResponse.refreshToken,
-            token: tokenResponse.accessToken,
+            refreshToken,
+            token: validOrRefreshableToken(
+              tokenResponse.accessToken,
+              refreshToken,
+            ),
+            idToken: validOrRefreshableToken(
+              tokenResponse.idToken,
+              refreshToken,
+            ),
           });
         } else {
           resetTokens();
@@ -170,15 +221,16 @@ export function AuthProvider({
     ) {
       resetTokens();
     }
-  }, [!discovery, tokens.refreshToken, clientId, scopes]);
+  }, [disabled, !discovery, tokens?.refreshToken, clientId, scopes, authStore]);
 
   useEffect(() => {
-    if (!discovery) return;
+    if (disabled || !discovery) return;
+    if (authStore === undefined && !response?.type) return;
     refreshTokens();
-  }, [!discovery]);
+  }, [disabled, !discovery, authStore, response]);
 
   useEffect(() => {
-    if (!request) return;
+    if (disabled || !request || !tokens) return;
     let refreshHandle: NodeJS.Timeout;
     (async () => {
       if (tokens.token && isTokenExpired(tokens.token)) {
@@ -226,13 +278,16 @@ export function AuthProvider({
       if (refreshHandle) clearTimeout(refreshHandle);
     };
   }, [
+    disabled,
     !request,
-    tokens.token,
-    tokens.idToken,
-    tokens.refreshToken,
+    tokens?.token,
+    tokens?.idToken,
+    tokens?.refreshToken,
     refreshTokens,
   ]);
 
+  if (disabled) return <>{children}</>;
+  if (!authStore || !tokens) <Loading loadingComponent={loadingComponent} />;
   return (
     <KeycloakConfigContext.Provider value={keycloakConfig}>
       <KeycloakContext.Provider value={keycloak}>