@workos-inc/authkit-nextjs 3.0.0-beta.1 → 3.0.1

package/src/components/tokenStore.ts

@@ -1,6 +1,14 @@
 import { getAccessTokenAction, refreshAccessTokenAction } from '../actions.js';
+import type { RefreshAccessTokenActionResult } from '../actions.js';
 import { decodeJwt } from '../jwt.js';
 
+function unwrapRefreshResult(result: RefreshAccessTokenActionResult): string | undefined {
+  if (result.error) {
+    throw new Error(result.error);
+  }
+  return result.accessToken;
+}
+
 interface TokenState {
   token: string | undefined;
   loading: boolean;
@@ -323,7 +331,7 @@ export class TokenStore {
 
         if (!silent) {
           // Manual refresh - always force refresh
-          token = await refreshAccessTokenAction();
+          token = unwrapRefreshResult(await refreshAccessTokenAction());
         } else {
           // Silent refresh - only fetch from server if we don't have a local token
           if (!previousToken) {
@@ -342,14 +350,14 @@ export class TokenStore {
 
             // If the token from server is expiring, refresh it
             if (!token || (tokenData && tokenData.isExpiring)) {
-              const refreshedToken = await refreshAccessTokenAction();
+              const refreshedToken = unwrapRefreshResult(await refreshAccessTokenAction());
               if (refreshedToken) {
                 token = refreshedToken;
               }
             }
           } else {
             // We have a local token that needs refreshing (already checked by getAccessTokenSilently)
-            token = await refreshAccessTokenAction();
+            token = unwrapRefreshResult(await refreshAccessTokenAction());
           }
         }
 

package/src/components/useAccessToken.spec.tsx

@@ -1,3 +1,4 @@
+import type { Mock } from 'vitest';
 import '@testing-library/jest-dom';
 import { act, render, waitFor } from '@testing-library/react';
 import React from 'react';
@@ -6,41 +7,37 @@ import { useAuth } from './authkit-provider.js';
 import { useAccessToken } from './useAccessToken.js';
 import { tokenStore } from './tokenStore.js';
 
-jest.mock('../actions.js', () => ({
-  getAccessTokenAction: jest.fn(),
-  refreshAccessTokenAction: jest.fn(),
+vi.mock('../actions.js', () => ({
+  getAccessTokenAction: vi.fn(),
+  refreshAccessTokenAction: vi.fn(),
 }));
 
-jest.mock('./authkit-provider.js', () => {
-  const originalModule = jest.requireActual('./authkit-provider.js');
+vi.mock('./authkit-provider.js', async () => {
+  const originalModule = await vi.importActual<typeof import('./authkit-provider.js')>('./authkit-provider.js');
   return {
     ...originalModule,
-    useAuth: jest.fn(),
+    useAuth: vi.fn(),
   };
 });
 
 describe('useAccessToken', () => {
   beforeEach(() => {
     tokenStore.reset();
-    jest.resetAllMocks();
-    jest.useFakeTimers();
+    vi.resetAllMocks();
+    vi.useFakeTimers({ shouldAdvanceTime: true });
 
-    // Reset mock implementations to avoid test interference
-    (getAccessTokenAction as jest.Mock).mockReset();
-    (refreshAccessTokenAction as jest.Mock).mockReset();
-
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user_123' },
       sessionId: 'session_123',
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
   });
 
   afterEach(() => {
-    jest.clearAllTimers();
-    jest.useRealTimers();
+    vi.clearAllTimers();
+    vi.useRealTimers();
     tokenStore.reset();
-    jest.clearAllMocks();
+    vi.clearAllMocks();
   });
 
   const TestComponent = () => {
@@ -60,7 +57,7 @@ describe('useAccessToken', () => {
   it('should fetch an access token on mount and show loading state initially', async () => {
     const mockToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(mockToken);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(mockToken);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -92,8 +89,8 @@ describe('useAccessToken', () => {
     const refreshedToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
 
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(expiringToken);
-    (refreshAccessTokenAction as jest.Mock).mockResolvedValueOnce(refreshedToken);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(expiringToken);
+    (refreshAccessTokenAction as Mock).mockResolvedValueOnce({ accessToken: refreshedToken });
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -115,8 +112,8 @@ describe('useAccessToken', () => {
     const refreshedToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJyZWZyZXNoZWQiLCJzaWQiOiJzZXNzaW9uXzEyMyIsImV4cCI6OTk5OTk5OTk5OX0.mock-signature-2';
 
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(initialToken);
-    (refreshAccessTokenAction as jest.Mock).mockResolvedValueOnce(refreshedToken);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(initialToken);
+    (refreshAccessTokenAction as Mock).mockResolvedValueOnce({ accessToken: refreshedToken });
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -141,10 +138,10 @@ describe('useAccessToken', () => {
   });
 
   it('should handle the not loggged in state', async () => {
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: undefined,
       sessionId: undefined,
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     const { getByTestId } = render(<TestComponent />);
@@ -157,7 +154,7 @@ describe('useAccessToken', () => {
 
   it('should handle errors during token fetch', async () => {
     const error = new Error('Failed to fetch token');
-    (getAccessTokenAction as jest.Mock).mockRejectedValueOnce(error);
+    (getAccessTokenAction as Mock).mockRejectedValueOnce(error);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -174,10 +171,12 @@ describe('useAccessToken', () => {
   it('should handle errors during manual refresh', async () => {
     const initialToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
-    const error = new Error('Failed to refresh token');
 
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(initialToken);
-    (refreshAccessTokenAction as jest.Mock).mockRejectedValueOnce(error);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(initialToken);
+    (refreshAccessTokenAction as Mock).mockResolvedValueOnce({
+      accessToken: undefined,
+      error: 'Failed to refresh token',
+    });
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -200,13 +199,13 @@ describe('useAccessToken', () => {
   it('should reset token state when user is undefined', async () => {
     const mockToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(mockToken);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(mockToken);
 
     // First render with user
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user_123' },
       sessionId: 'session_123',
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     const { getByTestId, rerender } = render(<TestComponent />);
@@ -215,10 +214,10 @@ describe('useAccessToken', () => {
       expect(getByTestId('token')).toHaveTextContent(mockToken);
     });
 
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: undefined,
       sessionId: undefined,
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     rerender(<TestComponent />);
@@ -230,7 +229,7 @@ describe('useAccessToken', () => {
 
   it('should handle invalid tokens gracefully', async () => {
     const invalidToken = 'invalid-token';
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(invalidToken);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(invalidToken);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -246,7 +245,7 @@ describe('useAccessToken', () => {
     const mockToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
 
-    (getAccessTokenAction as jest.Mock).mockRejectedValueOnce(error).mockResolvedValueOnce(mockToken);
+    (getAccessTokenAction as Mock).mockRejectedValueOnce(error).mockResolvedValueOnce(mockToken);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -257,7 +256,7 @@ describe('useAccessToken', () => {
     });
 
     act(() => {
-      jest.advanceTimersByTime(5 * 60 * 1000); // RETRY_DELAY
+      vi.advanceTimersByTime(5 * 60 * 1000); // RETRY_DELAY
     });
 
     // Loading should remain false during retry
@@ -281,10 +280,12 @@ describe('useAccessToken', () => {
       iat: currentTimeInSeconds - 35,
     };
     const expiringToken = `eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.${btoa(JSON.stringify(payload))}.mock-signature`;
-    const error = new Error('Failed to refresh token');
 
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(expiringToken);
-    (refreshAccessTokenAction as jest.Mock).mockRejectedValueOnce(error);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(expiringToken);
+    (refreshAccessTokenAction as Mock).mockResolvedValueOnce({
+      accessToken: undefined,
+      error: 'Failed to refresh token',
+    });
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -301,7 +302,7 @@ describe('useAccessToken', () => {
 
   it('should handle token with an invalid payload format', async () => {
     const badPayloadToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.invalidpayload.mock-signature';
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(badPayloadToken);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(badPayloadToken);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -313,7 +314,7 @@ describe('useAccessToken', () => {
   });
 
   it('should immediately try to update token when token is undefined', async () => {
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(undefined).mockResolvedValueOnce(undefined);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(undefined).mockResolvedValueOnce(undefined);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -327,17 +328,17 @@ describe('useAccessToken', () => {
 
   it('should react to sessionId changes', async () => {
     // Clear any previous mocks to ensure clean state
-    jest.clearAllMocks();
+    vi.clearAllMocks();
 
     const token1 = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJ1c2VyMSIsImV4cCI6OTk5OTk5OTk5OX0.mock-signature-1';
     const token2 = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJ1c2VyMSIsImV4cCI6OTk5OTk5OTk5OX0.mock-signature-2';
 
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(token1).mockResolvedValueOnce(token2);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(token1).mockResolvedValueOnce(token2);
 
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user1' },
       sessionId: 'session1',
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     const { rerender } = render(<TestComponent />);
@@ -346,10 +347,10 @@ describe('useAccessToken', () => {
       expect(getAccessTokenAction).toHaveBeenCalledTimes(1);
     });
 
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user1' }, // Same user ID
       sessionId: 'session2',
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     rerender(<TestComponent />);
@@ -360,8 +361,8 @@ describe('useAccessToken', () => {
   });
 
   it('should prevent concurrent token fetches via updateToken', async () => {
-    jest.clearAllMocks();
-    (getAccessTokenAction as jest.Mock).mockReset();
+    vi.clearAllMocks();
+    (getAccessTokenAction as Mock).mockReset();
 
     const mockToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
@@ -374,7 +375,7 @@ describe('useAccessToken', () => {
       }, 0);
     });
 
-    (getAccessTokenAction as jest.Mock).mockImplementation(() => {
+    (getAccessTokenAction as Mock).mockImplementation(() => {
       fetchCalls++;
       return tokenPromise;
     });
@@ -397,7 +398,7 @@ describe('useAccessToken', () => {
   });
 
   it('should prevent concurrent manual refresh operations', async () => {
-    jest.clearAllMocks();
+    vi.clearAllMocks();
 
     let refreshCalls = 0;
 
@@ -412,12 +413,12 @@ describe('useAccessToken', () => {
       setTimeout(() => resolve(refreshedToken), 10);
     });
 
-    (refreshAccessTokenAction as jest.Mock).mockImplementation(() => {
+    (refreshAccessTokenAction as Mock).mockImplementation(() => {
       refreshCalls++;
-      return refreshPromise;
+      return refreshPromise.then((t) => ({ accessToken: t }));
     });
 
-    (getAccessTokenAction as jest.Mock).mockImplementation(() => {
+    (getAccessTokenAction as Mock).mockImplementation(() => {
       return Promise.resolve(mockToken);
     });
 
@@ -446,7 +447,7 @@ describe('useAccessToken', () => {
 
   it('should handle non-Error objects thrown during token fetch', async () => {
     // Simulate a string error being thrown
-    (getAccessTokenAction as jest.Mock).mockImplementation(() => {
+    (getAccessTokenAction as Mock).mockImplementation(() => {
       throw 'String error message';
     });
 
@@ -461,13 +462,13 @@ describe('useAccessToken', () => {
 
   it('should show loading state immediately on first render when user exists but no token', () => {
     // Mock user with no token initially
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user_123' },
       sessionId: 'session_123',
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
-    (getAccessTokenAction as jest.Mock).mockImplementation(
+    (getAccessTokenAction as Mock).mockImplementation(
       () => new Promise((resolve) => setTimeout(() => resolve('token'), 100)),
     );
 
@@ -482,12 +483,12 @@ describe('useAccessToken', () => {
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJleGlzdGluZyIsInNpZCI6InNlc3Npb24xMjMiLCJleHAiOjk5OTk5OTk5OTl9.existing';
 
     await act(async () => {
-      (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(existingToken);
+      (getAccessTokenAction as Mock).mockResolvedValueOnce(existingToken);
       await tokenStore.getAccessTokenSilently();
     });
 
     // Reset the mock to track new calls
-    (getAccessTokenAction as jest.Mock).mockClear();
+    (getAccessTokenAction as Mock).mockClear();
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -511,8 +512,8 @@ describe('useAccessToken', () => {
       resolveRefreshPromise = resolve;
     });
 
-    (refreshAccessTokenAction as jest.Mock).mockReturnValue(refreshPromise);
-    (getAccessTokenAction as jest.Mock).mockResolvedValue(initialToken);
+    (refreshAccessTokenAction as Mock).mockReturnValue(refreshPromise.then((t) => ({ accessToken: t })));
+    (getAccessTokenAction as Mock).mockResolvedValue(initialToken);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -541,7 +542,7 @@ describe('useAccessToken', () => {
   it('should clear refresh timeout on unmount', async () => {
     const mockToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(mockToken);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(mockToken);
 
     const { getByTestId, unmount } = render(<TestComponent />);
 
@@ -555,7 +556,7 @@ describe('useAccessToken', () => {
   it('should handle edge cases when token data is null', async () => {
     // Create a token that resembles a JWT but with a null payload
     const token = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.bnVsbA==.mock-signature'; // "null" in base64
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(token);
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(token);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -570,7 +571,7 @@ describe('useAccessToken', () => {
   it('should handle errors with string messages instead of Error objects', async () => {
     const error = 'String error message';
     const errorObj = new Error(error);
-    (getAccessTokenAction as jest.Mock).mockRejectedValueOnce(errorObj);
+    (getAccessTokenAction as Mock).mockRejectedValueOnce(errorObj);
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -585,11 +586,9 @@ describe('useAccessToken', () => {
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
     const stringError = 'String error directly'; // Not wrapped in Error object
 
-    (getAccessTokenAction as jest.Mock).mockResolvedValueOnce(initialToken);
-    // Mock refreshAccessTokenAction to reject with a string, not an Error object
-    (refreshAccessTokenAction as jest.Mock).mockImplementation(() => {
-      return Promise.reject(stringError); // Directly reject with string
-    });
+    (getAccessTokenAction as Mock).mockResolvedValueOnce(initialToken);
+    // Mock refreshAccessTokenAction to return an error result (as server actions do)
+    (refreshAccessTokenAction as Mock).mockResolvedValueOnce({ accessToken: undefined, error: stringError });
 
     const { getByTestId } = render(<TestComponent />);
 
@@ -613,12 +612,12 @@ describe('useAccessToken', () => {
     const token =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
 
-    (getAccessTokenAction as jest.Mock).mockResolvedValue(token);
+    (getAccessTokenAction as Mock).mockResolvedValue(token);
 
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user_123' },
       sessionId: 'session_123',
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     const { getByTestId, rerender } = render(<TestComponent />);
@@ -628,10 +627,10 @@ describe('useAccessToken', () => {
       expect(getAccessTokenAction).toHaveBeenCalledTimes(1);
     });
 
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user_456' }, // Different user
       sessionId: 'session_123', // Same session
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     rerender(<TestComponent />);
@@ -642,10 +641,10 @@ describe('useAccessToken', () => {
   });
 
   it('should handle getAccessToken when user is not authenticated', async () => {
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: null,
       sessionId: undefined,
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     const TestComponentWithGetAccessToken = () => {
@@ -670,11 +669,11 @@ describe('useAccessToken', () => {
     const mockToken =
       'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwic2lkIjoic2Vzc2lvbl8xMjMiLCJleHAiOjk5OTk5OTk5OTl9.mock-signature';
 
-    (getAccessTokenAction as jest.Mock).mockResolvedValue(mockToken);
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (getAccessTokenAction as Mock).mockResolvedValue(mockToken);
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user_123' },
       sessionId: 'session_123',
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     const TestComponentWithGetAccessToken = () => {
@@ -696,7 +695,7 @@ describe('useAccessToken', () => {
 
     // Advance timers to trigger getAccessToken call
     act(() => {
-      jest.advanceTimersByTime(100);
+      vi.advanceTimersByTime(100);
     });
 
     await waitFor(() => {
@@ -705,10 +704,10 @@ describe('useAccessToken', () => {
   });
 
   it('should handle manual refresh when user is not authenticated', async () => {
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: null,
       sessionId: undefined,
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     const TestComponentWithRefresh = () => {

package/src/components/useTokenClaims.spec.tsx

@@ -1,27 +1,28 @@
+import type { Mock } from 'vitest';
 import '@testing-library/jest-dom';
 import { render, waitFor } from '@testing-library/react';
 import React from 'react';
 import { useAuth } from './authkit-provider.js';
 
-jest.mock('../actions.js', () => ({
-  getAccessTokenAction: jest.fn(),
-  refreshAccessTokenAction: jest.fn(),
+vi.mock('../actions.js', () => ({
+  getAccessTokenAction: vi.fn(),
+  refreshAccessTokenAction: vi.fn(),
 }));
 
-jest.mock('./authkit-provider.js', () => {
-  const originalModule = jest.requireActual('./authkit-provider.js');
+vi.mock('./authkit-provider.js', async () => {
+  const originalModule = await vi.importActual<typeof import('./authkit-provider.js')>('./authkit-provider.js');
   return {
     ...originalModule,
-    useAuth: jest.fn(),
+    useAuth: vi.fn(),
   };
 });
 
-jest.mock('./useAccessToken.js', () => ({
-  useAccessToken: jest.fn(() => ({ accessToken: undefined })),
+vi.mock('./useAccessToken.js', () => ({
+  useAccessToken: vi.fn(() => ({ accessToken: undefined })),
 }));
 
-jest.mock('jose', () => ({
-  decodeJwt: jest.fn((token: string) => {
+vi.mock('jose', () => ({
+  decodeJwt: vi.fn((token: string) => {
     if (token === 'malformed-token' || token === 'throw-error-token') {
       throw new Error('Invalid JWT');
     }
@@ -42,21 +43,21 @@ import { useTokenClaims } from './useTokenClaims.js';
 
 describe('useTokenClaims', () => {
   beforeEach(() => {
-    jest.clearAllMocks();
-    jest.useFakeTimers();
+    vi.clearAllMocks();
+    vi.useFakeTimers({ shouldAdvanceTime: true });
 
-    (useAuth as jest.Mock).mockImplementation(() => ({
+    (useAuth as Mock).mockImplementation(() => ({
       user: { id: 'user_123' },
       sessionId: 'session_123',
-      refreshAuth: jest.fn().mockResolvedValue({}),
+      refreshAuth: vi.fn().mockResolvedValue({}),
     }));
 
     // Reset useAccessToken mock to default
-    (useAccessToken as jest.Mock).mockReturnValue({ accessToken: undefined });
+    (useAccessToken as Mock).mockReturnValue({ accessToken: undefined });
   });
 
   afterEach(() => {
-    jest.useRealTimers();
+    vi.useRealTimers();
   });
 
   const TokenClaimsTestComponent = () => {
@@ -69,7 +70,7 @@ describe('useTokenClaims', () => {
   };
 
   it('should return empty object when no access token is available', async () => {
-    (useAccessToken as jest.Mock).mockReturnValue({ accessToken: undefined });
+    (useAccessToken as Mock).mockReturnValue({ accessToken: undefined });
 
     const { getByTestId } = render(<TokenClaimsTestComponent />);
 
@@ -101,7 +102,7 @@ describe('useTokenClaims', () => {
     };
     const token = `eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.${btoa(JSON.stringify(payload))}.mock-signature`;
 
-    (useAccessToken as jest.Mock).mockReturnValue({ accessToken: token });
+    (useAccessToken as Mock).mockReturnValue({ accessToken: token });
 
     const { getByTestId } = render(<TokenClaimsTestComponent />);
 
@@ -129,7 +130,7 @@ describe('useTokenClaims', () => {
     };
     const token = `eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.${btoa(JSON.stringify(payload))}.mock-signature`;
 
-    (useAccessToken as jest.Mock).mockReturnValue({ accessToken: token });
+    (useAccessToken as Mock).mockReturnValue({ accessToken: token });
 
     const { getByTestId } = render(<TokenClaimsTestComponent />);
 
@@ -147,7 +148,7 @@ describe('useTokenClaims', () => {
     };
     const token = `eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.${btoa(JSON.stringify(payload))}.mock-signature`;
 
-    (useAccessToken as jest.Mock).mockReturnValue({ accessToken: token });
+    (useAccessToken as Mock).mockReturnValue({ accessToken: token });
 
     const { getByTestId } = render(<TokenClaimsTestComponent />);
 
@@ -175,7 +176,7 @@ describe('useTokenClaims', () => {
     };
     const token = `eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.${btoa(JSON.stringify(payload))}.mock-signature`;
 
-    (useAccessToken as jest.Mock).mockReturnValue({ accessToken: token });
+    (useAccessToken as Mock).mockReturnValue({ accessToken: token });
 
     const { getByTestId } = render(<TokenClaimsTestComponent />);
 
@@ -185,7 +186,7 @@ describe('useTokenClaims', () => {
   });
 
   it('should return empty object when decodeJwt throws an error', async () => {
-    (useAccessToken as jest.Mock).mockReturnValue({ accessToken: 'malformed-token' });
+    (useAccessToken as Mock).mockReturnValue({ accessToken: 'malformed-token' });
 
     const { getByTestId } = render(<TokenClaimsTestComponent />);