@civic/auth 0.1.3 → 0.1.4-beta.1

package/src/shared/providers/IframeProvider.tsx

@@ -1,34 +0,0 @@
-"use client";
-import type { Dispatch, ReactNode, RefObject, SetStateAction } from "react";
-import React, { createContext } from "react";
-
-export type IframeProviderOutput = {
-  iframeRef: RefObject<HTMLIFrameElement> | null;
-  setAuthResponseUrl: Dispatch<SetStateAction<string | null>>;
-};
-const defaultIframe: IframeProviderOutput = {
-  iframeRef: null,
-  setAuthResponseUrl: () => {},
-};
-
-// Context for exposing Iframe specifically to the TokenProvider
-const IframeContext = createContext<IframeProviderOutput>(defaultIframe);
-
-type IframeContextType = {
-  children: ReactNode;
-  iframeRef: RefObject<HTMLIFrameElement> | null;
-  setAuthResponseUrl: Dispatch<SetStateAction<string | null>>;
-};
-
-const IframeProvider = ({
-  children,
-  iframeRef,
-  setAuthResponseUrl,
-}: IframeContextType) => (
-  <IframeContext.Provider value={{ iframeRef, setAuthResponseUrl }}>
-    {children}
-  </IframeContext.Provider>
-);
-
-export type { IframeContextType };
-export { IframeProvider, IframeContext };

package/src/shared/providers/SessionProvider.tsx

@@ -1,29 +0,0 @@
-"use client";
-import type { SessionData } from "@/types.js";
-import type { ReactNode } from "react";
-import React, { createContext } from "react";
-
-export type SessionProviderOutput = SessionData;
-const defaultSession: SessionProviderOutput = {
-  authenticated: false,
-  idToken: undefined,
-  accessToken: undefined,
-  displayMode: "iframe",
-};
-
-// Context for exposing session specifically to the TokenProvider
-const SessionContext = createContext<SessionProviderOutput>(defaultSession);
-
-type SessionContextType = {
-  children: ReactNode;
-  session?: SessionData | null;
-};
-
-const SessionProvider = ({ children, session }: SessionContextType) => (
-  <SessionContext.Provider value={{ ...defaultSession, ...(session || {}) }}>
-    {children}
-  </SessionContext.Provider>
-);
-
-export type { SessionContextType };
-export { SessionProvider, SessionContext };

package/src/shared/providers/TokenProvider.tsx

@@ -1,78 +0,0 @@
-"use client";
-import type { ReactNode } from "react";
-import React, { createContext, useMemo } from "react";
-import { useMutation, useQueryClient } from "@tanstack/react-query";
-import { useAuth } from "@/shared/hooks/useAuth.js";
-import { useSession } from "@/shared/hooks/useSession.js";
-import type { ForwardedTokens, IdToken } from "@/types.js";
-import { parseJWT } from "oslo/jwt";
-import { convertForwardedTokenFormat } from "@/lib/jwt.js";
-
-type TokenContextType = {
-  accessToken: string | null;
-  idToken: string | null;
-  forwardedTokens: ForwardedTokens;
-  refreshToken: () => Promise<void>;
-  isLoading: boolean;
-  error: Error | null;
-};
-
-const TokenContext = createContext<TokenContextType | undefined>(undefined);
-
-const TokenProvider = ({ children }: { children: ReactNode }) => {
-  const { isLoading, error: authError } = useAuth();
-  const session = useSession();
-  const queryClient = useQueryClient();
-
-  const refreshTokenMutation = useMutation({
-    mutationFn: async () => {
-      // Implement token refresh logic here
-      throw new Error("Method not implemented.");
-    },
-    onSuccess: () => {
-      // Invalidate and refetch queries that depend on the auth session
-      queryClient.invalidateQueries({ queryKey: ["session"] });
-    },
-  });
-
-  const decodeTokens = useMemo(() => {
-    if (!session?.idToken) return null;
-
-    const parsedJWT = parseJWT(session.idToken) as IdToken | null;
-
-    if (!parsedJWT) return null;
-
-    const { forwardedTokens } = parsedJWT.payload;
-
-    return forwardedTokens
-      ? convertForwardedTokenFormat(forwardedTokens)
-      : null;
-  }, [session?.idToken]);
-
-  const value = useMemo(
-    () => ({
-      accessToken: session.accessToken || null,
-      idToken: session.idToken || null,
-      forwardedTokens: decodeTokens || {},
-      refreshToken: refreshTokenMutation.mutateAsync,
-      isLoading,
-      error: (authError || refreshTokenMutation.error) as Error | null,
-    }),
-    [
-      session.accessToken,
-      session.idToken,
-      decodeTokens,
-      refreshTokenMutation.mutateAsync,
-      refreshTokenMutation.error,
-      isLoading,
-      authError,
-    ],
-  );
-
-  return (
-    <TokenContext.Provider value={value}>{children}</TokenContext.Provider>
-  );
-};
-
-export type { TokenContextType };
-export { TokenProvider, TokenContext };

