@shipfox/client-projects 5.0.0 → 6.0.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@shipfox/client-projects",
   "license": "MIT",
-  "version": "5.0.0",
+  "version": "6.0.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/ShipfoxHQ/shipfox.git",
@@ -10,10 +10,6 @@
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
-  "imports": {
-    "#*": "./dist/*",
-    "#test/*": "./test/*"
-  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -31,16 +27,16 @@
   "dependencies": {
     "@swc/helpers": "^0.5.17",
     "@tanstack/react-form": "^1.32.0",
-    "@shipfox/api-definitions-dto": "6.0.0",
-    "@shipfox/api-integration-core-dto": "8.0.0",
-    "@shipfox/api-projects-dto": "8.0.0",
-    "@shipfox/client-agent": "5.0.0",
-    "@shipfox/client-api": "4.0.0",
-    "@shipfox/client-auth": "5.0.0",
-    "@shipfox/client-integrations": "5.0.0",
-    "@shipfox/client-shell": "5.0.0",
-    "@shipfox/client-ui": "4.0.0",
-    "@shipfox/react-ui": "0.3.5"
+    "@shipfox/api-definitions-dto": "9.0.1",
+    "@shipfox/api-projects-dto": "9.0.1",
+    "@shipfox/client-api": "6.0.1",
+    "@shipfox/client-agent": "6.0.1",
+    "@shipfox/api-integration-core-dto": "9.0.1",
+    "@shipfox/client-auth": "6.0.1",
+    "@shipfox/client-integrations": "6.0.1",
+    "@shipfox/client-shell": "6.0.1",
+    "@shipfox/client-ui": "6.0.1",
+    "@shipfox/react-ui": "0.3.6"
   },
   "peerDependencies": {
     "@tanstack/react-query": "^5.101.0",
@@ -49,6 +45,9 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
+  "imports": {
+    "#*": "./dist/*"
+  },
   "scripts": {
     "build": "shipfox-swc",
     "check": "shipfox-biome-check",

package/src/chrome.tsx

@@ -1,12 +1,17 @@
-import {useActiveWorkspace} from '@shipfox/client-shell/runtime';
-import {Outlet, useNavigate, useParams} from '@tanstack/react-router';
+import {
+  parseWorkspaceProjectParams,
+  useActiveWorkspace,
+  useRouteParams,
+} from '@shipfox/client-shell/runtime';
+import {Outlet, useNavigate} from '@tanstack/react-router';
 import {useEffect} from 'react';
 import {ProjectCrumb} from '#components/project-crumb.js';
 import {useProjectQuery} from '#hooks/api/projects.js';
+import {projectRouteParams} from './routes/inputs.js';
 
 export function ProjectBreadcrumb() {
   const workspace = useActiveWorkspace();
-  const {pid} = useParams({strict: false}) as {pid?: string};
+  const {pid} = useRouteParams(parseWorkspaceProjectParams);
   const project = useProjectQuery(pid).data;
   return (
     <ProjectCrumb workspaceId={workspace.id} projectId={project?.id} projectName={project?.name} />
@@ -14,13 +19,13 @@ export function ProjectBreadcrumb() {
 }
 
 export function ProjectLayoutGuard() {
-  const {wid, pid} = useParams({strict: false}) as {wid: string; pid: string};
+  const {wid, pid} = useRouteParams(projectRouteParams);
   const navigate = useNavigate();
   const project = useProjectQuery(pid).data;
   useEffect(() => {
-    if (project && project.workspace_id !== wid)
+    if (project && project.workspaceId !== wid)
       void navigate({to: '/workspaces/$wid', params: {wid}, replace: true});
   }, [navigate, project, wid]);
-  if (project && project.workspace_id !== wid) return null;
+  if (project && project.workspaceId !== wid) return null;
   return <Outlet />;
 }

package/src/components/model-provider-reminder-banner.tsx

@@ -17,9 +17,7 @@ export function ModelProviderReminderBanner({workspaceId}: {workspaceId: string}
   const [dismissed, setDismissed] = useState(() => isReminderDismissed(workspaceId));
   const configs = configsQuery.data?.configs;
   const unconfigured =
-    Array.isArray(configs) &&
-    configs.length === 0 &&
-    configsQuery.data?.default_provider_id === null;
+    Array.isArray(configs) && configs.length === 0 && configsQuery.data?.defaultProviderId === null;
 
   if (!unconfigured || dismissed) return null;
 

package/src/components/project-switcher.test.tsx

@@ -8,6 +8,7 @@ import {
   RouterProvider,
 } from '@tanstack/react-router';
 import {fireEvent, render, screen} from '@testing-library/react';
+import {toProject} from '#hooks/api/mappers.js';
 import {projectsQueryKeys} from '#hooks/api/projects.js';
 import {PROJECT_TEST_WID} from '#test/pages.js';
 import {ProjectSwitcher} from './project-switcher.js';
@@ -50,7 +51,7 @@ function renderProjectSwitcher({
     defaultOptions: {queries: {retry: false, staleTime: Number.POSITIVE_INFINITY}},
   });
   queryClient.setQueryData(projectsQueryKeys.list(PROJECT_TEST_WID), {
-    pages: [{projects, next_cursor: null}],
+    pages: [{projects: projects.map(toProject), nextCursor: null}],
     pageParams: [undefined],
   });
   const rootRoute = createRootRoute({component: Outlet});

package/src/components/source-strip.tsx

@@ -1,4 +1,3 @@
-import type {DefinitionSyncSummaryDto} from '@shipfox/api-definitions-dto';
 import {useActiveWorkspace} from '@shipfox/client-auth';
 import {useSourceConnectionsQuery} from '@shipfox/client-integrations';
 import {StatusBadge} from '@shipfox/react-ui/badge';
@@ -6,6 +5,7 @@ import {Icon, type IconName} from '@shipfox/react-ui/icon';
 import {Skeleton} from '@shipfox/react-ui/skeleton';
 import {Tooltip, TooltipContent, TooltipTrigger} from '@shipfox/react-ui/tooltip';
 import {Code, Text} from '@shipfox/react-ui/typography';
+import type {DefinitionSyncSummary} from '#core/definition.js';
 
 /**
  * We cannot cheaply resolve `external_repository_id` → `owner/repo`
@@ -21,12 +21,12 @@ export function SourceStrip({
 }: {
   connectionId: string;
   externalRepositoryId: string;
-  sync: DefinitionSyncSummaryDto | null | undefined;
+  sync: DefinitionSyncSummary | null | undefined;
   isPending: boolean;
 }) {
   const workspace = useActiveWorkspace();
   const connectionsQuery = useSourceConnectionsQuery(workspace.id);
-  const connection = connectionsQuery.data?.connections.find((c) => c.id === connectionId);
+  const connection = connectionsQuery.data?.find((c) => c.id === connectionId);
 
   return (
     <section
@@ -40,7 +40,7 @@ export function SourceStrip({
             <Skeleton className="h-16 w-160" />
           ) : (
             <Text size="sm" bold className="truncate">
-              {connection?.display_name ?? 'Connected source'}
+              {connection?.displayName ?? 'Connected source'}
             </Text>
           )}
           <Tooltip>
@@ -69,7 +69,7 @@ function SyncBadge({
   sync,
   isPending,
 }: {
-  sync: DefinitionSyncSummaryDto | null | undefined;
+  sync: DefinitionSyncSummary | null | undefined;
   isPending: boolean;
 }) {
   if (isPending) return <StatusBadge variant="neutral">Loading</StatusBadge>;

package/src/core/definition.ts

@@ -0,0 +1,31 @@
+export interface Definition {
+  id: string;
+  projectId: string;
+  configPath: string | null;
+  source: 'manual' | 'vcs';
+  sha: string | null;
+  ref: string | null;
+  name: string;
+  workflowDocument: unknown;
+  workflowModel: unknown;
+  manualTrigger: {name: string} | null;
+  fetchedAt: string;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface DefinitionSyncSummary {
+  ref: string | null;
+  status: 'pending' | 'syncing' | 'succeeded' | 'failed';
+  lastSyncAt: string;
+  startedAt: string | null;
+  finishedAt: string | null;
+  lastErrorCode: string | null;
+  lastErrorMessage: string | null;
+}
+
+export interface DefinitionList {
+  definitions: Definition[];
+  sync: DefinitionSyncSummary | null;
+  nextCursor: string | null;
+}

package/src/core/project.ts

@@ -0,0 +1,47 @@
+export interface ProjectSource {
+  connectionId: string;
+  externalRepositoryId: string;
+}
+
+export interface Project {
+  id: string;
+  workspaceId: string;
+  name: string;
+  source: ProjectSource;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface ProjectList {
+  projects: Project[];
+  nextCursor: string | null;
+}
+
+export interface CreateProjectCommand {
+  workspaceId: string;
+  name: string;
+  source: ProjectSource;
+}
+
+const REPOSITORY_NAME_SPLIT_RE = /[/-]/;
+
+export function projectNameFromRepository(repositoryId: string): string {
+  return repositoryId
+    .trim()
+    .split(REPOSITORY_NAME_SPLIT_RE)
+    .filter(Boolean)
+    .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
+    .join(' ');
+}
+
+export function selectProjectSource<T extends {externalRepositoryId: string}>(
+  repositories: T[],
+  selectedRepositoryId: string | undefined,
+): T | undefined {
+  if (selectedRepositoryId) {
+    return repositories.find(
+      (repository) => repository.externalRepositoryId === selectedRepositoryId,
+    );
+  }
+  return repositories[0];
+}

package/src/feature.ts

@@ -1,4 +1,15 @@
-import {defineClientFeature} from '@shipfox/client-shell';
+import {defineClientFeature, type NavTabEntry} from '@shipfox/client-shell';
+
+export const projectsNavigation = [
+  {
+    id: 'nav.projects',
+    scope: 'workspace',
+    label: 'Projects',
+    to: '/workspaces/$wid',
+    exact: true,
+    order: 100,
+  },
+] as const satisfies readonly NavTabEntry[];
 
 export const projectsFeature = defineClientFeature({
   id: 'shipfox.projects',
@@ -19,14 +30,5 @@ export const projectsFeature = defineClientFeature({
       impl: '@shipfox/client-projects/routes/project-index',
     },
   ],
-  navigation: [
-    {
-      id: 'nav.projects',
-      scope: 'workspace',
-      label: 'Projects',
-      to: '/workspaces/$wid',
-      exact: true,
-      order: 100,
-    },
-  ],
+  navigation: projectsNavigation,
 });

package/src/hooks/api/definitions.ts

@@ -1,12 +1,38 @@
-import type {DefinitionListResponseDto} from '@shipfox/api-definitions-dto';
-import {apiRequest} from '@shipfox/client-api';
-import {keepPreviousData, useInfiniteQuery, useQuery} from '@tanstack/react-query';
+import {definitionListResponseSchema} from '@shipfox/api-definitions-dto';
+import {checkedApiRequest} from '@shipfox/client-api';
+import {
+  type InfiniteData,
+  keepPreviousData,
+  queryOptions,
+  type UseInfiniteQueryOptions,
+  type UseQueryOptions,
+  useInfiniteQuery,
+  useQuery,
+} from '@tanstack/react-query';
+import type {DefinitionList} from '#core/definition.js';
+import {toDefinitionList} from './mappers.js';
 
 export const definitionsQueryKeys = {
   all: ['definitions'] as const,
   list: (projectId: string) => [...definitionsQueryKeys.all, 'list', projectId] as const,
 };
 
+type DefinitionListQueryKey =
+  | ReturnType<typeof definitionsQueryKeys.list>
+  | readonly ['definitions', 'list'];
+type DefinitionListInfiniteQueryOptions = UseInfiniteQueryOptions<
+  DefinitionList,
+  Error,
+  InfiniteData<DefinitionList, string | undefined>,
+  DefinitionListQueryKey,
+  string | undefined
+>;
+type DefinitionListQueryOptions = UseQueryOptions<
+  DefinitionList,
+  Error,
+  DefinitionList,
+  DefinitionListQueryKey
+>;
 export async function listDefinitions({
   projectId,
   limit = 50,
@@ -16,35 +42,44 @@ export async function listDefinitions({
   projectId: string;
   limit?: number;
   cursor?: string | undefined;
-  signal?: AbortSignal;
-}) {
+  signal?: AbortSignal | undefined;
+}): Promise<DefinitionList> {
   const params = new URLSearchParams({project_id: projectId, limit: String(limit)});
   if (cursor) params.set('cursor', cursor);
-  return await apiRequest<DefinitionListResponseDto>(`/definitions?${params.toString()}`, {
-    signal,
-  });
+  return toDefinitionList(
+    await checkedApiRequest(definitionListResponseSchema, `/definitions?${params.toString()}`, {
+      signal,
+    }),
+  );
 }
-
-export function useDefinitionsInfiniteQuery(projectId: string | undefined, limit = 50) {
-  return useInfiniteQuery({
+export function definitionsInfiniteQueryOptions(
+  projectId: string | undefined,
+  limit = 50,
+): DefinitionListInfiniteQueryOptions {
+  return {
     queryKey: projectId
       ? definitionsQueryKeys.list(projectId)
-      : [...definitionsQueryKeys.all, 'list'],
+      : ([...definitionsQueryKeys.all, 'list'] as const),
     enabled: Boolean(projectId),
     initialPageParam: undefined as string | undefined,
-    queryFn: ({pageParam, signal}) =>
+    queryFn: ({pageParam, signal}: {pageParam: string | undefined; signal: AbortSignal}) =>
       listDefinitions({projectId: projectId ?? '', limit, cursor: pageParam, signal}),
-    getNextPageParam: (lastPage) => lastPage.next_cursor ?? undefined,
+    getNextPageParam: (lastPage: DefinitionList) => lastPage.nextCursor ?? undefined,
     placeholderData: keepPreviousData,
-  });
+  };
 }
-
-export function useDefinitionsQuery(projectId: string | undefined) {
-  return useQuery({
+export function definitionsQueryOptions(projectId: string | undefined): DefinitionListQueryOptions {
+  return queryOptions({
     queryKey: projectId
       ? definitionsQueryKeys.list(projectId)
-      : [...definitionsQueryKeys.all, 'list'],
+      : ([...definitionsQueryKeys.all, 'list'] as const),
     enabled: Boolean(projectId),
     queryFn: ({signal}) => listDefinitions({projectId: projectId ?? '', signal}),
   });
 }
+export function useDefinitionsInfiniteQuery(projectId: string | undefined, limit = 50) {
+  return useInfiniteQuery(definitionsInfiniteQueryOptions(projectId, limit));
+}
+export function useDefinitionsQuery(projectId: string | undefined) {
+  return useQuery(definitionsQueryOptions(projectId));
+}

package/src/hooks/api/mappers.ts

@@ -0,0 +1,67 @@
+import type {DefinitionDto, DefinitionSyncSummaryDto} from '@shipfox/api-definitions-dto';
+import type {ProjectResponseDto} from '@shipfox/api-projects-dto';
+import type {Definition, DefinitionList, DefinitionSyncSummary} from '#core/definition.js';
+import type {Project, ProjectList} from '#core/project.js';
+
+export function toProject(dto: ProjectResponseDto): Project {
+  return {
+    id: dto.id,
+    workspaceId: dto.workspace_id,
+    name: dto.name,
+    source: {
+      connectionId: dto.source.connection_id,
+      externalRepositoryId: dto.source.external_repository_id,
+    },
+    createdAt: dto.created_at,
+    updatedAt: dto.updated_at,
+  };
+}
+
+export function toProjectList(dto: {
+  projects: ProjectResponseDto[];
+  next_cursor: string | null;
+}): ProjectList {
+  return {projects: dto.projects.map(toProject), nextCursor: dto.next_cursor};
+}
+
+export function toDefinition(dto: DefinitionDto): Definition {
+  return {
+    id: dto.id,
+    projectId: dto.project_id,
+    configPath: dto.config_path,
+    source: dto.source,
+    sha: dto.sha,
+    ref: dto.ref,
+    name: dto.name,
+    workflowDocument: dto.workflow_document,
+    workflowModel: dto.workflow_model,
+    manualTrigger: dto.manual_trigger,
+    fetchedAt: dto.fetched_at,
+    createdAt: dto.created_at,
+    updatedAt: dto.updated_at,
+  };
+}
+
+export function toDefinitionSyncSummary(dto: DefinitionSyncSummaryDto): DefinitionSyncSummary {
+  return {
+    ref: dto.ref,
+    status: dto.status,
+    lastSyncAt: dto.last_sync_at,
+    startedAt: dto.started_at,
+    finishedAt: dto.finished_at,
+    lastErrorCode: dto.last_error_code,
+    lastErrorMessage: dto.last_error_message,
+  };
+}
+
+export function toDefinitionList(dto: {
+  definitions: DefinitionDto[];
+  sync: DefinitionSyncSummaryDto | null;
+  next_cursor: string | null;
+}): DefinitionList {
+  return {
+    definitions: dto.definitions.map(toDefinition),
+    sync: dto.sync && toDefinitionSyncSummary(dto.sync),
+    nextCursor: dto.next_cursor,
+  };
+}

package/src/hooks/api/projects.test.ts

@@ -59,11 +59,11 @@ describe('createProject', () => {
     });
     configureApiClient({fetchImpl});
     const body = {
-      workspace_id: '11111111-1111-4111-8111-111111111111',
+      workspaceId: '11111111-1111-4111-8111-111111111111',
       name: 'Platform',
       source: {
-        connection_id: '33333333-3333-4333-8333-333333333333',
-        external_repository_id: 'platform',
+        connectionId: '33333333-3333-4333-8333-333333333333',
+        externalRepositoryId: 'platform',
       },
     };
 
@@ -73,6 +73,13 @@ describe('createProject', () => {
     expect(result.name).toBe('Platform');
     expect(request.url).toBe('https://api.example.test/projects');
     expect(request.method).toBe('POST');
-    expect(requestBody).toEqual(body);
+    expect(requestBody).toEqual({
+      workspace_id: body.workspaceId,
+      name: body.name,
+      source: {
+        connection_id: body.source.connectionId,
+        external_repository_id: body.source.externalRepositoryId,
+      },
+    });
   });
 });