@crossmint/client-sdk-react-ui 1.9.2 → 1.10.0

package/src/providers/auth/AuthFormProvider.test.tsx

@@ -1,19 +1,28 @@
+import type { ReactNode } from "react";
 import { render, fireEvent, waitFor } from "@testing-library/react";
+import { beforeEach } from "vitest";
 import { AuthFormProvider, useAuthForm } from "./AuthFormProvider";
-import { describe, expect, test, vi } from "vitest";
-import type { LoginMethod } from "..";
+import { describe, expect, it, vi } from "vitest";
+import type { CrossmintAuthWalletConfig, LoginMethod } from "..";
+import { useCrossmintAuth } from "@/hooks/useCrossmintAuth";
+
+vi.mock("./web3/WagmiAuthProvider", () => ({
+    WagmiAuthProvider: ({ children }: { children: ReactNode }) => <>{children}</>,
+}));
+
+vi.mock("@/hooks/useCrossmintAuth");
 
 // Mock component to test the AuthFormProvider
 function TestComponent() {
-    const { step, apiKey, baseUrl, loginMethods, setStep, setDialogOpen, oauthUrlMap, isLoadingOauthUrlMap } =
+    const { step, baseUrl, loginMethods, setStep, setDialogOpen, oauthUrlMap, isLoadingOauthUrlMap, appearance } =
         useAuthForm();
 
     return (
         <div>
             <div data-testid="step">{step}</div>
-            <div data-testid="api-key">{apiKey}</div>
             <div data-testid="base-url">{baseUrl}</div>
             <div data-testid="login-methods">{JSON.stringify(loginMethods)}</div>
+            <div data-testid="appearance">{JSON.stringify(appearance)}</div>
             <button onClick={() => setStep("otp")} data-testid="set-step">
                 Set Step to OTP
             </button>
@@ -27,24 +36,35 @@ function TestComponent() {
 }
 
 describe("AuthFormProvider", () => {
-    const mockFetchAuthMaterial = vi.fn().mockResolvedValue({});
     const mockInitialState = {
-        apiKey: "test-api-key",
         baseUrl: "https://api.example.com",
-        fetchAuthMaterial: mockFetchAuthMaterial,
-        loginMethods: ["email", "google"] as LoginMethod[],
+        loginMethods: ["email", "google", "farcaster", "web3"] as LoginMethod[],
         setDialogOpen: vi.fn(),
+        embeddedWallets: {
+            createOnLogin: "off",
+            defaultChain: "base-sepolia",
+            type: "evm-smart-wallet",
+        } as CrossmintAuthWalletConfig,
+        appearance: {
+            colors: {
+                textPrimary: "#000000",
+                textSecondary: "#A4AFB2",
+            },
+        },
     };
+    const mockedGetOAuthUrl = vi.fn();
 
     beforeEach(() => {
         vi.resetAllMocks();
-        global.fetch = vi.fn().mockResolvedValue({
-            ok: true,
-            json: () => Promise.resolve({ oauthUrl: "https://oauth.example.com" }),
-        });
+
+        vi.mocked(useCrossmintAuth).mockReturnValue({
+            crossmintAuth: {
+                getOAuthUrl: mockedGetOAuthUrl.mockResolvedValue("https://oauth.example.com"),
+            },
+        } as any);
     });
 
-    test("provides initial context values and fetches OAuth URLs", async () => {
+    it("provides initial context values and fetches OAuth URLs", async () => {
         const { getByTestId } = render(
             <AuthFormProvider initialState={mockInitialState}>
                 <TestComponent />
@@ -52,9 +72,11 @@ describe("AuthFormProvider", () => {
         );
 
         expect(getByTestId("step").textContent).toBe("initial");
-        expect(getByTestId("api-key").textContent).toBe("test-api-key");
         expect(getByTestId("base-url").textContent).toBe("https://api.example.com");
-        expect(getByTestId("login-methods").textContent).toBe('["email","google"]');
+        expect(getByTestId("login-methods").textContent).toBe('["email","google","farcaster","web3"]');
+        expect(getByTestId("appearance").textContent).toBe(
+            '{"colors":{"textPrimary":"#000000","textSecondary":"#A4AFB2"}}'
+        );
 
         await waitFor(() => {
             expect(getByTestId("oauth-url").textContent).toBe('{"google":"https://oauth.example.com"}');
@@ -62,7 +84,7 @@ describe("AuthFormProvider", () => {
         });
     });
 
-    test("updates step", () => {
+    it("updates step", () => {
         const { getByTestId } = render(
             <AuthFormProvider initialState={mockInitialState}>
                 <TestComponent />
@@ -73,7 +95,7 @@ describe("AuthFormProvider", () => {
         expect(getByTestId("step").textContent).toBe("otp");
     });
 
-    test("calls setDialogOpen", () => {
+    it("calls setDialogOpen", () => {
         const { getByTestId } = render(
             <AuthFormProvider initialState={mockInitialState}>
                 <TestComponent />
@@ -84,8 +106,8 @@ describe("AuthFormProvider", () => {
         expect(mockInitialState.setDialogOpen).toHaveBeenCalledWith(true);
     });
 
-    test("handles OAuth URL fetch error", async () => {
-        global.fetch = vi.fn().mockRejectedValue(new Error("Fetch failed"));
+    it("handles OAuth URL fetch error", async () => {
+        vi.mocked(mockedGetOAuthUrl).mockRejectedValue(new Error("Fetch failed"));
         const consoleSpy = vi.spyOn(console, "error").mockImplementation(() => {});
 
         const { getByTestId } = render(
@@ -102,4 +124,24 @@ describe("AuthFormProvider", () => {
         expect(consoleSpy).toHaveBeenCalled();
         consoleSpy.mockRestore();
     });
+
+    test("throws error when web3 login method is used with createOnLogin=all-users", () => {
+        const invalidState = {
+            ...mockInitialState,
+            loginMethods: ["web3"] as LoginMethod[],
+            embeddedWallets: {
+                createOnLogin: "all-users",
+                defaultChain: "base-sepolia",
+                type: "evm-smart-wallet",
+            } as CrossmintAuthWalletConfig,
+        };
+
+        expect(() =>
+            render(
+                <AuthFormProvider initialState={invalidState}>
+                    <TestComponent />
+                </AuthFormProvider>
+            )
+        ).toThrowError("Creating wallets on login is not yet supported for web3 login method");
+    });
 });

package/src/providers/auth/AuthFormProvider.tsx

@@ -1,9 +1,12 @@
-import { createContext, useContext, useEffect, useState, type ReactNode } from "react";
-import type { AuthMaterialWithUser, OAuthProvider } from "@crossmint/common-sdk-auth";
+import { createContext, useCallback, useContext, useEffect, useState, type ReactNode } from "react";
+import type { OAuthProvider } from "@crossmint/common-sdk-auth";
 import type { UIConfig } from "@crossmint/common-sdk-base";
-import type { LoginMethod } from "../CrossmintAuthProvider";
+import type { CrossmintAuthWalletConfig, LoginMethod } from "../CrossmintAuthProvider";
+import { useCrossmintAuth } from "@/hooks/useCrossmintAuth";
+import { WagmiAuthProvider } from "./web3/WagmiAuthProvider";
+
+type AuthStep = "initial" | "otp" | "qrCode" | "web3" | "web3/metamask" | "web3/walletconnect";
 
-type AuthStep = "initial" | "walletMethod" | "otp" | "qrCode";
 type OAuthUrlMap = Record<OAuthProvider, string>;
 const initialOAuthUrlMap: OAuthUrlMap = {
     google: "",
@@ -11,24 +14,21 @@ const initialOAuthUrlMap: OAuthUrlMap = {
 };
 interface AuthFormContextType {
     step: AuthStep;
-    apiKey: string;
-    baseUrl: string;
-    fetchAuthMaterial: (refreshToken: string) => Promise<AuthMaterialWithUser>;
     appearance?: UIConfig;
     loginMethods: LoginMethod[];
     oauthUrlMap: OAuthUrlMap;
     isLoadingOauthUrlMap: boolean;
+    baseUrl: string;
     setStep: (step: AuthStep) => void;
     setDialogOpen: (open: boolean) => void;
 }
 
 type ContextInitialStateProps = {
-    apiKey: string;
-    baseUrl: string;
-    fetchAuthMaterial: (refreshToken: string) => Promise<AuthMaterialWithUser>;
     appearance?: UIConfig;
     loginMethods: LoginMethod[];
+    baseUrl: string;
     setDialogOpen?: (open: boolean) => void;
+    embeddedWallets: CrossmintAuthWalletConfig;
 };
 
 const AuthFormContext = createContext<AuthFormContextType | undefined>(undefined);
@@ -45,72 +45,64 @@ export const AuthFormProvider = ({
     children,
     initialState,
 }: { children: ReactNode; initialState: ContextInitialStateProps }) => {
+    const { crossmintAuth } = useCrossmintAuth();
     const [step, setStep] = useState<AuthStep>("initial");
     const [oauthUrlMap, setOauthUrlMap] = useState<OAuthUrlMap>(initialOAuthUrlMap);
     const [isLoadingOauthUrlMap, setIsLoadingOauthUrlMap] = useState(true);
 
-    const { loginMethods, apiKey, baseUrl } = initialState;
+    const { loginMethods, baseUrl, setDialogOpen, appearance, embeddedWallets } = initialState;
 
-    useEffect(() => {
-        const preFetchAndSetOauthUrl = async () => {
-            setIsLoadingOauthUrlMap(true);
-            try {
-                const oauthProviders = loginMethods.filter(
-                    (method): method is OAuthProvider => method in initialOAuthUrlMap
-                );
+    if (loginMethods.includes("web3") && embeddedWallets?.createOnLogin === "all-users") {
+        throw new Error("Creating wallets on login is not yet supported for web3 login method");
+    }
+
+    const preFetchAndSetOauthUrl = useCallback(async () => {
+        setIsLoadingOauthUrlMap(true);
+        try {
+            const oauthProviders = loginMethods.filter(
+                (method): method is OAuthProvider => method in initialOAuthUrlMap
+            );
 
-                const oauthPromiseList = oauthProviders.map(async (provider) => {
-                    const url = await getOAuthUrl(provider, { apiKey, baseUrl });
-                    return { [provider]: url };
-                });
+            const oauthPromiseList = oauthProviders.map(async (provider) => {
+                const url = await crossmintAuth?.getOAuthUrl(provider);
+                return { [provider]: url };
+            });
+
+            const oauthUrlMap = Object.assign({}, ...(await Promise.all(oauthPromiseList)));
+            setOauthUrlMap(oauthUrlMap);
+        } catch (error) {
+            console.error("Error fetching OAuth URLs:", error);
+        } finally {
+            setIsLoadingOauthUrlMap(false);
+        }
+    }, [loginMethods, crossmintAuth]);
 
-                const oauthUrlMap = Object.assign({}, ...(await Promise.all(oauthPromiseList)));
-                setOauthUrlMap(oauthUrlMap);
-            } catch (error) {
-                console.error("Error fetching OAuth URLs:", error);
-            } finally {
-                setIsLoadingOauthUrlMap(false);
-            }
-        };
+    useEffect(() => {
         preFetchAndSetOauthUrl();
-    }, [loginMethods, apiKey, baseUrl]);
+    }, [preFetchAndSetOauthUrl]);
+
+    const handleToggleDialog = (open: boolean) => {
+        setDialogOpen?.(open);
+        if (!open) {
+            // Delay to allow the close transition to complete before resetting the step
+            setTimeout(() => setStep("initial"), 250);
+        }
+    };
 
     const value: AuthFormContextType = {
         step,
-        apiKey,
         baseUrl,
-        fetchAuthMaterial: initialState.fetchAuthMaterial,
-        appearance: initialState.appearance,
+        appearance,
         loginMethods,
         oauthUrlMap,
         isLoadingOauthUrlMap,
-        setDialogOpen: initialState.setDialogOpen ?? (() => {}),
+        setDialogOpen: handleToggleDialog,
         setStep,
     };
 
-    return <AuthFormContext.Provider value={value}>{children}</AuthFormContext.Provider>;
+    return (
+        <AuthFormContext.Provider value={value}>
+            <WagmiAuthProvider>{children}</WagmiAuthProvider>
+        </AuthFormContext.Provider>
+    );
 };
-
-async function getOAuthUrl(provider: OAuthProvider, options: { baseUrl: string; apiKey: string }) {
-    try {
-        const queryParams = new URLSearchParams({ apiKey: options.apiKey });
-        const response = await fetch(
-            `${options.baseUrl}api/2024-09-26/session/sdk/auth/social/${provider}/start?${queryParams}`,
-            {
-                headers: {
-                    "x-api-key": options.apiKey,
-                },
-            }
-        );
-
-        if (!response.ok) {
-            throw new Error("Failed to get OAuth URL. Please try again or contact support.");
-        }
-
-        const data = (await response.json()) as { oauthUrl: string };
-        return data.oauthUrl;
-    } catch (error) {
-        console.error(`Error fetching OAuth URL for ${provider}:`, error);
-        throw new Error(`Failed to get OAuth URL for ${provider}. Please try again or contact support.`);
-    }
-}

package/src/providers/auth/web3/WagmiAuthProvider.tsx

@@ -0,0 +1,56 @@
+import type React from "react";
+import { createConfig, http, WagmiProvider } from "wagmi";
+import {
+    arbitrum,
+    arbitrumSepolia,
+    base,
+    baseSepolia,
+    optimism,
+    optimismSepolia,
+    polygon,
+    polygonAmoy,
+    mainnet,
+} from "wagmi/chains";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { metaMask, walletConnect } from "wagmi/connectors";
+
+const ALCHEMY_API_KEY = "-7M6vRDBDknwvMxnqah_jbcieWg0qad9";
+const ALCHEMY_RPC_SUBDOMAIN = {
+    mainnet: "mainnet",
+    polygon: "polygon-mainnet",
+    "polygon-amoy": "polygon-amoy",
+    base: "base-mainnet",
+    "base-sepolia": "base-sepolia",
+    optimism: "opt-mainnet",
+    "optimism-sepolia": "opt-sepolia",
+    arbitrum: "arb-mainnet",
+    "arbitrum-sepolia": "arb-sepolia",
+};
+function getAlchemyRPC(chain: keyof typeof ALCHEMY_RPC_SUBDOMAIN): string {
+    return `https://${ALCHEMY_RPC_SUBDOMAIN[chain]}.g.alchemy.com/v2/${ALCHEMY_API_KEY}`;
+}
+
+const config = createConfig({
+    chains: [mainnet, base, polygon, optimism, arbitrum, baseSepolia, polygonAmoy, optimismSepolia, arbitrumSepolia],
+    connectors: [metaMask(), walletConnect({ projectId: "94ed8f7549329dad7be968888eec3688" })],
+    transports: {
+        [mainnet.id]: http(getAlchemyRPC("mainnet")),
+        [base.id]: http(getAlchemyRPC("base")),
+        [polygon.id]: http(getAlchemyRPC("polygon")),
+        [optimism.id]: http(getAlchemyRPC("optimism")),
+        [arbitrum.id]: http(getAlchemyRPC("arbitrum")),
+        [baseSepolia.id]: http(getAlchemyRPC("base-sepolia")),
+        [polygonAmoy.id]: http(getAlchemyRPC("polygon-amoy")),
+        [optimismSepolia.id]: http(getAlchemyRPC("optimism-sepolia")),
+        [arbitrumSepolia.id]: http(getAlchemyRPC("arbitrum-sepolia")),
+    },
+});
+
+export function WagmiAuthProvider({ children }: { children: React.ReactNode }) {
+    const queryClient = new QueryClient();
+    return (
+        <WagmiProvider config={config}>
+            <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
+        </WagmiProvider>
+    );
+}

package/src/testUtils.ts

@@ -1,5 +1 @@
 export const MOCK_API_KEY = "sk_development_12341234";
-export const waitForSettledState = async (callback: () => void) => {
-    await new Promise((resolve) => setTimeout(resolve, 20));
-    callback();
-};

package/src/twind.config.ts

@@ -4,9 +4,6 @@ import presetTailwind from "@twind/preset-tailwind";
 export default defineConfig({
     presets: [presetTailwind()],
     theme: {
-        screens: {
-            xs: "480px",
-        },
         extend: {
             colors: {
                 // Crossmint colors (cm- prefix)
@@ -14,8 +11,10 @@ export default defineConfig({
                 "cm-text-secondary": "#67797F",
                 "cm-background-primary": "#FFFFFF",
                 "cm-muted-primary": "#F0F2F4",
+                "cm-hover": "#E9ECF0",
                 "cm-border": "#D9D9D9",
-                "cm-ring": "#1A73E8",
+                "cm-link": "#1A73E8",
+                "cm-accent": "#04AA6D",
             },
             keyframes: {
                 "caret-blink": {
@@ -94,7 +93,7 @@ export default defineConfig({
     },
     rules: [
         [
-            "responsive-border-radius-auth-dialog",
+            "cm-responsive-border-radius-auth-dialog",
             {
                 "@media (max-width: 479px)": {
                     "border-bottom-left-radius": "0 !important",
@@ -102,6 +101,14 @@ export default defineConfig({
                 },
             },
         ],
+        [
+            "focus-ring-custom",
+            {
+                "&:focus": {
+                    "box-shadow": "0 0 0 3px var(--focus-ring-color)",
+                },
+            },
+        ],
     ],
     /* config */
 });

package/src/hooks/useAuthSignIn.ts

@@ -1,117 +0,0 @@
-import type { UseSignInData } from "@farcaster/auth-kit";
-
-export function useAuthSignIn() {
-    return {
-        onEmailSignIn,
-        onConfirmEmailOtp,
-        onFarcasterSignIn,
-    };
-}
-
-async function onEmailSignIn(email: string, options: { baseUrl: string; apiKey: string }) {
-    try {
-        const queryParams = new URLSearchParams({ apiKey: options.apiKey });
-        const response = await fetch(`${options.baseUrl}api/2024-09-26/session/sdk/auth/otps/send?${queryParams}`, {
-            headers: {
-                "Content-Type": "application/json",
-                "x-api-key": options.apiKey,
-            },
-            credentials: "same-origin",
-            cache: "no-cache",
-            mode: "cors",
-            method: "POST",
-            body: JSON.stringify({ email }),
-        });
-
-        if (!response?.ok) {
-            throw new Error("Failed to send email. Please try again or contact support.");
-        }
-
-        return await response.json();
-    } catch (err) {
-        console.error("Error signing in via email ", err);
-        throw new Error("Error signing in via email " + err);
-    }
-}
-
-async function onConfirmEmailOtp(
-    email: string,
-    emailId: string,
-    token: string,
-    options: { baseUrl: string; apiKey: string }
-) {
-    try {
-        const queryParams = new URLSearchParams({
-            email,
-            signinAuthenticationMethod: "email",
-            apiKey: options.apiKey,
-            token,
-            locale: "en",
-            state: emailId,
-            callbackUrl: `${options.baseUrl}api/2024-09-26/session/sdk/auth/we-dont-actually-use-this-anymore`,
-        });
-        const response = await fetch(`${options.baseUrl}api/2024-09-26/session/sdk/auth/authenticate?${queryParams}`, {
-            headers: {
-                "Content-Type": "application/json",
-                "x-api-key": options.apiKey,
-            },
-            credentials: "same-origin",
-            cache: "no-cache",
-            mode: "cors",
-            method: "POST",
-        });
-
-        if (!response?.ok) {
-            throw new Error("Failed to confirm email otp. Please try again or contact support.");
-        }
-
-        const data = await response.json();
-        const callbackUrl = new URL(data.callbackUrl);
-
-        // parse the oneTimeSecret from the callbackUrl response
-        return callbackUrl.searchParams.get("oneTimeSecret");
-    } catch (err) {
-        console.error("Error confirming email otp ", err);
-        throw new Error("Error confirming email otp " + err);
-    }
-}
-
-async function onFarcasterSignIn(data: UseSignInData, options: { baseUrl: string; apiKey: string }) {
-    try {
-        const queryParams = new URLSearchParams({
-            signinAuthenticationMethod: "farcaster",
-            apiKey: options.apiKey,
-            callbackUrl: `${options.baseUrl}sdk/2024-09-26/auth/callback?isPopup=false`,
-        });
-
-        const response = await fetch(`${options.baseUrl}api/2024-09-26/session/sdk/auth/authenticate?${queryParams}`, {
-            headers: {
-                "Content-Type": "application/json",
-                "x-api-key": options.apiKey,
-            },
-            body: JSON.stringify({
-                ...data,
-                domain: data.signatureParams.domain,
-                redirect: true,
-                callbackUrl: `${options.baseUrl}sdk/2024-09-26/auth/callback?isPopup=false`,
-            }),
-            credentials: "same-origin",
-            cache: "no-cache",
-            mode: "cors",
-            method: "POST",
-        });
-
-        if (!response?.ok) {
-            throw new Error("Failed to sign in via farcaster. Please try again or contact support.");
-        }
-
-        const resData = await response.json();
-        const callbackUrl = new URL(resData.callbackUrl);
-
-        // parse the oneTimeSecret from the callbackUrl response
-        return callbackUrl.searchParams.get("oneTimeSecret");
-    } catch (err) {
-        console.error("Error signing in via farcaster ", err);
-        throw new Error("Error signing in via farcaster " + err);
-    }
-}

package/src/hooks/useRefreshToken.test.ts

@@ -1,155 +0,0 @@
-import { act, renderHook } from "@testing-library/react";
-import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
-
-import type { AuthMaterialWithUser } from "@crossmint/common-sdk-auth";
-import { type CrossmintAuthService, getJWTExpiration } from "@crossmint/client-sdk-auth";
-import { queueTask } from "@crossmint/client-sdk-base";
-
-import * as authCookies from "../utils/authCookies";
-import { useRefreshToken } from "./useRefreshToken";
-
-vi.mock("@crossmint/client-sdk-auth", () => ({
-    CrossmintAuthService: vi.fn(),
-    getJWTExpiration: vi.fn(),
-}));
-
-vi.mock("../utils/authCookies", () => ({
-    getCookie: vi.fn(),
-    REFRESH_TOKEN_PREFIX: "crossmint-refresh-token",
-}));
-
-vi.mock("@crossmint/client-sdk-base", async () => {
-    const actual = await vi.importActual("@crossmint/client-sdk-base");
-    return {
-        ...actual,
-        queueTask: vi.fn(),
-    };
-});
-
-describe("useRefreshToken", () => {
-    const mockCrossmintAuthService = {
-        refreshAuthMaterial: vi.fn(),
-    } as unknown as CrossmintAuthService;
-
-    const mockSetAuthMaterial = vi.fn();
-
-    beforeEach(() => {
-        vi.useFakeTimers();
-        vi.spyOn(console, "error").mockImplementation(() => {});
-    });
-
-    afterEach(() => {
-        vi.restoreAllMocks();
-        vi.useRealTimers();
-    });
-
-    it("should not refresh token if refresh token is not present", async () => {
-        vi.mocked(authCookies.getCookie).mockReturnValue(undefined);
-
-        renderHook(() =>
-            useRefreshToken({
-                crossmintAuthService: mockCrossmintAuthService,
-                setAuthMaterial: mockSetAuthMaterial,
-                logout: vi.fn(),
-            })
-        );
-
-        await act(async () => {
-            await vi.runAllTimersAsync();
-        });
-
-        expect(mockCrossmintAuthService.refreshAuthMaterial).not.toHaveBeenCalled();
-        expect(mockSetAuthMaterial).not.toHaveBeenCalled();
-    });
-
-    it("should refresh token if refresh token is present", async () => {
-        const mockRefreshToken = "mock-refresh-token";
-        const mockAuthMaterial: AuthMaterialWithUser = {
-            jwt: "mock-jwt-token",
-            refreshToken: {
-                secret: "mock-secret",
-                expiresAt: "2023-04-01T00:00:00Z",
-            },
-            user: {
-                id: "123",
-                email: "test@test.com",
-            },
-        };
-
-        vi.mocked(authCookies.getCookie).mockReturnValue(mockRefreshToken);
-        vi.mocked(mockCrossmintAuthService.refreshAuthMaterial).mockResolvedValue(mockAuthMaterial);
-        vi.mocked(getJWTExpiration).mockReturnValue(Date.now() / 1000 + 3600); // 1 hour from now
-
-        renderHook(() =>
-            useRefreshToken({
-                crossmintAuthService: mockCrossmintAuthService,
-                setAuthMaterial: mockSetAuthMaterial,
-                logout: vi.fn(),
-            })
-        );
-
-        await act(async () => {
-            await vi.runAllTimersAsync();
-        });
-
-        expect(mockCrossmintAuthService.refreshAuthMaterial).toHaveBeenCalledWith(mockRefreshToken);
-        expect(mockSetAuthMaterial).toHaveBeenCalledWith(mockAuthMaterial);
-    });
-
-    it("should schedule next refresh before token expiration", async () => {
-        const mockRefreshToken = "mock-refresh-token";
-        const mockAuthMaterial: AuthMaterialWithUser = {
-            jwt: "mock-jwt-token",
-            refreshToken: {
-                secret: "mock-secret",
-                expiresAt: "2023-04-01T00:00:00Z",
-            },
-            user: {
-                id: "123",
-                email: "test@test.com",
-            },
-        };
-
-        vi.mocked(authCookies.getCookie).mockReturnValue(mockRefreshToken);
-        vi.mocked(mockCrossmintAuthService.refreshAuthMaterial).mockResolvedValue(mockAuthMaterial);
-        vi.mocked(getJWTExpiration).mockReturnValue(Date.now() / 1000 + 3600); // 1 hour from now
-
-        renderHook(() =>
-            useRefreshToken({
-                crossmintAuthService: mockCrossmintAuthService,
-                setAuthMaterial: mockSetAuthMaterial,
-                logout: vi.fn(),
-            })
-        );
-
-        await act(async () => {
-            await vi.runAllTimersAsync();
-        });
-
-        expect(vi.mocked(queueTask)).toHaveBeenCalledTimes(1);
-        expect(vi.mocked(queueTask)).toHaveBeenCalledWith(expect.any(Function), expect.any(Number));
-    });
-
-    it("should handle errors during token refresh", async () => {
-        const mockRefreshToken = "mock-refresh-token";
-        const mockError = new Error("Refresh failed");
-
-        vi.mocked(authCookies.getCookie).mockReturnValue(mockRefreshToken);
-        vi.mocked(mockCrossmintAuthService.refreshAuthMaterial).mockRejectedValue(mockError);
-
-        renderHook(() =>
-            useRefreshToken({
-                crossmintAuthService: mockCrossmintAuthService,
-                setAuthMaterial: mockSetAuthMaterial,
-                logout: vi.fn(),
-            })
-        );
-
-        await act(async () => {
-            await vi.runAllTimersAsync();
-        });
-
-        expect(console.error).toHaveBeenCalledWith(mockError);
-        expect(mockSetAuthMaterial).not.toHaveBeenCalled();
-    });
-});