package/src/shared/providers/UserProvider.tsx

@@ -1,80 +0,0 @@
-"use client";
-
-import React, { createContext } from "react";
-import type { ReactNode } from "react";
-import type { UseQueryResult } from "@tanstack/react-query";
-import { useQuery } from "@tanstack/react-query";
-import type { JWT } from "oslo/jwt";
-import type { AuthStorage, EmptyObject, User } from "@/types.js";
-import { useAuth } from "@/shared/hooks/useAuth.js";
-import { useToken } from "@/shared/hooks/useToken.js";
-import { useSession } from "@/shared/hooks/useSession.js";
-import type { AuthContextType } from "@/shared/providers/AuthContext.js";
-import { GenericUserSession } from "@/shared/lib/UserSession.js";
-
-type UserContextType<
-  T extends Record<string, unknown> & JWT["payload"] = Record<string, unknown> &
-    JWT["payload"],
-> = {
-  user: User<T> | null;
-} & Omit<AuthContextType, "isAuthenticated">;
-
-const UserContext = createContext<UserContextType | null>(null);
-
-const UserProvider = <T extends EmptyObject>({
-  children,
-  storage,
-  user: inputUser,
-  signOut: inputSignOut,
-}: {
-  children: ReactNode;
-  storage: AuthStorage;
-  user?: User<T> | null;
-  signOut?: () => Promise<void>;
-}) => {
-  const { isLoading: authLoading, error: authError } = useAuth();
-  const session = useSession();
-  const { accessToken, idToken } = useToken();
-  const { signIn, signOut } = useAuth();
-
-  const fetchUser = async (): Promise<User | null> => {
-    if (!accessToken) {
-      return null;
-    }
-    const userSession = new GenericUserSession(storage);
-    return userSession.get();
-  };
-
-  const {
-    data: user,
-    isLoading: userLoading,
-    error: userError,
-  }: UseQueryResult<User<T> | null, Error> = useQuery({
-    queryKey: ["user", session?.idToken],
-    queryFn: fetchUser,
-    enabled: !!session?.idToken, // Only run the query if we have an access token
-  });
-
-  const isLoading = authLoading || userLoading;
-  const error = authError || userError;
-
-  const userWithIdToken = user ? { ...user, idToken } : null;
-
-  return (
-    <UserContext.Provider
-      value={{
-        user: (inputUser || userWithIdToken) ?? null,
-        isLoading,
-        error,
-        signIn,
-        signOut: inputSignOut || signOut,
-      }}
-    >
-      {children}
-    </UserContext.Provider>
-  );
-};
-
-export type { UserContextType };
-
-export { UserProvider, UserContext };

package/src/types.ts

