@shipfox/client-auth 12.0.2 → 14.0.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@shipfox/client-auth",
   "license": "MIT",
-  "version": "12.0.2",
+  "version": "14.0.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/ShipfoxHQ/shipfox.git",
@@ -35,13 +35,14 @@
   "dependencies": {
     "@swc/helpers": "^0.5.17",
     "@tanstack/react-form": "^1.32.0",
-    "@shipfox/api-auth-dto": "10.2.0",
-    "@shipfox/api-workspaces-dto": "11.0.0",
+    "@shipfox/api-common-dto": "12.0.0",
+    "@shipfox/api-auth-dto": "12.0.0",
+    "@shipfox/api-workspaces-dto": "12.0.0",
     "@shipfox/client-api": "6.0.1",
-    "@shipfox/client-invitations": "12.0.2",
-    "@shipfox/client-shell": "12.0.2",
-    "@shipfox/client-ui": "6.0.2",
-    "@shipfox/react-ui": "0.3.7"
+    "@shipfox/client-invitations": "14.0.0",
+    "@shipfox/client-shell": "14.0.0",
+    "@shipfox/client-ui": "14.0.0",
+    "@shipfox/react-ui": "0.5.0"
   },
   "peerDependencies": {
     "@tanstack/react-query": "^5.101.0",

package/src/components/auth-guard.tsx

@@ -29,7 +29,7 @@ export function GuestGuard({children}: PropsWithChildren) {
 
   useEffect(() => {
     if (auth.isAuthenticated && target !== undefined) {
-      // Bypass the typed route matcher — `target` is an arbitrary same-origin
+      // Bypass the typed route matcher: `target` is an arbitrary same-origin
       // path resolved at runtime, so we let the URL change drive route resolution.
       router.history.replace(target);
     }

package/src/components/redirect-target.test.ts

@@ -11,10 +11,10 @@ function encodeRepeatedly(value: string, times: number): string {
 describe('sanitizeRedirectPath', () => {
   describe.each([
     ['simple absolute path', '/foo'],
-    ['nested workspace path', '/workspaces/abc/projects/xyz'],
+    ['nested workspace path', '/w/abc/p/xyz'],
     ['path with search', '/foo?bar=1'],
     ['path with hash', '/foo#hash'],
-    ['path with search and hash', '/workspaces/abc?tab=runs#header'],
+    ['path with search and hash', '/w/abc?tab=runs#header'],
   ])('accepts %s', (_label, input) => {
     test('returns the original string', () => {
       const result = sanitizeRedirectPath(input);
@@ -39,7 +39,7 @@ describe('sanitizeRedirectPath', () => {
     ['/auth/reset with token', '/auth/reset?token=x'],
     ['/auth with query bypass', '/auth?token=x'],
     ['/auth with fragment bypass', '/auth#foo'],
-    ['normalized auth path', '/workspaces/../auth/logout'],
+    ['normalized auth path', '/w/../auth/logout'],
   ])('rejects %s', (_label, input) => {
     test('returns undefined', () => {
       const result = sanitizeRedirectPath(input);
@@ -66,7 +66,7 @@ describe('sanitizeRedirectPath', () => {
     });
 
     test('rejects a percent-encoded normalized auth path', () => {
-      const result = sanitizeRedirectPath('/workspaces/%2e%2e/auth/logout');
+      const result = sanitizeRedirectPath('/w/%2e%2e/auth/logout');
 
       expect(result).toBeUndefined();
     });
@@ -106,12 +106,8 @@ describe('sanitizeRedirectPath', () => {
 describe('sanitizeLogoutRedirectPath', () => {
   describe.each([
     ['explicit login fallback', '/auth/login', '/auth/login'],
-    ['same-origin workspace path', '/workspaces/abc', '/workspaces/abc'],
-    [
-      'same-origin path with search and hash',
-      '/workspaces/abc?tab=runs#header',
-      '/workspaces/abc?tab=runs#header',
-    ],
+    ['same-origin workspace path', '/w/abc', '/w/abc'],
+    ['same-origin path with search and hash', '/w/abc?tab=runs#header', '/w/abc?tab=runs#header'],
   ])('accepts %s', (_label, input, expected) => {
     test('returns the safe destination', () => {
       expect(sanitizeLogoutRedirectPath(input)).toBe(expected);
@@ -123,7 +119,7 @@ describe('sanitizeLogoutRedirectPath', () => {
     ['external URL', 'https://attacker.example'],
     ['protocol-relative URL', '//attacker.example'],
     ['auth route other than login', '/auth/reset'],
-    ['login route with a query', '/auth/login?redirect=/workspaces/abc'],
+    ['login route with a query', '/auth/login?redirect=/w/abc'],
     ['raw invitation token', '/invitations/accept?token=sf_i_raw-token'],
     ['raw invitation token with trailing slash', '/invitations/accept/?token=sf_i_raw-token'],
     ['double-encoded auth route', '/%2561uth/login'],

package/src/components/workspace-switcher.stories.tsx

@@ -39,6 +39,7 @@ function workspace(id: string, name: string, index: number): Workspace {
   return {
     id,
     name,
+    slug: name.toLowerCase().replaceAll(' ', '-'),
     membershipId: `10000000-0000-4000-8000-${String(index).padStart(12, '0')}`,
   };
 }
@@ -53,7 +54,7 @@ function WorkspaceSwitcherStory({activeWorkspaceId, workspaces}: WorkspaceSwitch
     const rootRoute = createRootRoute({component: Outlet});
     const workspaceRoute = createRoute({
       getParentRoute: () => rootRoute,
-      path: '/workspaces/$wid',
+      path: '/w/$workspaceSlug',
       component: () => (
         <JotaiProvider store={store}>
           <div className="min-h-screen bg-background-neutral-base p-24">
@@ -72,7 +73,7 @@ function WorkspaceSwitcherStory({activeWorkspaceId, workspaces}: WorkspaceSwitch
 
     return createRouter({
       routeTree: rootRoute.addChildren([workspaceRoute, setupRoute]),
-      history: createMemoryHistory({initialEntries: [`/workspaces/${activeWorkspaceId}`]}),
+      history: createMemoryHistory({initialEntries: ['/w/acme']}),
     });
   }, [activeWorkspaceId, store]);
 

package/src/components/workspace-switcher.tsx

@@ -24,13 +24,15 @@ export function WorkspaceSwitcher({activeWorkspaceId, onSelect}: WorkspaceSwitch
   const setLastWorkspaceId = useSetAtom(lastWorkspaceIdAtom);
 
   const handleSelect = (workspaceId: string) => {
+    const workspace = workspaces.find((candidate) => candidate.id === workspaceId);
+    if (!workspace) return;
     try {
       setLastWorkspaceId(workspaceId);
       if (user?.id) rememberLastWorkspaceId(user.id, workspaceId);
     } catch {
       // localStorage may throw in private browsing or quota-exceeded; persistence is best-effort.
     }
-    navigate({to: '/workspaces/$wid', params: {wid: workspaceId}});
+    navigate({to: '/w/$workspaceSlug', params: {workspaceSlug: workspace.slug}});
     onSelect?.();
   };
 

package/src/core/auth.ts

@@ -30,11 +30,23 @@ export interface ResendEmailVerificationCommand {
 
 export interface WorkspaceCreateCommand {
   name: string;
+  slug: string;
 }
 
+type WorkspaceUpdateBody =
+  | {name: string; slug?: never}
+  | {name?: never; slug: string}
+  | {
+      name: string;
+      slug: string;
+    };
+
+export type WorkspaceUpdateCommand = {workspaceId: string} & WorkspaceUpdateBody;
+
 export interface Workspace {
   id: string;
   name: string;
+  slug: string;
   status: 'active' | 'suspended' | 'deleted';
 }
 

package/src/hooks/api/workspace-auth.test.ts

@@ -1,5 +1,9 @@
 import {configureApiClient} from '@shipfox/client-api';
-import {createWorkspace} from './workspace-auth.js';
+import {
+  checkWorkspaceSlugAvailability,
+  createWorkspace,
+  updateWorkspace,
+} from './workspace-auth.js';
 
 function jsonResponse(body: unknown, init: ResponseInit = {}): Response {
   return new Response(JSON.stringify(body), {
@@ -21,6 +25,7 @@ describe('createWorkspace', () => {
       return jsonResponse({
         id: '33333333-3333-4333-8333-333333333333',
         name: 'Acme',
+        slug: 'acme',
         status: 'active',
         settings: {},
         created_at: '2026-04-27T00:00:00.000Z',
@@ -29,12 +34,70 @@ describe('createWorkspace', () => {
     });
     configureApiClient({fetchImpl});
 
-    const result = await createWorkspace({name: 'Acme'});
+    const result = await createWorkspace({name: 'Acme', slug: 'acme'});
 
     const request = fetchImpl.mock.calls[0]?.[0] as Request;
     expect(result.name).toBe('Acme');
+    expect(result.slug).toBe('acme');
     expect(request.url).toBe('https://api.example.test/workspaces');
     expect(request.method).toBe('POST');
-    expect(requestBody).toEqual({name: 'Acme'});
+    expect(requestBody).toEqual({name: 'Acme', slug: 'acme'});
+  });
+});
+
+describe('updateWorkspace', () => {
+  beforeEach(() => {
+    configureApiClient({baseUrl: 'https://api.example.test', fetchImpl: undefined});
+  });
+
+  test('patches the workspace body', async () => {
+    let requestBody: unknown;
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      requestBody = await (input as Request).clone().json();
+      return jsonResponse({
+        id: '33333333-3333-4333-8333-333333333333',
+        name: 'Acme Labs',
+        slug: 'acme-labs',
+        status: 'active',
+        settings: {},
+        created_at: '2026-04-27T00:00:00.000Z',
+        updated_at: '2026-04-27T00:00:00.000Z',
+      });
+    });
+    configureApiClient({fetchImpl});
+
+    const result = await updateWorkspace({
+      workspaceId: '33333333-3333-4333-8333-333333333333',
+      name: 'Acme Labs',
+      slug: 'acme-labs',
+    });
+
+    const request = fetchImpl.mock.calls[0]?.[0] as Request;
+    expect(result.slug).toBe('acme-labs');
+    expect(request.url).toBe(
+      'https://api.example.test/workspaces/33333333-3333-4333-8333-333333333333',
+    );
+    expect(request.method).toBe('PATCH');
+    expect(requestBody).toEqual({name: 'Acme Labs', slug: 'acme-labs'});
+  });
+});
+
+describe('checkWorkspaceSlugAvailability', () => {
+  beforeEach(() => {
+    configureApiClient({baseUrl: 'https://api.example.test', fetchImpl: undefined});
+  });
+
+  test('encodes the slug and returns the server result', async () => {
+    const fetchImpl = vi.fn().mockResolvedValue(jsonResponse({available: true}));
+    configureApiClient({fetchImpl});
+
+    const slug = 'acme/labs?region=eu';
+    await expect(checkWorkspaceSlugAvailability(slug)).resolves.toBe(true);
+
+    const request = fetchImpl.mock.calls[0]?.[0] as Request;
+    const url = new URL(request.url);
+    expect(url.pathname).toBe('/workspaces/slug-availability');
+    expect(url.search).toBe(`?slug=${encodeURIComponent(slug)}`);
+    expect(request.method).toBe('GET');
   });
 });

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

@@ -1,23 +1,47 @@
-import {workspaceResponseSchema} from '@shipfox/api-workspaces-dto';
+import {
+  updateWorkspaceBodySchema,
+  workspaceResponseSchema,
+  workspaceSlugAvailabilityResponseSchema,
+} from '@shipfox/api-workspaces-dto';
 import {checkedApiRequest} from '@shipfox/client-api';
 import {
   listUserWorkspaces,
   userWorkspacesQueryKey,
   userWorkspacesQueryOptions,
 } from '@shipfox/client-shell/runtime';
-import {useMutation} from '@tanstack/react-query';
-import type {WorkspaceCreateCommand} from '#core/auth.js';
+import {useMutation, useQueryClient} from '@tanstack/react-query';
+import {useSetAtom} from 'jotai';
+import type {WorkspaceCreateCommand, WorkspaceUpdateCommand} from '#core/auth.js';
+import {authStateAtom} from '#state/auth.js';
 import {useRefreshAuth} from './refresh-auth.js';
 import {toWorkspace} from './workspace-mapper.js';
 
 export async function createWorkspace(command: WorkspaceCreateCommand) {
   const response = await checkedApiRequest(workspaceResponseSchema, '/workspaces', {
     method: 'POST',
-    body: {name: command.name},
+    body: {name: command.name, slug: command.slug},
   });
   return toWorkspace(response);
 }
 
+export async function updateWorkspace(command: WorkspaceUpdateCommand) {
+  const body = updateWorkspaceBodySchema.parse({name: command.name, slug: command.slug});
+  const response = await checkedApiRequest(
+    workspaceResponseSchema,
+    `/workspaces/${command.workspaceId}`,
+    {method: 'PATCH', body},
+  );
+  return toWorkspace(response);
+}
+
+export async function checkWorkspaceSlugAvailability(slug: string): Promise<boolean> {
+  const response = await checkedApiRequest(
+    workspaceSlugAvailabilityResponseSchema,
+    `/workspaces/slug-availability?slug=${encodeURIComponent(slug)}`,
+  );
+  return response.available;
+}
+
 export {listUserWorkspaces, userWorkspacesQueryKey, userWorkspacesQueryOptions};
 
 export function useCreateWorkspaceAuth() {
@@ -33,3 +57,26 @@ export function useCreateWorkspaceAuth() {
     },
   });
 }
+
+export function useUpdateWorkspaceMutation() {
+  const queryClient = useQueryClient();
+  const setAuthState = useSetAtom(authStateAtom);
+
+  return useMutation({
+    mutationFn: updateWorkspace,
+    onSuccess: async (workspace) => {
+      setAuthState((previous) => {
+        if (previous.status !== 'authenticated') return previous;
+        return {
+          ...previous,
+          workspaces: (previous.workspaces ?? []).map((candidate) =>
+            candidate.id === workspace.id
+              ? {...candidate, name: workspace.name, slug: workspace.slug, status: workspace.status}
+              : candidate,
+          ),
+        };
+      });
+      await queryClient.invalidateQueries({queryKey: userWorkspacesQueryKey});
+    },
+  });
+}

package/src/hooks/api/workspace-mapper.test.ts

@@ -10,12 +10,13 @@ describe('toWorkspace', () => {
     const dto: WorkspaceResponseDto = {
       id: '11111111-1111-4111-8111-111111111111',
       name: 'Acme',
+      slug: 'acme',
       status,
       settings: {},
       created_at: '2026-04-27T00:00:00.000Z',
       updated_at: '2026-04-27T00:00:00.000Z',
     };
 
-    expect(toWorkspace(dto)).toEqual({id: dto.id, name: dto.name, status});
+    expect(toWorkspace(dto)).toEqual({id: dto.id, name: dto.name, slug: dto.slug, status});
   });
 });

package/src/hooks/api/workspace-mapper.ts

@@ -2,5 +2,5 @@ import type {WorkspaceResponseDto} from '@shipfox/api-workspaces-dto';
 import type {Workspace} from '#core/auth.js';
 
 export function toWorkspace(dto: WorkspaceResponseDto): Workspace {
-  return {id: dto.id, name: dto.name, status: dto.status};
+  return {id: dto.id, name: dto.name, slug: dto.slug, status: dto.status};
 }

package/src/hooks/index.ts

@@ -7,7 +7,12 @@ export {
 export {useRefreshAuth} from './api/refresh-auth.js';
 export {useSignupAuth} from './api/signup-auth.js';
 export {useResendEmailVerificationAuth, useVerifyEmailAuth} from './api/verify-email-auth.js';
-export {useCreateWorkspaceAuth} from './api/workspace-auth.js';
+export {
+  checkWorkspaceSlugAvailability,
+  updateWorkspace,
+  useCreateWorkspaceAuth,
+  useUpdateWorkspaceMutation,
+} from './api/workspace-auth.js';
 export {useActiveWorkspace, useMaybeActiveWorkspace} from './use-active-workspace.js';
 export type {AuthStateValue} from './use-auth-state.js';
 export {useAuthState} from './use-auth-state.js';

package/src/pages/form-errors.test.ts

@@ -106,7 +106,17 @@ describe('passwordResetConfirmErrorToFormError', () => {
 });
 
 describe('workspaceOnboardingErrorToFormError', () => {
-  test('routes any error to a form-level alert', () => {
+  test('routes slug conflicts to the slug field', () => {
+    const result = workspaceOnboardingErrorToFormError(apiError('slug-conflict', 409));
+
+    expect(result).toEqual({
+      kind: 'field',
+      field: 'slug',
+      message: 'That workspace slug is already taken.',
+    });
+  });
+
+  test('routes other errors to a form-level alert', () => {
     const result = workspaceOnboardingErrorToFormError(apiError('conflict', 409));
 
     expect(result).toEqual({kind: 'form', message: 'conflict server message'});

package/src/pages/form-errors.ts

@@ -40,6 +40,11 @@ export function passwordResetConfirmErrorToFormError(
   return {kind: 'form', message: authErrorMessage(error)};
 }
 
-export function workspaceOnboardingErrorToFormError(error: unknown): FormErrorMapping<'name'> {
+export function workspaceOnboardingErrorToFormError(
+  error: unknown,
+): FormErrorMapping<'name' | 'slug'> {
+  if (apiCode(error) === 'slug-conflict') {
+    return {kind: 'field', field: 'slug', message: 'That workspace slug is already taken.'};
+  }
   return {kind: 'form', message: authErrorMessage(error)};
 }

package/src/pages/logout-page.test.tsx

@@ -27,7 +27,7 @@ function renderLogoutPage(path: string) {
   });
   const workspaceRoute = createRoute({
     getParentRoute: () => rootRoute,
-    path: '/workspaces/$wid',
+    path: '/w/$workspaceSlug',
     component: () => <h1>Workspace destination</h1>,
   });
   const router = createRouter({
@@ -56,7 +56,7 @@ describe('LogoutPage', () => {
     const fetchImpl = vi.fn().mockResolvedValue(new Response(null, {status: 204}));
     configureApiClient({fetchImpl});
 
-    renderLogoutPage('/auth/logout?redirect=%2Fworkspaces%2Facme');
+    renderLogoutPage('/auth/logout?redirect=%2Fw%2Facme');
 
     expect(await screen.findByRole('heading', {name: 'Workspace destination'})).toBeVisible();
     const request = fetchImpl.mock.calls[0]?.[0] as Request;

package/src/pages/signup-page.test.tsx

@@ -158,6 +158,84 @@ describe('SignupPage', () => {
     );
   });
 
+  test('keeps invitation signup recoverable when the post-signup refresh fails', async () => {
+    const invitationToken = 'invite-token';
+    const redirect = `/invitations/accept?token=${encodeURIComponent(invitationToken)}`;
+    const user = pageUserFactory.build({email: 'invitee@example.com', name: 'Invitee'});
+    const workspaceId = '11111111-1111-4111-8111-111111111111';
+    const session = {token: 'access-token', user};
+    let signupCompleted = false;
+    let postSignupRefreshFailures = 0;
+    const fetchImpl = vi.fn().mockImplementation((input: RequestInfo | URL) => {
+      const url = requestUrl(input);
+      if (url === 'https://api.example.test/auth/me') {
+        return jsonResponse({code: 'unauthorized', message: 'Unauthorized'}, {status: 401});
+      }
+      if (url.includes('/invitations/preview?')) {
+        return jsonResponse({
+          status: 'pending',
+          workspace_id: workspaceId,
+          workspace_name: 'Invite Workspace',
+          email: user.email,
+          invited_by_display: 'owner@example.com',
+          expires_at: '2026-05-18T00:00:00.000Z',
+        });
+      }
+      if (url === 'https://api.example.test/auth/signup') {
+        signupCompleted = true;
+        return jsonResponse(
+          {
+            user,
+            membership: {
+              id: '22222222-2222-4222-8222-222222222222',
+              user_id: user.id,
+              workspace_id: workspaceId,
+            },
+          },
+          {status: 201},
+        );
+      }
+      if (url === 'https://api.example.test/auth/refresh') {
+        if (signupCompleted && postSignupRefreshFailures < 2) {
+          postSignupRefreshFailures += 1;
+          return jsonResponse({code: 'server-error', message: 'Refresh failed'}, {status: 500});
+        }
+        return jsonResponse(session);
+      }
+      if (url === 'https://api.example.test/workspaces') {
+        return jsonResponse({
+          memberships: [
+            {
+              id: '33333333-3333-4333-8333-333333333333',
+              user_id: user.id,
+              workspace_id: workspaceId,
+              created_at: '2026-05-01T00:00:00.000Z',
+              updated_at: '2026-05-01T00:00:00.000Z',
+              workspace_name: 'Invite Workspace',
+              workspace_slug: 'invite-workspace',
+              workspace_status: 'active',
+            },
+          ],
+        });
+      }
+      throw new Error(`Unexpected request: ${url}`);
+    });
+    configureApiClient({fetchImpl});
+
+    renderAuthPage(`/auth/signup?redirect=${encodeURIComponent(redirect)}`, <SignupPage />);
+    await screen.findByRole('heading', {name: 'Join Invite Workspace'});
+    fireEvent.change(screen.getByLabelText('Name'), {target: {value: user.name}});
+    fireEvent.change(screen.getByLabelText('Email'), {target: {value: user.email}});
+    fireEvent.change(screen.getByLabelText('Password'), {target: {value: 'long secure password'}});
+    fireEvent.click(screen.getByRole('button', {name: 'Create account'}));
+
+    expect(await screen.findByRole('button', {name: 'Retry sign-in'})).toBeInTheDocument();
+    expect(screen.getByRole('heading', {name: 'Join Invite Workspace'})).toBeInTheDocument();
+
+    fireEvent.click(screen.getByRole('button', {name: 'Retry sign-in'}));
+    expect(await screen.findByRole('heading', {name: 'Authenticated home'})).toBeInTheDocument();
+  });
+
   test('surfaces duplicate-email errors', async () => {
     const fetchImpl = vi
       .fn()