@shipfox/client-auth 6.0.1 → 6.0.2

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@shipfox/client-auth",
   "license": "MIT",
-  "version": "6.0.1",
+  "version": "6.0.2",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/ShipfoxHQ/shipfox.git",
@@ -31,13 +31,13 @@
   "dependencies": {
     "@swc/helpers": "^0.5.17",
     "@tanstack/react-form": "^1.32.0",
-    "@shipfox/api-auth-dto": "9.0.1",
-    "@shipfox/api-workspaces-dto": "9.0.1",
+    "@shipfox/api-auth-dto": "9.0.2",
     "@shipfox/client-api": "6.0.1",
-    "@shipfox/client-invitations": "6.0.1",
-    "@shipfox/client-shell": "6.0.1",
-    "@shipfox/client-ui": "6.0.1",
-    "@shipfox/react-ui": "0.3.6"
+    "@shipfox/client-invitations": "6.0.2",
+    "@shipfox/client-shell": "6.0.2",
+    "@shipfox/api-workspaces-dto": "9.0.2",
+    "@shipfox/client-ui": "6.0.2",
+    "@shipfox/react-ui": "0.3.7"
   },
   "peerDependencies": {
     "@tanstack/react-query": "^5.101.0",

package/src/components/auth-provider.test.tsx

@@ -1,5 +1,5 @@
-import {configureApiClient} from '@shipfox/client-api';
-import {QueryClient, useQuery} from '@tanstack/react-query';
+import {ApiError, configureApiClient} from '@shipfox/client-api';
+import {QueryClient, useQuery, useQueryClient} from '@tanstack/react-query';
 import {render, screen, waitFor} from '@testing-library/react';
 import {useEffect, useRef} from 'react';
 import {useLoginAuth} from '#hooks/api/login-auth.js';
@@ -45,6 +45,8 @@ function StatusProbe() {
 
 function PrivateDataProbe() {
   const auth = useAuthState();
+  const queryClient = useQueryClient();
+  const seeded = useRef(false);
   const privateData = useQuery({
     queryKey: ['private-data'],
     queryFn: () => new Promise<string>(() => undefined),
@@ -52,6 +54,12 @@ function PrivateDataProbe() {
   });
   const login = useLoginAuth();
 
+  useEffect(() => {
+    if (!auth.isAuthenticated || seeded.current) return;
+    seeded.current = true;
+    queryClient.setQueryData(['private-data'], 'User A private data');
+  }, [auth.isAuthenticated, queryClient]);
+
   return (
     <div>
       <span data-testid="private-data">{privateData.data ?? 'loading'}</span>
@@ -114,6 +122,24 @@ describe('AuthProvider', () => {
     expect(queryClient.getQueryData(['private-data'])).toBeUndefined();
   });
 
+  test('clears a hydrated private cache before accepting the first principal', async () => {
+    const queryClient = new QueryClient();
+    const fetchImpl = vi
+      .fn()
+      .mockResolvedValue(jsonResponse({token: 'other-token', user: otherUser}));
+    configureApiClient({fetchImpl});
+    queryClient.setQueryData(['private-data'], 'previous principal private data');
+
+    render(
+      <AuthProvider queryClient={queryClient}>
+        <StatusProbe />
+      </AuthProvider>,
+    );
+
+    await waitFor(() => expect(screen.getByTestId('status')).toHaveTextContent('authenticated'));
+    expect(queryClient.getQueryData(['private-data'])).toBeUndefined();
+  });
+
   test('keeps the current session when refresh fails with a server error', async () => {
     const fetchImpl = vi
       .fn()
@@ -156,21 +182,30 @@ describe('AuthProvider', () => {
       .fn()
       .mockImplementation(() => Promise.resolve(jsonResponse({token: 'access-token', user})));
     configureApiClient({fetchImpl});
-    queryClient.setQueryData(['private-data'], 'current user private data');
     const onDone = vi.fn();
+    const onReady = vi.fn();
 
     function RefreshAfterBootProbe() {
       const auth = useAuthState();
       const refresh = useRefreshAuth();
-      const didRefresh = useRef(false);
+      const queryClient = useQueryClient();
+      const didSeed = useRef(false);
 
       useEffect(() => {
-        if (auth.status !== 'authenticated' || didRefresh.current) return;
-        didRefresh.current = true;
-        void refresh().then(onDone);
-      }, [auth.status, refresh]);
+        if (auth.status !== 'authenticated' || didSeed.current) return;
+        didSeed.current = true;
+        queryClient.setQueryData(['private-data'], 'current user private data');
+        onReady();
+      }, [auth.status, queryClient]);
 
-      return <StatusProbe />;
+      return (
+        <>
+          <StatusProbe />
+          <button type="button" onClick={() => void refresh().then(onDone)}>
+            Refresh
+          </button>
+        </>
+      );
     }
 
     render(
@@ -179,6 +214,9 @@ describe('AuthProvider', () => {
       </AuthProvider>,
     );
 
+    await waitFor(() => expect(onReady).toHaveBeenCalledTimes(1));
+    cancelQueries.mockClear();
+    screen.getByRole('button', {name: 'Refresh'}).click();
     await waitFor(() => expect(onDone).toHaveBeenCalledTimes(1));
     expect(cancelQueries).not.toHaveBeenCalled();
     expect(queryClient.getQueryData(['private-data'])).toBe('current user private data');
@@ -211,6 +249,80 @@ describe('AuthProvider', () => {
     expect(fetchImpl).toHaveBeenCalledTimes(2);
   });
 
+  test('does not restore a stale refresh result after a principal transition', async () => {
+    let refreshRequestCount = 0;
+    let workspaceRequestCount = 0;
+    const initialWorkspaceRefresh = new Promise<Response>(() => undefined);
+    const onFreshRefresh = vi.fn();
+    const onRefreshError = vi.fn();
+    const fetchImpl = vi.fn((input: RequestInfo | URL) => {
+      const url = (input as Request).url;
+      if (url.endsWith('/auth/refresh')) {
+        refreshRequestCount += 1;
+        return refreshRequestCount === 1
+          ? Promise.resolve(jsonResponse({token: 'access-token', user}))
+          : Promise.resolve(jsonResponse({token: 'other-token-2', user: otherUser}));
+      }
+      if (url.endsWith('/auth/login'))
+        return Promise.resolve(jsonResponse({token: 'other-token', user: otherUser}));
+      if (url.endsWith('/workspaces')) {
+        workspaceRequestCount += 1;
+        return workspaceRequestCount === 1
+          ? initialWorkspaceRefresh
+          : Promise.resolve(jsonResponse({memberships: []}));
+      }
+      return Promise.resolve(jsonResponse({token: 'access-token', user}));
+    });
+    configureApiClient({fetchImpl});
+
+    function RefreshAndLoginProbe() {
+      const auth = useAuthState();
+      const login = useLoginAuth();
+      const refresh = useRefreshAuth();
+
+      useEffect(() => {
+        void refresh().catch(onRefreshError);
+      }, [refresh]);
+
+      return (
+        <div>
+          <span data-testid="email">{auth.user?.email ?? 'none'}</span>
+          <button
+            type="button"
+            onClick={() =>
+              void login.mutateAsync({email: 'other@example.com', password: 'password'})
+            }
+          >
+            Login as other user
+          </button>
+          <button type="button" onClick={() => void refresh().then(onFreshRefresh)}>
+            Refresh current principal
+          </button>
+        </div>
+      );
+    }
+
+    render(
+      <AuthProvider>
+        <RefreshAndLoginProbe />
+      </AuthProvider>,
+    );
+
+    await waitFor(() => expect(workspaceRequestCount).toBe(1));
+    screen.getByRole('button', {name: 'Login as other user'}).click();
+    await waitFor(() => expect(screen.getByTestId('email')).toHaveTextContent('other@example.com'));
+    await waitFor(() => expect(onRefreshError).toHaveBeenCalledTimes(1));
+    const refreshError = onRefreshError.mock.calls[0]?.[0];
+    expect(refreshError).toBeInstanceOf(ApiError);
+    expect(refreshError).toMatchObject({code: 'unauthorized', status: 401});
+
+    screen.getByRole('button', {name: 'Refresh current principal'}).click();
+    await waitFor(() => expect(onFreshRefresh).toHaveBeenCalledTimes(1));
+    expect(refreshRequestCount).toBe(2);
+
+    expect(screen.getByTestId('email')).toHaveTextContent('other@example.com');
+  });
+
   test('logout clears local state even when the API call fails', async () => {
     const queryClient = new QueryClient();
     const cancelQueries = vi.spyOn(queryClient, 'cancelQueries');
@@ -219,8 +331,16 @@ describe('AuthProvider', () => {
       .mockResolvedValueOnce(jsonResponse({token: 'access-token', user}))
       .mockRejectedValueOnce(new Error('offline'));
     configureApiClient({fetchImpl});
-    queryClient.setQueryData(['private-data'], 'private data');
     const onQueryAbort = vi.fn();
+
+    render(
+      <AuthProvider queryClient={queryClient}>
+        <StatusProbe />
+      </AuthProvider>,
+    );
+
+    await waitFor(() => expect(screen.getByTestId('status')).toHaveTextContent('authenticated'));
+    queryClient.setQueryData(['private-data'], 'private data');
     void queryClient
       .fetchQuery({
         queryKey: ['in-flight-private-data'],
@@ -233,14 +353,7 @@ describe('AuthProvider', () => {
           }),
       })
       .catch(() => undefined);
-
-    render(
-      <AuthProvider queryClient={queryClient}>
-        <StatusProbe />
-      </AuthProvider>,
-    );
-
-    await waitFor(() => expect(screen.getByTestId('status')).toHaveTextContent('authenticated'));
+    cancelQueries.mockClear();
     screen.getByRole('button', {name: 'Logout'}).click();
 
     await waitFor(() => expect(screen.getByTestId('status')).toHaveTextContent('guest'));
@@ -312,7 +425,6 @@ describe('AuthProvider', () => {
       return Promise.resolve(jsonResponse({token: 'access-token', user}));
     });
     configureApiClient({fetchImpl});
-    queryClient.setQueryData(['private-data'], 'User A private data');
 
     render(
       <AuthProvider queryClient={queryClient}>
@@ -323,6 +435,7 @@ describe('AuthProvider', () => {
     await waitFor(() =>
       expect(screen.getByTestId('private-data')).toHaveTextContent('User A private data'),
     );
+    cancelQueries.mockClear();
     screen.getByRole('button', {name: 'Switch user'}).click();
 
     await waitFor(() =>

package/src/components/workspace-switcher.tsx

@@ -11,7 +11,7 @@ import {Icon} from '@shipfox/react-ui/icon';
 import {useNavigate} from '@tanstack/react-router';
 import {useSetAtom} from 'jotai';
 import {useAuthState} from '#hooks/use-auth-state.js';
-import {lastWorkspaceIdAtom} from '#state/last-workspace.js';
+import {lastWorkspaceIdAtom, rememberLastWorkspaceId} from '#state/last-workspace.js';
 
 export interface WorkspaceSwitcherProps {
   activeWorkspaceId: string | undefined;
@@ -19,13 +19,14 @@ export interface WorkspaceSwitcherProps {
 }
 
 export function WorkspaceSwitcher({activeWorkspaceId, onSelect}: WorkspaceSwitcherProps) {
-  const {workspaces} = useAuthState();
+  const {user, workspaces} = useAuthState();
   const navigate = useNavigate();
   const setLastWorkspaceId = useSetAtom(lastWorkspaceIdAtom);
 
   const handleSelect = (workspaceId: string) => {
     try {
       setLastWorkspaceId(workspaceId);
+      if (user?.id) rememberLastWorkspaceId(user.id, workspaceId);
     } catch {
       // localStorage may throw in private browsing or quota-exceeded; persistence is best-effort.
     }

package/src/hooks/api/login-auth.ts

@@ -18,6 +18,6 @@ export function useLoginAuth() {
 
   return useMutation({
     mutationFn: loginAuth,
-    onSuccess: enterAuthenticated,
+    onSuccess: (session) => enterAuthenticated(session),
   });
 }

package/src/hooks/api/logout-auth.ts

@@ -15,6 +15,6 @@ export function useLogoutAuth() {
 
   return useMutation({
     mutationFn: logoutAuth,
-    onSettled: enterGuest,
+    onSettled: () => enterGuest(),
   });
 }

package/src/hooks/api/password-reset-auth.ts

@@ -33,6 +33,6 @@ export function useConfirmPasswordResetAuth() {
 
   return useMutation({
     mutationFn: confirmPasswordReset,
-    onSuccess: enterAuthenticated,
+    onSuccess: (session) => enterAuthenticated(session),
   });
 }

package/src/hooks/api/verify-email-auth.ts

@@ -47,6 +47,6 @@ export function useVerifyEmailAuth() {
 
   return useMutation({
     mutationFn: verifyEmailAuth,
-    onSuccess: enterAuthenticated,
+    onSuccess: (session) => enterAuthenticated(session),
   });
 }

package/src/pages/workspace-onboarding-page.tsx

@@ -12,7 +12,8 @@ import {useNavigate} from '@tanstack/react-router';
 import {useSetAtom} from 'jotai';
 import {useState} from 'react';
 import {useCreateWorkspaceAuth} from '#hooks/api/workspace-auth.js';
-import {lastWorkspaceIdAtom} from '#state/last-workspace.js';
+import {useAuthState} from '#hooks/use-auth-state.js';
+import {lastWorkspaceIdAtom, rememberLastWorkspaceId} from '#state/last-workspace.js';
 import {workspaceOnboardingErrorToFormError} from './form-errors.js';
 
 const previewMetrics = [
@@ -34,6 +35,7 @@ const previewBars = [
 
 export function WorkspaceOnboardingPage() {
   const createWorkspace = useCreateWorkspaceAuth();
+  const {user} = useAuthState();
   const navigate = useNavigate();
   const setLastWorkspaceId = useSetAtom(lastWorkspaceIdAtom);
   const [formError, setFormError] = useState<string | undefined>();
@@ -50,6 +52,7 @@ export function WorkspaceOnboardingPage() {
         // future visits to `/` land on it.
         try {
           setLastWorkspaceId(created.id);
+          if (user?.id) rememberLastWorkspaceId(user.id, created.id);
         } catch {
           // localStorage may throw in private browsing or quota-exceeded.
         }

package/src/routes/index.tsx

@@ -10,9 +10,11 @@ export default defineRoute({
     if (!auth.isAuthenticated) throw redirect({to: '/auth/login'});
     const [first, ...rest] = auth.workspaces;
     if (!first) throw redirect({to: '/setup/workspaces/new'});
-    const target =
-      [first, ...rest].find((workspace) => workspace.id === getLastWorkspaceId()) ?? first;
-    throw redirect({to: '/workspaces/$wid', params: {wid: target.id}});
+    const principalId = auth.user?.id;
+    const target = principalId
+      ? [first, ...rest].find((workspace) => workspace.id === getLastWorkspaceId(principalId))
+      : undefined;
+    throw redirect({to: '/workspaces/$wid', params: {wid: (target ?? first).id}});
   },
   component: FullPageLoader,
 });

package/src/state/last-workspace.test.ts

@@ -5,7 +5,7 @@ import {
   rememberLastWorkspaceId,
 } from './last-workspace.js';
 
-describe('lastWorkspaceIdAtom', () => {
+describe('last workspace state', () => {
   beforeEach(() => {
     window.localStorage.clear();
   });
@@ -14,21 +14,13 @@ describe('lastWorkspaceIdAtom', () => {
     window.localStorage.clear();
   });
 
-  test('initial value is undefined when storage is empty', () => {
-    const store = createStore();
-
-    expect(store.get(lastWorkspaceIdAtom)).toBeUndefined();
-  });
-
-  test('write persists to localStorage and round-trips through the atom', () => {
+  test('atom stores current UI selection without unscoped persistence', () => {
     const store = createStore();
 
     store.set(lastWorkspaceIdAtom, 'workspace-1');
 
-    expect(JSON.parse(window.localStorage.getItem('shipfox.lastWorkspaceId') ?? 'null')).toBe(
-      'workspace-1',
-    );
     expect(store.get(lastWorkspaceIdAtom)).toBe('workspace-1');
+    expect(window.localStorage.getItem('shipfox.lastWorkspaceId')).toBeNull();
   });
 
   test('subscribers receive updates when the atom is set', () => {
@@ -45,34 +37,35 @@ describe('lastWorkspaceIdAtom', () => {
     unsubscribe();
   });
 
-  test('syncs the atom when another tab updates last workspace storage', () => {
-    const store = createStore();
-    const unsubscribe = store.sub(lastWorkspaceIdAtom, () => undefined);
-    window.localStorage.setItem('shipfox.lastWorkspaceId', JSON.stringify('workspace-2'));
-
-    window.dispatchEvent(
-      new StorageEvent('storage', {
-        key: 'shipfox.lastWorkspaceId',
-        storageArea: window.localStorage,
-      }),
-    );
+  test('write persists to localStorage and can be read for the same principal', () => {
+    rememberLastWorkspaceId('principal-1', 'workspace-1');
 
-    expect(store.get(lastWorkspaceIdAtom)).toBe('workspace-2');
-    unsubscribe();
+    expect(
+      JSON.parse(
+        window.localStorage.getItem('shipfox.lastWorkspaceId.principal.principal-1') ?? 'null',
+      ),
+    ).toBe('workspace-1');
+    expect(getLastWorkspaceId('principal-1')).toBe('workspace-1');
   });
 
   test('rememberLastWorkspaceId persists a root redirect target', () => {
-    rememberLastWorkspaceId('workspace-1');
+    rememberLastWorkspaceId('principal-1', 'workspace-1');
 
-    const result = getLastWorkspaceId();
+    const result = getLastWorkspaceId('principal-1');
 
     expect(result).toBe('workspace-1');
   });
 
+  test("does not reuse a different principal's root redirect target", () => {
+    rememberLastWorkspaceId('principal-a', 'workspace-a');
+
+    expect(getLastWorkspaceId('principal-b')).toBeUndefined();
+  });
+
   test('getLastWorkspaceId ignores malformed storage', () => {
-    window.localStorage.setItem('shipfox.lastWorkspaceId', '{');
+    window.localStorage.setItem('shipfox.lastWorkspaceId.principal.principal-1', '{');
 
-    const result = getLastWorkspaceId();
+    const result = getLastWorkspaceId('principal-1');
 
     expect(result).toBeUndefined();
   });