@@ -1,227 +0,0 @@
-import type { TokenResponseBody } from "oslo/oauth2";
-import type { JWT } from "oslo/jwt";
-
-type UnknownObject = Record<string, unknown>;
-type EmptyObject = Record<string, never>;
-
-// Display modes for the auth flow
-type DisplayMode = "iframe" | "redirect" | "new_tab" | "custom_tab";
-
-// Combined Auth and Session Service
-interface AuthSessionService {
-  // TODO DK NOTES: Should be in BrowserAuthSessionService, not relevant on backend
-  loadAuthorizationUrl(
-    authorizationURL: string,
-    displayMode: DisplayMode,
-  ): void;
-  // TODO DK NOTES: overrideDisplayMode parameter not appropriate here - also - do we need both this and the above in the interface?
-  getAuthorizationUrl(
-    scopes: string[],
-    overrideDisplayMode: DisplayMode,
-    nonce?: string,
-  ): Promise<string>;
-  // TODO DK NOTES: display mode should be in browser version only. Also, do we need this and the above two in the top-level interface?
-  signIn(
-    displayMode: DisplayMode,
-    scopes: string[],
-    nonce?: string,
-  ): Promise<void>;
-  // TODO DK NOTES: Input should be an auth code - do not assume it comes via an url
-  tokenExchange(responseUrl: string): Promise<SessionData>;
-  // TODO DK NOTES: Should be async for flexibility
-  getSessionData(): SessionData;
-  // TODO DK NOTES: Should be async for flexibility
-  updateSessionData(data: SessionData): void;
-  getUserInfoService(): Promise<UserInfoService>;
-}
-
-// Token Service
-interface TokenService {
-  exchangeCodeForTokens(authCode: string): Promise<Tokens>;
-  validateIdToken(idToken: string, nonce: string): boolean;
-  refreshAccessToken(refreshToken: string): Promise<Tokens>;
-}
-
-// User Info Service
-interface UserInfoService {
-  getUserInfo<T extends UnknownObject>(
-    accessToken: string,
-    idToken: string | null,
-  ): Promise<User<T> | null>;
-}
-
-// Resource Service
-interface ResourceService {
-  getProtectedResource(accessToken: string): Promise<unknown>;
-}
-
-// Auth Request (for internal use in AuthSessionService)
-type AuthRequest = {
-  clientId: string;
-  redirectUri: string;
-  state: string;
-  nonce: string;
-  scope: string;
-};
-
-type Endpoints = {
-  jwks: string;
-  auth: string;
-  token: string;
-  userinfo: string;
-  challenge?: string;
-};
-
-type Config = {
-  oauthServer: string;
-  endpoints?: Endpoints;
-};
-
-type SessionData = {
-  authenticated: boolean; // TODO can this be inferred from the presence of the tokens?
-  state?: string;
-  accessToken?: string;
-  refreshToken?: string;
-  idToken?: string;
-  timestamp?: number;
-  expiresIn?: number;
-  codeVerifier?: string;
-  displayMode?: DisplayMode;
-  openerUrl?: string;
-};
-
-type OIDCTokenResponseBody = TokenResponseBody & { id_token: string };
-
-type ParsedTokens = {
-  id_token: JWTPayload;
-  access_token: JWTPayload;
-  refresh_token?: string;
-};
-
-// The format we expose to the frontend via hooks
-type ForwardedTokens = Record<
-  string,
-  {
-    idToken?: string;
-    accessToken?: string;
-    refreshToken?: string;
-  }
->;
-
-// The format in the JWT payload
-type ForwardedTokensJWT = Record<
-  string,
-  {
-    id_token?: string;
-    access_token?: string;
-    refresh_token?: string;
-    scope?: string;
-  }
->;
-
-type JWTPayload = JWT["payload"] & {
-  iss: string;
-  aud: string;
-  sub: string;
-  iat: number;
-  exp: number;
-};
-
-type IdTokenPayload = JWTPayload & {
-  forwardedTokens?: ForwardedTokensJWT;
-  email?: string;
-  name?: string;
-  picture?: string;
-  nonce: string;
-  at_hash: string;
-};
-
-type IdToken = Omit<JWT, "payload"> & {
-  payload: IdTokenPayload;
-};
-
-type Tokens = {
-  idToken: string;
-  accessToken: string;
-  refreshToken: string;
-  forwardedTokens: ForwardedTokens;
-};
-
-// Base user interface
-type BaseUser = {
-  id: string;
-  email?: string;
-  name?: string;
-  given_name?: string;
-  family_name?: string;
-  picture?: string;
-  updated_at?: Date;
-};
-
-type User<T extends UnknownObject = EmptyObject> = BaseUser &
-  Partial<Tokens> &
-  T;
-
-type OpenIdConfiguration = {
-  authorization_endpoint: string;
-  claims_parameter_supported: boolean;
-  claims_supported: string[];
-  code_challenge_methods_supported: string[];
-  end_session_endpoint: string;
-  grant_types_supported: string[];
-  issuer: string;
-  jwks_uri: string;
-  authorization_response_iss_parameter_supported: boolean;
-  response_modes_supported: string[];
-  response_types_supported: string[];
-  scopes_supported: string[];
-  subject_types_supported: string[];
-  token_endpoint_auth_methods_supported: string[];
-  token_endpoint_auth_signing_alg_values_supported: string[];
-  token_endpoint: string;
-  id_token_signing_alg_values_supported: string[];
-  pushed_authorization_request_endpoint: string;
-  request_parameter_supported: boolean;
-  request_uri_parameter_supported: boolean;
-  userinfo_endpoint: string;
-  claim_types_supported: string[];
-};
-
-type LoginPostMessage = {
-  source: string;
-  type: string;
-  clientId: string;
-  data: {
-    url: string;
-  };
-};
-export type {
-  LoginPostMessage,
-  AuthSessionService,
-  TokenService,
-  UserInfoService,
-  ResourceService,
-  AuthRequest,
-  Tokens,
-  Endpoints,
-  Config,
-  SessionData,
-  OIDCTokenResponseBody,
-  ParsedTokens,
-  BaseUser,
-  User,
-  DisplayMode,
-  UnknownObject,
-  EmptyObject,
-  ForwardedTokens,
-  ForwardedTokensJWT,
-  JWTPayload,
-  IdTokenPayload,
-  IdToken,
-  OpenIdConfiguration,
-};
-
-export interface AuthStorage {
-  get(key: string): Promise<string | null>;
-  set(key: string, value: string): Promise<void>;
-}

