@shipfox/client-projects 12.0.2 → 14.0.0

package/src/project-error.ts

@@ -4,6 +4,7 @@ export interface ProjectErrorCopy {
   title: string;
   message: string;
   existingProjectId?: string | undefined;
+  slugConflict?: boolean | undefined;
 }
 
 function isRecord(value: unknown): value is Record<string, unknown> {
@@ -98,6 +99,13 @@ export function projectErrorCopy(error: unknown): ProjectErrorCopy {
       existingProjectId: stringDetail(error, 'existing_project_id'),
     };
   }
+  if (error.code === 'slug-conflict') {
+    return {
+      title: 'Project slug already exists',
+      message: 'Choose another slug and try again.',
+      slugConflict: true,
+    };
+  }
 
   return {
     title: 'Project request failed',

package/src/routes/inputs.test.ts

@@ -1,14 +1,16 @@
 import {projectRouteParams} from './inputs.js';
 
 describe('project route inputs', () => {
-  it('requires both workspace and project ids', () => {
-    expect(projectRouteParams({wid: 'workspace-1', pid: 'project-1'})).toEqual({
-      wid: 'workspace-1',
-      pid: 'project-1',
+  it('requires both workspace and project slugs', () => {
+    expect(projectRouteParams({workspaceSlug: 'workspace-1', projectSlug: 'project-1'})).toEqual({
+      workspaceSlug: 'workspace-1',
+      projectSlug: 'project-1',
     });
-    expect(() => projectRouteParams({wid: 'workspace-1'})).toThrow(
+    expect(() => projectRouteParams({workspaceSlug: 'workspace-1'})).toThrow(
       'Project route is missing required path parameters.',
     );
-    expect(() => projectRouteParams({wid: ['workspace-1'], pid: 'project-1'})).toThrow();
+    expect(() =>
+      projectRouteParams({workspaceSlug: ['workspace-1'], projectSlug: 'project-1'}),
+    ).toThrow();
   });
 });

package/src/routes/inputs.ts

@@ -1,13 +1,14 @@
 export interface ProjectRouteParams {
-  wid: string;
-  pid: string;
+  workspaceSlug: string;
+  projectSlug: string;
 }
 
 export function projectRouteParams(input: Record<string, unknown>): ProjectRouteParams {
-  const wid = stringParam(input.wid);
-  const pid = stringParam(input.pid);
-  if (!wid || !pid) throw new Error('Project route is missing required path parameters.');
-  return {wid, pid};
+  const workspaceSlug = stringParam(input.workspaceSlug);
+  const projectSlug = stringParam(input.projectSlug);
+  if (!workspaceSlug || !projectSlug)
+    throw new Error('Project route is missing required path parameters.');
+  return {workspaceSlug, projectSlug};
 }
 
 function stringParam(value: unknown): string | undefined {

package/src/routes/project-index.tsx

@@ -2,10 +2,10 @@ import {defineRoute} from '@shipfox/client-shell/runtime';
 import {redirect} from '@tanstack/react-router';
 
 export default defineRoute({
-  beforeLoad: ({params}: {params: {wid: string; pid: string}}) => {
+  beforeLoad: ({params}: {params: {workspaceSlug: string; projectSlug: string}}) => {
     throw redirect({
-      to: '/workspaces/$wid/projects/$pid/runs',
-      params: {wid: params.wid, pid: params.pid},
+      to: '/w/$workspaceSlug/p/$projectSlug/runs',
+      params: {workspaceSlug: params.workspaceSlug, projectSlug: params.projectSlug},
     });
   },
 });

package/src/routes/project-settings-index.tsx

@@ -0,0 +1,11 @@
+import {defineRoute} from '@shipfox/client-shell/runtime';
+import {redirect} from '@tanstack/react-router';
+
+export default defineRoute({
+  beforeLoad: ({params}: {params: {workspaceSlug: string; projectSlug: string}}) => {
+    throw redirect({
+      to: '/w/$workspaceSlug/p/$projectSlug/settings/general',
+      params,
+    });
+  },
+});

package/src/routes/project-settings.tsx

@@ -0,0 +1,4 @@
+import {defineRoute} from '@shipfox/client-shell/runtime';
+import {ProjectSettingsPage} from '#pages/project-settings-page.js';
+
+export default defineRoute({component: ProjectSettingsPage});

package/test/pages.tsx

@@ -18,9 +18,9 @@ import {CreateProjectPage} from '#pages/create-project-page.js';
 import {ProjectsHubPage} from '#pages/projects-hub-page.js';
 
 // All test renders that exercise pages requiring `useActiveWorkspace()` mount
-// under `/workspaces/$wid`. The seeded workspace id (see authState) is the wid
-// used in routes.
+// under `/w/$workspaceSlug`. APIs still use the UUID below.
 export const PROJECT_TEST_WID = '11111111-1111-4111-8111-111111111111';
+export const PROJECT_TEST_WSLUG = 'acme';
 
 const authState: AuthState = {
   status: 'authenticated',
@@ -30,7 +30,7 @@ const authState: AuthState = {
     email: 'user@example.com',
     emailVerifiedAt: new Date().toISOString(),
   },
-  workspaces: [{id: PROJECT_TEST_WID, name: 'Acme', membershipId: 'm-1'}],
+  workspaces: [{id: PROJECT_TEST_WID, name: 'Acme', slug: PROJECT_TEST_WSLUG, membershipId: 'm-1'}],
 };
 
 export function jsonResponse(body: unknown, init: ResponseInit = {}) {
@@ -51,36 +51,36 @@ function createTestRouter(path: string, element: ReactElement) {
   });
   const workspaceRoute = createRoute({
     getParentRoute: () => rootRoute,
-    path: '/workspaces/$wid',
-    component: () =>
-      initialPath === `/workspaces/${PROJECT_TEST_WID}` ? element : <ProjectsHubPage />,
+    path: '/w/$workspaceSlug',
+    component: () => (initialPath === `/w/${PROJECT_TEST_WSLUG}` ? element : <ProjectsHubPage />),
   });
   const workspaceNewProjectRoute = createRoute({
     getParentRoute: () => rootRoute,
-    path: '/workspaces/$wid/projects/new',
+    path: '/w/$workspaceSlug/projects/new',
     component: () =>
-      initialPath === `/workspaces/${PROJECT_TEST_WID}/projects/new` ? (
-        element
-      ) : (
-        <CreateProjectPage />
-      ),
+      initialPath === `/w/${PROJECT_TEST_WSLUG}/projects/new` ? element : <CreateProjectPage />,
   });
   const integrationsRoute = createRoute({
     getParentRoute: () => rootRoute,
-    path: '/workspaces/$wid/integrations',
+    path: '/w/$workspaceSlug/integrations',
     component: () => <div>Integrations gallery placeholder</div>,
   });
   const modelProviderSettingsRoute = createRoute({
     getParentRoute: () => rootRoute,
-    path: '/workspaces/$wid/settings/agents',
+    path: '/w/$workspaceSlug/settings/agents',
     component: () => <div>Agent settings placeholder</div>,
   });
+  const projectSettingsGeneralRoute = createRoute({
+    getParentRoute: () => rootRoute,
+    path: '/w/$workspaceSlug/p/$projectSlug/settings/general',
+    component: () => element,
+  });
   const projectDetailRoute = createRoute({
     getParentRoute: () => rootRoute,
-    path: '/workspaces/$wid/projects/$pid',
+    path: '/w/$workspaceSlug/p/$projectSlug',
     component: () => {
-      const params = useParams({strict: false}) as {pid?: string};
-      if (initialPath === `/workspaces/${PROJECT_TEST_WID}/projects/${params.pid}`) {
+      const params = useParams({strict: false}) as {projectSlug?: string};
+      if (initialPath === `/w/${PROJECT_TEST_WSLUG}/p/${params.projectSlug}`) {
         return element;
       }
 
@@ -92,10 +92,10 @@ function createTestRouter(path: string, element: ReactElement) {
   });
   const projectWorkflowsRoute = createRoute({
     getParentRoute: () => rootRoute,
-    path: '/workspaces/$wid/projects/$pid/workflows',
+    path: '/w/$workspaceSlug/p/$projectSlug/workflows',
     component: () => {
-      const params = useParams({strict: false}) as {pid?: string};
-      if (initialPath === `/workspaces/${PROJECT_TEST_WID}/projects/${params.pid}/workflows`) {
+      const params = useParams({strict: false}) as {projectSlug?: string};
+      if (initialPath === `/w/${PROJECT_TEST_WSLUG}/p/${params.projectSlug}/workflows`) {
         return element;
       }
 
@@ -111,14 +111,18 @@ function createTestRouter(path: string, element: ReactElement) {
       workspaceNewProjectRoute,
       integrationsRoute,
       modelProviderSettingsRoute,
+      projectSettingsGeneralRoute,
       projectDetailRoute,
       projectWorkflowsRoute,
     ]),
   });
 }
 
-export function renderProjectPage(path: string, element: ReactElement): RenderResult {
-  const queryClient = new QueryClient({defaultOptions: {queries: {retry: false}}});
+export function renderProjectPage(
+  path: string,
+  element: ReactElement,
+  queryClient = new QueryClient({defaultOptions: {queries: {retry: false}}}),
+): RenderResult {
   const router = createTestRouter(path, element);
   const store = createStore();
   store.set(authStateAtom, authState);