@multiplatform.one/keycloak 2.0.9 → 2.0.11

package/package.json

@@ -1,29 +1,31 @@
 {
   "name": "@multiplatform.one/keycloak",
-  "version": "2.0.9",
+  "version": "2.0.11",
   "description": "keycloak client for multiplatform.one ecosystem",
   "main": "dist/cjs",
   "module": "dist/esm",
   "module:jsx": "dist/jsx",
-  "react-native": "src/index.ts",
+  "react-native": "0.74.5",
   "source": "src/index.ts",
   "types": "types/index.d.ts",
   "exports": {
     ".": {
       "types": "./types/index.d.ts",
-      "import": "./dist/esm/index.mjs",
+      "import": "./dist/esm/index.js",
       "require": "./dist/cjs/index.cjs"
     },
     "./one": {
       "types": "./types/one.d.ts",
-      "import": "./dist/esm/one.mjs",
+      "import": "./dist/esm/one.js",
       "require": "./dist/cjs/one.cjs"
     },
+    "./emptyNextAuthReact": {
+      "types": "./types/emptyNextAuthReact.d.ts",
+      "import": "./dist/esm/emptyNextAuthReact.js",
+      "require": "./dist/cjs/emptyNextAuthReact.cjs"
+    },
     "./package.json": "./package.json"
   },
-  "scripts": {
-    "build": "rm -rf dist types 2>/dev/null && tamagui-build"
-  },
   "author": "BitSpur",
   "sideEffects": false,
   "keywords": [
@@ -47,22 +49,22 @@
   },
   "peerDependencies": {
     "@react-native-async-storage/async-storage": "1.21.0",
-    "multiplatform.one": "workspace:1.1.9",
-    "react": "18.3.1"
+    "multiplatform.one": "1.1.11",
+    "react": "~18.2.0"
   },
   "devDependencies": {
     "@react-native-async-storage/async-storage": "1.23.1",
-    "@tamagui/build": "^1.115.5",
-    "@testing-library/jest-dom": "^6.6.2",
+    "@tamagui/build": "^1.121.11",
+    "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^15.0.7",
     "@types/lodash.camelcase": "^4.3.9",
     "@types/lodash.startcase": "^4.4.9",
     "@types/react": "^18.3.1",
     "@types/react-native": "^0.73.0",
-    "@vitejs/plugin-react": "^4.3.2",
-    "multiplatform.one": "workspace:1.1.9",
-    "react": "18.3.1",
-    "typescript": "^5.6.2",
+    "@vitejs/plugin-react": "^4.3.4",
+    "multiplatform.one": "1.1.11",
+    "react": "~18.2.0",
+    "typescript": "~5.3.3",
     "vitest": "^1.6.0",
     "vitest-react-native": "^0.1.5"
   },
@@ -71,12 +73,17 @@
   },
   "dependencies": {
     "@auth/core": "^0.36.0",
-    "@multiplatform.one/authjs": "workspace:0.0.7",
-    "@multiplatform.one/use-store": "workspace:0.0.9",
+    "@multiplatform.one/authjs": "0.0.9",
+    "@multiplatform.one/use-store": "0.0.11",
     "expo-auth-session": "^5.5.2",
     "expo-crypto": "^13.0.2",
     "jwt-decode": "^4.0.0",
     "keycloak-js": "^24.0.5",
-    "next-auth": "^4.24.8"
+    "next-auth": "^4.24.11"
+  },
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "build": "rm -rf dist types 2>/dev/null && tamagui-build --ts-project ./tsconfig.build.json",
+    "test": "vitest run --coverage --coverage.provider=v8 --coverage.reporter=text --coverage.reporter=lcov --coverage.reporter=html"
   }
-}
+}

package/src/Authenticated.tsx

@@ -1,10 +1,10 @@
 /**
  * File: /src/Authenticated.tsx
  * Project: @multiplatform.one/keycloak
- * File Created: 22-06-2023 10:07:56
+ * File Created: 19-11-2024 20:26:31
  * Author: Clay Risser
  * -----
- * BitSpur (c) Copyright 2021 - 2023
+ * BitSpur (c) Copyright 2021 - 2024
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -20,11 +20,11 @@
  */
 
 import AsyncStorage from "@react-native-async-storage/async-storage";
-import { MultiPlatform } from "multiplatform.one";
+import { isIframe, isServer } from "multiplatform.one";
 import { type ComponentType, type PropsWithChildren, useEffect } from "react";
 import { Text } from "tamagui";
 import { useAuthConfig, useTokensFromQuery } from "./hooks";