package/src/utils.ts

@@ -1,58 +0,0 @@
-/**
- * Checks if a popup window is blocked by the browser.
- *
- * This function attempts to open a small popup window and then checks if it was successfully created.
- * If the popup is blocked by the browser, the function returns `true`. Otherwise, it returns `false`.
- *
- * @returns {boolean} - `true` if the popup is blocked, `false` otherwise.
- */
-const isPopupBlocked = (): boolean => {
-  // First we try to open a small popup window. It either returns a window object or null.
-  const popup = window.open("", "", "width=1,height=1");
-
-  // If window.open() returns null, popup is definitely blocked
-  if (!popup) {
-    return true;
-  }
-
-  try {
-    // Try to access a property of the popup to check if it's usable
-    if (typeof popup.closed === "undefined") {
-      throw new Error("Popup is blocked");
-    }
-  } catch {
-    // Accessing the popup's properties throws an error if the popup is blocked
-    return true;
-  }
-
-  // Close the popup immediately if it was opened
-  popup.close();
-  return false;
-};
-
-// This type narrows T as far as it can by:
-// - removing all keys where the value is `undefined`
-// - making keys that are not undefined required
-// So, for example: given { a: string | undefined, b: string | undefined },
-// if you pass in { a: "foo" }, it returns an object of type: { a: string }
-type WithoutUndefined<T> = {
-  [K in keyof T as undefined extends T[K] ? never : K]: T[K];
-};
-export const withoutUndefined = <T extends { [K in keyof T]: unknown }>(
-  obj: T,
-): WithoutUndefined<T> => {
-  const result = {} as WithoutUndefined<T>;
-
-  for (const key in obj) {
-    if (obj[key] !== undefined) {
-      // TypeScript needs assurance that key is a valid key in WithoutUndefined<T>
-      // We use type assertion here
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      (result as any)[key] = obj[key];
-    }
-  }
-
-  return result;
-};
-
-export { isPopupBlocked };