@meshagent/meshagent-react-auth 0.36.3 → 0.37.0

package/dist/cjs/use-auth.js

@@ -0,0 +1,482 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildOAuthAuthorizeUrl = buildOAuthAuthorizeUrl;
+exports.useAuth = useAuth;
+const react_1 = require("react");
+const meshagent_ts_auth_1 = require("@meshagent/meshagent-ts-auth");
+const use_meshagent_auth_1 = require("./use-meshagent-auth");
+const reference_key_1 = require("./reference-key");
+const DEFAULT_SERVER_URL = "https://api.meshagent.com";
+function toUrl(value) {
+    return value instanceof URL ? value : new URL(value);
+}
+function getCurrentUrl() {
+    if (typeof window === "undefined") {
+        throw new Error("useAuth requires a browser environment");
+    }
+    return new URL(window.location.href);
+}
+function clearMeshagentAuthQueryParams(url) {
+    url.searchParams.delete("code");
+    url.searchParams.delete("scope");
+    url.searchParams.delete("state");
+    url.searchParams.delete("error");
+    url.searchParams.delete("error_description");
+    url.searchParams.delete("error_uri");
+}
+function getResolvedCallbackUrl(callbackUrl) {
+    if (callbackUrl) {
+        return toUrl(callbackUrl);
+    }
+    const currentUrl = getCurrentUrl();
+    clearMeshagentAuthQueryParams(currentUrl);
+    return currentUrl;
+}
+function getCallbackUrlKey(callbackUrl) {
+    if (callbackUrl) {
+        return toUrl(callbackUrl).toString();
+    }
+    if (typeof window === "undefined") {
+        return "__current__";
+    }
+    return getResolvedCallbackUrl().toString();
+}
+function replaceCurrentUrlWithoutAuthParams() {
+    if (typeof window === "undefined" || typeof window.history.replaceState !== "function") {
+        return;
+    }
+    const currentUrl = getCurrentUrl();
+    clearMeshagentAuthQueryParams(currentUrl);
+    window.history.replaceState(window.history.state, "", currentUrl.toString());
+}
+function isMeshagentCallbackUrl(callbackUrl) {
+    if (typeof window === "undefined") {
+        return false;
+    }
+    const currentUrl = getCurrentUrl();
+    if (!currentUrl.searchParams.has("code")) {
+        return false;
+    }
+    const expectedCallbackUrl = new URL(callbackUrl);
+    clearMeshagentAuthQueryParams(currentUrl);
+    clearMeshagentAuthQueryParams(expectedCallbackUrl);
+    return currentUrl.toString() === expectedCallbackUrl.toString();
+}
+class UserProfileFetchError extends Error {
+    constructor(status, message) {
+        super(message);
+        Object.defineProperty(this, "status", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.name = "UserProfileFetchError";
+        this.status = status;
+    }
+}
+function isAuthProfileError(error) {
+    return error instanceof UserProfileFetchError && (error.status === 401 || error.status === 403);
+}
+async function fetchUserProfile(params) {
+    const response = await fetch(new URL("/accounts/profiles/me", toUrl(params.serverUrl)), {
+        signal: params.signal,
+        headers: {
+            "Authorization": `Bearer ${params.accessToken}`,
+            "Accept": "application/json",
+        },
+    });
+    if (!response.ok) {
+        throw new UserProfileFetchError(response.status, `Failed to fetch user profile: ${response.status} ${await response.text()}`);
+    }
+    return await response.json();
+}
+function serializeExtraQueryParams(extraQueryParams) {
+    return JSON.stringify(Object.entries(extraQueryParams ?? {}).sort(([left], [right]) => left.localeCompare(right)));
+}
+function normalizeExtraQueryParams(extraQueryParams) {
+    const entries = Object.entries(extraQueryParams ?? {}).sort(([left], [right]) => left.localeCompare(right));
+    return entries.length === 0 ? undefined : Object.fromEntries(entries);
+}
+function buildSignInKey(params) {
+    return JSON.stringify([
+        params.serverUrl,
+        params.callbackUrl,
+        params.oauthClientId,
+        params.scope,
+        params.provider,
+        params.extraQueryParamsKey,
+        params.storageKey,
+    ]);
+}
+function buildTokenExchangeKey(params) {
+    return JSON.stringify([
+        params.serverUrl,
+        params.callbackUrl,
+        params.oauthClientId,
+        params.authorizationCode,
+        params.storageKey,
+        params.authKey,
+    ]);
+}
+const inFlightSignIns = new Map();
+const inFlightTokenExchanges = new Map();
+function launchSignInOnce(key, params) {
+    const existing = inFlightSignIns.get(key);
+    if (existing) {
+        return existing;
+    }
+    const signIn = launchSignIn(params).finally(() => {
+        inFlightSignIns.delete(key);
+    });
+    inFlightSignIns.set(key, signIn);
+    return signIn;
+}
+function exchangeTokenOnce(key, params) {
+    const existing = inFlightTokenExchanges.get(key);
+    if (existing) {
+        return existing;
+    }
+    const tokenExchange = (0, meshagent_ts_auth_1.exchangeToken)({
+        serverUrl: params.serverUrl,
+        callbackUrl: params.callbackUrl,
+        oauthClientId: params.oauthClientId,
+        authorizationCode: params.authorizationCode,
+        storage: params.storage,
+        auth: params.auth,
+    }, params.signal)
+        .then(async () => {
+        const cache = new meshagent_ts_auth_1.LocalStoragePkceCache(params.storage);
+        await cache.clearVerifier();
+        replaceCurrentUrlWithoutAuthParams();
+    })
+        .finally(() => {
+        inFlightTokenExchanges.delete(key);
+    });
+    inFlightTokenExchanges.set(key, tokenExchange);
+    return tokenExchange;
+}
+async function buildOAuthAuthorizeUrl(params) {
+    const serverUrl = toUrl(params.serverUrl);
+    const callbackUrl = toUrl(params.callbackUrl);
+    const generator = new meshagent_ts_auth_1.PkceGenerator();
+    const pair = await generator.generate();
+    const cache = new meshagent_ts_auth_1.LocalStoragePkceCache(params.storage ?? (0, meshagent_ts_auth_1.getDefaultStorage)());
+    await cache.saveVerifier(pair.codeVerifier);
+    const query = new URLSearchParams({
+        ...(params.extraQueryParams ?? {}),
+        scope: params.scope ?? "profile",
+        client_id: params.oauthClientId,
+        code_challenge: pair.codeChallenge,
+        response_type: "code",
+        redirect_uri: callbackUrl.toString(),
+        prompt: "select_account",
+    });
+    if (params.provider) {
+        query.set("provider", params.provider);
+    }
+    return new URL(`/oauth/authorize?${query.toString()}`, serverUrl);
+}
+async function launchSignIn(params) {
+    const authorizeUrl = await buildOAuthAuthorizeUrl({
+        serverUrl: params.serverUrl,
+        callbackUrl: params.callbackUrl,
+        oauthClientId: params.oauthClientId,
+        scope: params.scope,
+        provider: params.provider,
+        extraQueryParams: params.extraQueryParams,
+        storage: params.storage,
+    });
+    if (typeof window === "undefined") {
+        throw new Error("useAuth requires a browser environment");
+    }
+    window.location.assign(authorizeUrl.toString());
+}
+function useAuth(props) {
+    const serverUrl = toUrl(props.serverUrl ?? DEFAULT_SERVER_URL).toString();
+    const oauthClientId = props.oauthClientId;
+    const scope = props.scope ?? "profile";
+    const defaultProvider = props.provider ?? null;
+    const storage = props.storage ?? (0, meshagent_ts_auth_1.getDefaultStorage)();
+    const auth = props.auth ?? meshagent_ts_auth_1.meshagentAuth;
+    const authSnapshot = (0, use_meshagent_auth_1.useMeshagentAuth)(auth);
+    const authKey = (0, reference_key_1.getReferenceKey)(auth, "default-auth");
+    const storageKey = (0, reference_key_1.getReferenceKey)(storage, "default-storage");
+    const callbackUrlKey = (0, react_1.useMemo)(() => getCallbackUrlKey(props.callbackUrl), [props.callbackUrl]);
+    const extraQueryParamsKey = (0, react_1.useMemo)(() => serializeExtraQueryParams(props.extraQueryParams), [props.extraQueryParams]);
+    const normalizedExtraQueryParams = (0, react_1.useMemo)(() => normalizeExtraQueryParams(props.extraQueryParams), [extraQueryParamsKey]);
+    const autoSignIn = props.autoSignIn ?? true;
+    const authRef = (0, react_1.useRef)(auth);
+    const storageRef = (0, react_1.useRef)(storage);
+    const exchangedAccessTokenRef = (0, react_1.useRef)(null);
+    const [signInFailed, setSignInFailed] = (0, react_1.useState)(null);
+    const [isSigningIn, setIsSigningIn] = (0, react_1.useState)(false);
+    const [refreshVersion, setRefreshVersion] = (0, react_1.useState)(0);
+    const [loginState, setLoginState] = (0, react_1.useState)({
+        failed: null,
+        isLoginLaunched: false,
+        refreshing: true,
+    });
+    authRef.current = auth;
+    storageRef.current = storage;
+    const signIn = async (provider) => {
+        const selectedProvider = provider === undefined ? defaultProvider : provider;
+        const callbackUrl = callbackUrlKey;
+        const key = buildSignInKey({
+            serverUrl,
+            callbackUrl,
+            oauthClientId,
+            scope,
+            provider: selectedProvider ?? null,
+            extraQueryParamsKey,
+            storageKey,
+        });
+        setIsSigningIn(true);
+        setSignInFailed(null);
+        try {
+            await launchSignInOnce(key, {
+                serverUrl,
+                callbackUrl,
+                oauthClientId,
+                scope,
+                provider: selectedProvider,
+                extraQueryParams: normalizedExtraQueryParams,
+                storage,
+            });
+        }
+        catch (error) {
+            setSignInFailed(error);
+            setIsSigningIn(false);
+        }
+    };
+    (0, react_1.useEffect)(() => {
+        let cancelled = false;
+        const controller = new AbortController();
+        setLoginState((previous) => previous.refreshing
+            ? previous
+            : {
+                ...previous,
+                refreshing: true,
+            });
+        const run = async () => {
+            const currentAuth = authRef.current;
+            const currentStorage = storageRef.current;
+            const session = new meshagent_ts_auth_1.OAuthSessionManager({
+                serverUrl,
+                clientId: oauthClientId,
+                auth: currentAuth,
+            });
+            if (isMeshagentCallbackUrl(callbackUrlKey)) {
+                const authorizationCode = (0, meshagent_ts_auth_1.getAuthorizationCode)();
+                if (authorizationCode) {
+                    const callbackUrl = callbackUrlKey;
+                    const key = buildTokenExchangeKey({
+                        serverUrl,
+                        callbackUrl,
+                        oauthClientId,
+                        authorizationCode,
+                        storageKey,
+                        authKey,
+                    });
+                    try {
+                        await exchangeTokenOnce(key, {
+                            serverUrl,
+                            callbackUrl,
+                            oauthClientId,
+                            authorizationCode,
+                            storage: currentStorage,
+                            auth: currentAuth,
+                            signal: controller.signal,
+                        });
+                        if (cancelled || controller.signal.aborted) {
+                            return;
+                        }
+                        exchangedAccessTokenRef.current = currentAuth.getAccessToken();
+                        setSignInFailed(null);
+                        setIsSigningIn(false);
+                        setLoginState({
+                            failed: null,
+                            isLoginLaunched: false,
+                            refreshing: false,
+                        });
+                        return;
+                    }
+                    catch (error) {
+                        if (cancelled || controller.signal.aborted) {
+                            return;
+                        }
+                        setIsSigningIn(false);
+                        setLoginState({
+                            failed: error,
+                            isLoginLaunched: true,
+                            refreshing: false,
+                        });
+                        return;
+                    }
+                }
+            }
+            if (!authSnapshot.accessToken) {
+                setSignInFailed(null);
+                if (autoSignIn) {
+                    const callbackUrl = callbackUrlKey;
+                    const key = buildSignInKey({
+                        serverUrl,
+                        callbackUrl,
+                        oauthClientId,
+                        scope,
+                        provider: defaultProvider,
+                        extraQueryParamsKey,
+                        storageKey,
+                    });
+                    setIsSigningIn(true);
+                    try {
+                        await launchSignInOnce(key, {
+                            serverUrl,
+                            callbackUrl,
+                            oauthClientId,
+                            scope,
+                            provider: defaultProvider,
+                            extraQueryParams: normalizedExtraQueryParams,
+                            storage: currentStorage,
+                        });
+                        if (cancelled) {
+                            return;
+                        }
+                        setLoginState({
+                            failed: null,
+                            isLoginLaunched: false,
+                            refreshing: false,
+                        });
+                        return;
+                    }
+                    catch (error) {
+                        if (cancelled) {
+                            return;
+                        }
+                        setIsSigningIn(false);
+                        setLoginState({
+                            failed: error,
+                            isLoginLaunched: true,
+                            refreshing: false,
+                        });
+                        return;
+                    }
+                }
+                if (cancelled) {
+                    return;
+                }
+                setIsSigningIn(false);
+                setLoginState({
+                    failed: null,
+                    isLoginLaunched: true,
+                    refreshing: false,
+                });
+                return;
+            }
+            if (exchangedAccessTokenRef.current !== null
+                && authSnapshot.accessToken === exchangedAccessTokenRef.current) {
+                exchangedAccessTokenRef.current = null;
+                if (cancelled) {
+                    return;
+                }
+                setSignInFailed(null);
+                setIsSigningIn(false);
+                setLoginState({
+                    failed: null,
+                    isLoginLaunched: false,
+                    refreshing: false,
+                });
+                return;
+            }
+            let accessToken;
+            try {
+                accessToken = await session.getValidAccessTokenOrThrow();
+            }
+            catch (error) {
+                currentAuth.signOut();
+                if (cancelled) {
+                    return;
+                }
+                setIsSigningIn(false);
+                setLoginState({
+                    failed: error,
+                    isLoginLaunched: true,
+                    refreshing: false,
+                });
+                return;
+            }
+            try {
+                const user = await fetchUserProfile({
+                    serverUrl,
+                    accessToken,
+                    signal: controller.signal,
+                });
+                currentAuth.setUser(user);
+                if (cancelled) {
+                    return;
+                }
+                setSignInFailed(null);
+                setIsSigningIn(false);
+                setLoginState({
+                    failed: null,
+                    isLoginLaunched: false,
+                    refreshing: false,
+                });
+            }
+            catch (error) {
+                if (cancelled || controller.signal.aborted) {
+                    return;
+                }
+                setIsSigningIn(false);
+                if (isAuthProfileError(error)) {
+                    currentAuth.signOut();
+                    setLoginState({
+                        failed: error,
+                        isLoginLaunched: true,
+                        refreshing: false,
+                    });
+                    return;
+                }
+                setLoginState({
+                    failed: error,
+                    isLoginLaunched: false,
+                    refreshing: false,
+                });
+            }
+        };
+        void run();
+        return () => {
+            cancelled = true;
+            controller.abort();
+        };
+    }, [
+        authKey,
+        authSnapshot.accessToken,
+        autoSignIn,
+        callbackUrlKey,
+        defaultProvider,
+        extraQueryParamsKey,
+        oauthClientId,
+        refreshVersion,
+        scope,
+        serverUrl,
+        storageKey,
+    ]);
+    const refresh = () => {
+        setSignInFailed(null);
+        setLoginState((previous) => ({ ...previous, refreshing: true }));
+        setRefreshVersion((version) => version + 1);
+    };
+    const failed = signInFailed ?? (loginState.refreshing ? null : loginState.failed ?? null);
+    const isLoginLaunched = signInFailed !== null ? true : loginState.isLoginLaunched;
+    return {
+        failed,
+        isCancelled: false,
+        isSigningIn,
+        refreshing: loginState.refreshing,
+        user: authSnapshot.user,
+        signIn,
+        refresh,
+        isLoginLaunched,
+    };
+}

package/dist/cjs/use-ensure-login.d.ts

@@ -0,0 +1,13 @@
+export type UseEnsureLoginStatus = "loading" | "success" | "error";
+export interface UseEnsureLoginProps {
+    serverUrl?: string | URL;
+    callbackUrl?: string | URL;
+    oauthClientId: string;
+    provider?: string;
+}
+export interface UseEnsureLoginResult {
+    status: UseEnsureLoginStatus;
+    error: string | null;
+    refresh: () => void;
+}
+export declare function useEnsureLogin(props: UseEnsureLoginProps): UseEnsureLoginResult;

package/dist/cjs/use-ensure-login.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useEnsureLogin = useEnsureLogin;
+const use_auth_1 = require("./use-auth");
+function toErrorMessage(error) {
+    if (error instanceof Error) {
+        return error.message;
+    }
+    return String(error);
+}
+function useEnsureLogin(props) {
+    const auth = (0, use_auth_1.useAuth)({
+        serverUrl: props.serverUrl,
+        callbackUrl: props.callbackUrl,
+        oauthClientId: props.oauthClientId,
+        provider: props.provider,
+        scope: "profile",
+        autoSignIn: true,
+    });
+    return {
+        status: auth.failed
+            ? "error"
+            : auth.refreshing || auth.user === null
+                ? "loading"
+                : "success",
+        error: auth.failed === null ? null : toErrorMessage(auth.failed),
+        refresh: auth.refresh,
+    };
+}

package/dist/cjs/use-login-scope.d.ts

@@ -1,5 +1,4 @@
-import { MeshagentAuth } from "@meshagent/meshagent-ts-auth";
-import type { StorageLike, MeshagentUser } from "@meshagent/meshagent-ts-auth";
+import type { MeshagentAuth, MeshagentUser, StorageLike } from "@meshagent/meshagent-ts-auth";
 export interface LoginScopeRenderProps {
     failed: unknown;
     isCancelled: boolean;
@@ -9,8 +8,8 @@ export interface LoginScopeRenderProps {
     signIn: (provider?: string | null) => Promise<void>;
     refresh: () => void;
 }
-export interface UseLoginScopeOptions {
-    serverUrl: string | URL;
+export interface LoginScopeProps {
+    serverUrl?: string | URL;
     callbackUrl: string | URL;
     oauthClientId: string;
     scope?: string;
@@ -22,13 +21,4 @@ export interface UseLoginScopeOptions {
 export interface UseLoginScopeResult extends LoginScopeRenderProps {
     isLoginLaunched: boolean;
 }
-export declare function buildOAuthAuthorizeUrl(params: {
-    serverUrl: string | URL;
-    callbackUrl: string | URL;
-    oauthClientId: string;
-    scope?: string;
-    provider?: string | null;
-    extraQueryParams?: Record<string, string>;
-    storage?: StorageLike;
-}): Promise<URL>;
-export declare function useLoginScope(options: UseLoginScopeOptions): UseLoginScopeResult;
+export declare function useLoginScope(props: LoginScopeProps): UseLoginScopeResult;