-import { useKeycloak } from "./keycloak";
+import { useKeycloak } from "./keycloak/index";
 
 global.AsyncStorage = AsyncStorage;
 
@@ -43,12 +43,11 @@ export function Authenticated({
   const authConfig = useAuthConfig();
   const keycloak = useKeycloak();
   const tokensFromQuery = useTokensFromQuery();
-
   useEffect(() => {
     if (
       !keycloak ||
-      MultiPlatform.isIframe ||
-      MultiPlatform.isServer ||
+      (!authConfig.iframeSso && isIframe) ||
+      isServer ||
       keycloak.authenticated ||
       tokensFromQuery
     ) {

package/src/authConfig.ts

@@ -28,6 +28,7 @@ export const AuthConfigContext = createContext<AuthConfig>(defaultAuthConfig);
 export interface AuthConfig {
   debug?: boolean;
   disabled?: boolean;
+  iframeSso?: boolean;
   loginRedirectUri?: string;
   messageHandlerKeys?: string[];
 }

package/src/hooks/index.ts

@@ -1,7 +1,7 @@
-/*
+/**
  * File: /src/hooks/index.ts
  * Project: @multiplatform.one/keycloak
- * File Created: 04-04-2024 15:50:39
+ * File Created: 19-11-2024 20:26:31
  * Author: Clay Risser
  * -----
  * BitSpur (c) Copyright 2021 - 2024
@@ -20,5 +20,5 @@
  */
 
 export * from "./useAuthConfig";
-export * from "./useTokensFromQuery";
+export * from "./useTokensFromQuery/index";
 export * from "./useTokensFromState";

package/src/hooks/useTokensFromQuery/index.ts

@@ -1,7 +1,7 @@
 /*
  * File: /src/hooks/useTokensFromQuery/index.ts
  * Project: @multiplatform.one/keycloak
- * File Created: 04-04-2024 15:50:39
+ * File Created: 19-11-2024 20:26:31
  * Author: Clay Risser
  * -----
  * BitSpur (c) Copyright 2021 - 2024
@@ -19,16 +19,18 @@
  * limitations under the License.
  */
 
-import { MultiPlatform } from "multiplatform.one";
+import { isIframe } from "multiplatform.one";
+import { useAuthConfig } from "../useAuthConfig";
 
 export function useTokensFromQuery() {
-  if (!MultiPlatform.isIframe) return false;
+  const { iframeSso } = useAuthConfig();
+  if (iframeSso || !isIframe) return false;
   const query = new URLSearchParams(
     typeof window === "undefined" ? "" : window?.location?.search || "",
   );
   return (
-    typeof query.get("idToken") ||
-    typeof query.get("token") ||
-    typeof query.get("refreshToken")
+    typeof query.get("idToken") === "string" ||
+    typeof query.get("token") === "string" ||
+    typeof query.get("refreshToken") === "string"
   );
 }

package/src/index.ts

@@ -1,7 +1,7 @@
-/*
+/**
  * File: /src/index.ts
  * Project: @multiplatform.one/keycloak
- * File Created: 01-06-2024 13:44:49
+ * File Created: 19-11-2024 20:26:31
  * Author: Clay Risser
  * -----
  * BitSpur (c) Copyright 2021 - 2024
@@ -22,7 +22,7 @@
 export * from "./Authenticated";
 export * from "./authConfig";
 export * from "./hooks";
-export * from "./keycloak";
+export * from "./keycloak/index";
 export * from "./provider";
-export * from "./session";
+export * from "./session/index";
 export * from "./types";

package/src/keycloak/base.ts

@@ -0,0 +1,213 @@
+/*
+ * File: /src/keycloak/base.ts
+ * Project: @multiplatform.one/keycloak
+ * File Created: 25-12-2024 04:55:48
+ * Author: Clay Risser
+ * -----
+ * BitSpur (c) Copyright 2021 - 2024
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { AuthRequestPromptOptions } from "expo-auth-session";
+import { jwtDecode } from "jwt-decode";
+import type KeycloakClient from "keycloak-js";
+import type {
+  KeycloakLoginOptions as KeycloakJsLoginOptions,
+  KeycloakLogoutOptions as KeycloakJsLogoutOptions,
+} from "keycloak-js";
+import { useContext } from "react";
+import { useAuthConfig } from "../hooks";
+import type { Session } from "../session";
+import type { AccessTokenParsed, TokenParsed } from "../token";
+import type { KeycloakMock } from "../types";
+import type { KeycloakConfig } from "./config";
+import { KeycloakContext } from "./context";
+
+export class BaseKeycloak {
+  public authenticated = false;
+  public clientId: string;
+  public email?: string;
+  public idToken?: string;
+  public idTokenParsed?: TokenParsed;
+  public realm: string;
+  public realmAccess?: RealmAccess;
+  public refreshToken?: string;
+  public refreshTokenParsed?: TokenParsed;
+  public resourceAccess?: ResourceAccess;
+  public sessionId?: string;
+  public subject?: string;
+  public token?: string;
+  public tokenParsed?: AccessTokenParsed;
+  public username?: string;
+
+  protected _keycloakClient?: KeycloakClient;
+  protected _login?: (_options: KeycloakLoginOptions) => Promise<undefined>;
+  protected _logout?: (_options: KeycloakLogoutOptions) => Promise<undefined>;
+  protected _mock?: KeycloakMock;
+
+  constructor(
+    public readonly config: KeycloakConfig,
+    input?: string | KeycloakClient | KeycloakMock | Session,
+    idToken?: string,
+    refreshToken?: string,
+    login?: (_options: KeycloakLoginOptions) => Promise<undefined>,
+    logout?: (_options: KeycloakLogoutOptions) => Promise<undefined>,
+  ) {
+    this.clientId = this.config.clientId;
+    this.realm = this.config.realm;
+    if (typeof input === "string") {
+      this.token = input;
+      this.idToken = idToken;
+      this.refreshToken = refreshToken;
+      this._parseTokens();
+    } else if (typeof input === "object") {
+      this._handleInputObject(input);
+    }
+    this._login = login;
+    this._logout = logout;
+    this._sync();
+  }
+
+  protected _handleInputObject(input: KeycloakClient | KeycloakMock | Session) {
+    if (typeof (input as KeycloakClient).init === "function") {
+      this._keycloakClient = input as KeycloakClient;
+    } else {
+      this._mock = input as KeycloakMock;
+    }
+  }
+
+  protected _parseTokens() {
+    if (this.token && !this.tokenParsed) {
+      this.tokenParsed = jwtDecode(this.token);
+    }
+    if (this.idToken && !this.idTokenParsed) {
+      this.idTokenParsed = jwtDecode(this.idToken);
+    }
+    if (this.refreshToken && !this.refreshTokenParsed) {
+      this.refreshTokenParsed = jwtDecode(this.refreshToken) as TokenParsed;
+    }
+  }
+
+  protected _clear() {
+    this.authenticated = false;
+    this.email = undefined;
+    this.idToken = undefined;
+    this.idTokenParsed = undefined;
+    this.realmAccess = undefined;
+    this.refreshToken = undefined;
+    this.refreshTokenParsed = undefined;
+    this.resourceAccess = undefined;
+    this.sessionId = undefined;
+    this.subject = undefined;
+    this.token = undefined;
+    this.tokenParsed = undefined;
+    this.username = undefined;
+  }
+
+  protected _sync() {
+    if (this._mock) {
+      this.authenticated = true;
+      this.email = this._mock.email;
+      this.username = this._mock.username;
+    } else if (this._keycloakClient) {
+      this.authenticated = !!this._keycloakClient.authenticated;
+      this.email = this._keycloakClient?.tokenParsed?.email;
+      this.idToken = this._keycloakClient?.idToken;
+      this.idTokenParsed = this._keycloakClient?.idTokenParsed;
+      this.realmAccess = this._keycloakClient?.realmAccess;
+      this.refreshToken = this._keycloakClient?.refreshToken;
+      this.refreshTokenParsed = this._keycloakClient?.refreshTokenParsed;
+      this.resourceAccess = this._keycloakClient?.resourceAccess;
+      this.sessionId = this._keycloakClient?.sessionId;
+      this.subject = this._keycloakClient?.subject;
+      this.token = this._keycloakClient?.token;
+      this.tokenParsed = this._keycloakClient?.tokenParsed;
+      this.username = this.tokenParsed?.preferred_username;
+      if (this._keycloakClient.realm) this.realm = this._keycloakClient.realm;
+      if (this._keycloakClient.clientId) {
+        this.clientId = this._keycloakClient.clientId;
+      }
+    } else if (this.tokenParsed) {
+      this.clientId = this.tokenParsed.azp || this.config.clientId;
+      this.email = this.tokenParsed.email;
+      this.realm = this.tokenParsed.iss?.split("/").pop() || this.config.realm;
+      this.realmAccess = this.tokenParsed.realm_access;
+      this.resourceAccess = this.tokenParsed.resource_access;
+      this.sessionId = this.tokenParsed.session_state;
+      this.subject = this.tokenParsed.sub;
+      this.authenticated = !!(
+        this.tokenParsed?.exp &&
+        this.idToken &&
+        this.tokenParsed.exp > Date.now() / 1000
+      );
+      this.username = this.tokenParsed?.preferred_username;
+    } else {
+      return this._clear();
+    }
+  }
+
+  async getUserInfo() {
+    if (!this.authenticated) return;
+    const response = await fetch(
+      `${this.config.url}/realms/${this.realm}/protocol/openid-connect/userinfo`,
+      {
+        method: "GET",
+        headers: {
+          Authorization: `Bearer ${this.token}`,
+          Accept: "application/json",
+        },
+      },
+    );
+    if (response.ok) return response.json();
+  }
+
+  async login(options: KeycloakLoginOptions = {}) {
+    this._clear();
+    if (this._keycloakClient) {
+      await this._keycloakClient.login(options);
+    } else {
+      await this._login?.(options);
+    }
+    this._sync();
+  }
+
+  async logout(options: KeycloakLogoutOptions = {}) {
+    if (this._keycloakClient) {
+      await this._keycloakClient.logout(options);
+    } else {
+      await this._logout?.(options);
+    }
+    this._clear();
+  }
+}
+
+export function useKeycloak() {
+  const { disabled } = useAuthConfig();
+  if (disabled) return null;
+  return useContext(KeycloakContext);
+}
+
+export type KeycloakLogoutOptions = KeycloakJsLogoutOptions;
+export type KeycloakLoginOptions = KeycloakJsLoginOptions &
+  AuthRequestPromptOptions & { redirect?: boolean };
+
+export interface ResourceAccess {
+  [clientId: string]: {
+    roles: string[];
+  };
+}
+
+export interface RealmAccess {
+  roles: string[];
+}

package/src/keycloak/context.ts

@@ -20,6 +20,6 @@
  */
 
 import { createContext } from "react";
-import type { Keycloak } from "./keycloak";
+import type { Keycloak } from ".";
 
 export const KeycloakContext = createContext<Keycloak | undefined>(undefined);

package/src/{provider/AuthProvider/index.ts → keycloak/index.electron.ts}

@@ -1,7 +1,7 @@
-/*
- * File: /src/provider/AuthProvider/index.ts
+/**
+ * File: /src/keycloak/index.electron.ts
  * Project: @multiplatform.one/keycloak
- * File Created: 04-04-2024 15:50:39
+ * File Created: 23-12-2024 00:51:34
  * Author: Clay Risser
  * -----
  * BitSpur (c) Copyright 2021 - 2024
@@ -19,4 +19,9 @@
  * limitations under the License.
  */
 
-export * from "./AuthProvider";
+import { BaseKeycloak } from "./base";
+
+export class Keycloak extends BaseKeycloak {}
+
+export * from "./base";
+export * from "./config";

package/src/keycloak/index.native.ts

@@ -0,0 +1,46 @@
+/**
+ * File: /src/keycloak/index.native.ts
+ * Project: @multiplatform.one/keycloak
+ * File Created: 19-11-2024 20:26:31
+ * Author: Clay Risser
+ * -----
+ * BitSpur (c) Copyright 2021 - 2024
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { isStorybook } from "multiplatform.one";
+import { useContext } from "react";
+import { useAuthConfig } from "../hooks";
+import { BaseKeycloak } from "./base";
+import { KeycloakConfigContext } from "./config";
+import { KeycloakContext } from "./context";
+
+export class Keycloak extends BaseKeycloak {}
+
+export function useKeycloak() {
+  const keycloak = useContext(KeycloakContext);
+  const keycloakConfig = useContext(KeycloakConfigContext);
+  const { disabled } = useAuthConfig();
+  if (disabled) return null;
+  if (keycloak) return keycloak;
+  if (isStorybook) {
+    return new Keycloak(keycloakConfig, {
+      email: "storybook@example.com",
+      username: "storybook",
+    });
+  }
+}
+
+export * from "./base";
+export * from "./config";

package/src/keycloak/index.ts

@@ -1,7 +1,7 @@
 /*
  * File: /src/keycloak/index.ts
  * Project: @multiplatform.one/keycloak
- * File Created: 04-04-2024 15:50:39
+ * File Created: 25-12-2024 04:55:48
  * Author: Clay Risser
  * -----
  * BitSpur (c) Copyright 2021 - 2024
@@ -19,5 +19,152 @@
  * limitations under the License.
  */
 
+import type KeycloakClient from "keycloak-js";
+import { isBrowser, isServer, isStorybook } from "multiplatform.one";
+import {
+  type SignInAuthorizationParams,
+  type SignInOptions,
+  type SignInResponse,
+  getCsrfToken,
+  getProviders,
+  getSession,
+  signOut,
+} from "next-auth/react";
+import { useContext } from "react";
+import { useAuthConfig } from "../hooks";
+import type { Session } from "../session";
+import { useSession } from "../session";
+import type { KeycloakMock } from "../types";
+import {
+  BaseKeycloak,
+  type KeycloakLoginOptions,
+  type KeycloakLogoutOptions,
+} from "./base";
+import { KeycloakConfigContext } from "./config";
+import { KeycloakContext } from "./context";
+
+export class Keycloak extends BaseKeycloak {
+  protected _handleInputObject(input: KeycloakClient | KeycloakMock | Session) {
+    if (typeof (input as KeycloakClient).init === "function") {
+      this._keycloakClient = input as KeycloakClient;
+    } else if ((input as Session).accessToken) {
+      const session = input as Session;
+      this.token = session.accessToken;
+      this.idToken = session.idToken;
+      this.refreshToken = session.refreshToken;
+      this._parseTokens();
+    } else {
+      this._mock = input as KeycloakMock;
+    }
+  }
+
+  async login(options: KeycloakLoginOptions = {}) {
+    this._clear();
+    if (this._keycloakClient) {
+      await this._keycloakClient.login(options);
+    } else if (isBrowser && !isServer) {
+      await cookieSignIn({
+        callbackUrl: options.redirectUri,
+        ...(typeof options.redirect !== "undefined"
+          ? { redirect: options.redirect }
+          : {}),
+      });
+    } else {
+      await this._login?.(options);
+    }
+    this._sync();
+  }
+
+  async logout(options: KeycloakLogoutOptions = {}) {
+    if (this._keycloakClient) {
+      await this._keycloakClient.logout(options);
+    } else if (isBrowser && !isServer) {
+      await fetch("/api/auth/logout", { method: "GET" });
+      await signOut({
+        callbackUrl: options.redirectUri,
+      });
+    } else {
+      await this._logout?.(options);
+    }
+    this._clear();
+  }
+}
+
+export function useKeycloak() {
+  const keycloak = useContext(KeycloakContext);
+  const keycloakConfig = useContext(KeycloakConfigContext);
+  const { disabled } = useAuthConfig();
+  if (disabled) return null;
+  if (keycloak) return keycloak;
+  const { session, status } = useSession();
+  if (isStorybook) {
+    return new Keycloak(keycloakConfig, {
+      email: "storybook@example.com",
+      username: "storybook",
+    });
+  }
+  if (status === "unauthenticated") {
+    return new Keycloak(keycloakConfig);
+  }
+  if (status === "authenticated" && session?.accessToken) {
+    return new Keycloak(keycloakConfig, session as Session);
+  }
+}
+
+export async function cookieSignIn(
+  options?: SignInOptions,
+  authorizationParams?: SignInAuthorizationParams,
+): Promise<SignInResponse | undefined> {
+  const provider = "keycloak";
+  const baseUrl = `${new URL(window.location.href).origin}/api/auth`;
+  const { callbackUrl = window.location.href, redirect = true } = options ?? {};
+  const providers = await getProviders();
+  if (!providers) {
+    window.location.href = `${baseUrl}/error`;
+    return;
+  }
+  if (!provider || !(provider in providers)) {
+    window.location.href = `${baseUrl}/signin?${new URLSearchParams({
+      callbackUrl,
+    })}`;
+    return;
+  }
+  const isCredentials = providers[provider].type === "credentials";
+  const isEmail = providers[provider].type === "email";
+  const isSupportingReturn = isCredentials || isEmail;
+  const signInUrl = `${baseUrl}/${
+    isCredentials ? "callback" : "signin"
+  }/${provider}`;
+  const _signInUrl = `${signInUrl}${authorizationParams ? `?${new URLSearchParams(authorizationParams)}` : ""}`;
+  const res = await fetch(_signInUrl, {
+    method: "post",
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded",
+      "X-Auth-Return-Redirect": "1",
+    },
+    body: new URLSearchParams({
+      ...(options as any),
+      csrfToken: await getCsrfToken(),
+      callbackUrl,
+      json: true,
+    }),
+  });
+  const data = await res.json();
+  if (redirect || !isSupportingReturn) {
+    const url = data.url ?? callbackUrl;
+    window.location.href = url;
+    if (url.includes("#")) window.location.reload();
+    return;
+  }
+  const error = new URL(data.url).searchParams.get("error");
+  if (res.ok) await getSession({ event: "storage" });
+  return {
+    error,
+    status: res.status,
+    ok: res.ok,
+    url: error ? null : data.url,
+  };
+}
+
+export * from "./base";
 export * from "./config";
-export * from "./keycloak";