@shipfox/client-runners 4.0.0 → 6.0.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@shipfox/client-runners",
   "license": "MIT",
-  "version": "4.0.0",
+  "version": "6.0.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/ShipfoxHQ/shipfox.git",
@@ -10,28 +10,37 @@
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
-  "imports": {
-    "#*": "./dist/*"
-  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
       "default": "./dist/index.js"
+    },
+    "./feature": {
+      "types": "./dist/feature.d.ts",
+      "default": "./dist/feature.js"
+    },
+    "./routes/*": {
+      "types": "./dist/routes/*.d.ts",
+      "default": "./dist/routes/*.js"
     }
   },
   "dependencies": {
     "@swc/helpers": "^0.5.17",
     "@tanstack/react-form": "^1.32.0",
-    "@shipfox/api-runners-dto": "7.0.1",
-    "@shipfox/client-api": "4.0.0",
-    "@shipfox/client-ui": "4.0.0",
-    "@shipfox/react-ui": "0.3.5"
+    "@shipfox/api-runners-dto": "9.0.1",
+    "@shipfox/client-api": "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",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
+  "imports": {
+    "#*": "./dist/*"
+  },
   "scripts": {
     "build": "shipfox-swc",
     "check": "shipfox-biome-check",

package/src/components/create-manual-registration-token-form.tsx

@@ -1,4 +1,3 @@
-import type {CreateManualRegistrationTokenResponseDto} from '@shipfox/api-runners-dto';
 import {Button} from '@shipfox/react-ui/button';
 import {Callout, CalloutContent, CalloutDescription, CalloutTitle} from '@shipfox/react-ui/callout';
 import {FormField, FormFieldInput, fieldError} from '@shipfox/react-ui/form-field';
@@ -6,15 +5,14 @@ import {useCopyToClipboard} from '@shipfox/react-ui/hooks';
 import {ModalBody, ModalFooter} from '@shipfox/react-ui/modal';
 import {Code, Text} from '@shipfox/react-ui/typography';
 import {useForm} from '@tanstack/react-form';
-import {useQueryClient} from '@tanstack/react-query';
 import {useState} from 'react';
-import {
-  manualRegistrationTokenQueryKeys,
-  useCreateManualRegistrationTokenMutation,
-} from '#hooks/api/manual-registration-tokens.js';
+import type {CreatedManualRegistrationToken} from '#core/token.js';
+import {createTokenCommand} from '#core/token.js';
+import {useCreateManualRegistrationTokenMutation} from '#hooks/api/manual-registration-tokens.js';
 import {manualRegistrationTokenCreateErrorToFormError} from './form-errors.js';
 import {
   ExpirationSelect,
+  expirationCommand,
   expirationHint,
   type TokenExpirationOption,
 } from './token-expiration-select.js';
@@ -26,27 +24,19 @@ export function CreateManualRegistrationTokenForm({
   onCreated,
 }: {
   workspaceId: string;
-  onCreated: (token: CreateManualRegistrationTokenResponseDto) => void;
+  onCreated: (token: CreatedManualRegistrationToken) => void;
 }) {
-  const queryClient = useQueryClient();
-  const createToken = useCreateManualRegistrationTokenMutation();
+  const createToken = useCreateManualRegistrationTokenMutation(workspaceId);
   const [formError, setFormError] = useState<string | undefined>();
 
   const form = useForm({
     defaultValues: {name: '', expiration: '86400' as TokenExpirationOption},
     onSubmit: async ({value}) => {
       setFormError(undefined);
-      const trimmedName = value.name.trim();
-      const body = {
-        ...(trimmedName ? {name: trimmedName} : {}),
-        ...(value.expiration === 'never' ? {} : {ttl_seconds: Number(value.expiration)}),
-      };
+      const command = createTokenCommand(value.name, expirationCommand(value.expiration));
 
       try {
-        const token = await createToken.mutateAsync({workspaceId, body});
-        await queryClient.invalidateQueries({
-          queryKey: manualRegistrationTokenQueryKeys.list(workspaceId),
-        });
+        const token = await createToken.mutateAsync(command);
         onCreated(token);
       } catch (error) {
         const mapped = manualRegistrationTokenCreateErrorToFormError(error);
@@ -144,11 +134,11 @@ export function CreateManualRegistrationTokenForm({
 export function CreatedManualRegistrationTokenPanel({
   token,
 }: {
-  token: CreateManualRegistrationTokenResponseDto;
+  token: CreatedManualRegistrationToken;
 }) {
   const [copyState, setCopyState] = useState<'idle' | 'copied' | 'failed'>('idle');
   const {copy} = useCopyToClipboard({
-    text: token.raw_token,
+    text: token.token,
     onCopy: () => {
       setCopyState('copied');
       window.setTimeout(() => setCopyState('idle'), 1500);
@@ -175,7 +165,7 @@ export function CreatedManualRegistrationTokenPanel({
         </div>
         <div className="flex items-center gap-8 max-[640px]:flex-col max-[640px]:items-stretch">
           <Code variant="paragraph" className="min-w-0 flex-1 break-all">
-            {token.raw_token}
+            {token.token}
           </Code>
           <Button
             size="sm"

package/src/components/create-provisioner-token-form.tsx

@@ -1,4 +1,3 @@
-import type {CreateProvisionerTokenResponseDto} from '@shipfox/api-runners-dto';
 import {Button} from '@shipfox/react-ui/button';
 import {Callout, CalloutContent, CalloutDescription, CalloutTitle} from '@shipfox/react-ui/callout';
 import {FormField, FormFieldInput, fieldError} from '@shipfox/react-ui/form-field';
@@ -6,15 +5,14 @@ import {useCopyToClipboard} from '@shipfox/react-ui/hooks';
 import {ModalBody, ModalFooter} from '@shipfox/react-ui/modal';
 import {Code, Text} from '@shipfox/react-ui/typography';
 import {useForm} from '@tanstack/react-form';
-import {useQueryClient} from '@tanstack/react-query';
 import {useState} from 'react';
-import {
-  provisionerTokenQueryKeys,
-  useCreateProvisionerTokenMutation,
-} from '#hooks/api/provisioner-tokens.js';
+import type {CreatedProvisionerToken} from '#core/token.js';
+import {createTokenCommand} from '#core/token.js';
+import {useCreateProvisionerTokenMutation} from '#hooks/api/provisioner-tokens.js';
 import {provisionerTokenCreateErrorToFormError} from './provisioner-token-form-errors.js';
 import {
   ExpirationSelect,
+  expirationCommand,
   expirationHint,
   type TokenExpirationOption,
 } from './token-expiration-select.js';
@@ -26,27 +24,19 @@ export function CreateProvisionerTokenForm({
   onCreated,
 }: {
   workspaceId: string;
-  onCreated: (token: CreateProvisionerTokenResponseDto) => void;
+  onCreated: (token: CreatedProvisionerToken) => void;
 }) {
-  const queryClient = useQueryClient();
-  const createToken = useCreateProvisionerTokenMutation();
+  const createToken = useCreateProvisionerTokenMutation(workspaceId);
   const [formError, setFormError] = useState<string | undefined>();
 
   const form = useForm({
     defaultValues: {name: '', expiration: '86400' as TokenExpirationOption},
     onSubmit: async ({value}) => {
       setFormError(undefined);
-      const trimmedName = value.name.trim();
-      const body = {
-        ...(trimmedName ? {name: trimmedName} : {}),
-        ...(value.expiration === 'never' ? {} : {ttl_seconds: Number(value.expiration)}),
-      };
+      const command = createTokenCommand(value.name, expirationCommand(value.expiration));
 
       try {
-        const token = await createToken.mutateAsync({workspaceId, body});
-        await queryClient.invalidateQueries({
-          queryKey: provisionerTokenQueryKeys.list(workspaceId),
-        });
+        const token = await createToken.mutateAsync(command);
         onCreated(token);
       } catch (error) {
         const mapped = provisionerTokenCreateErrorToFormError(error);
@@ -141,10 +131,10 @@ export function CreateProvisionerTokenForm({
   );
 }
 
-export function CreatedProvisionerTokenPanel({token}: {token: CreateProvisionerTokenResponseDto}) {
+export function CreatedProvisionerTokenPanel({token}: {token: CreatedProvisionerToken}) {
   const [copyState, setCopyState] = useState<'idle' | 'copied' | 'failed'>('idle');
   const {copy} = useCopyToClipboard({
-    text: token.raw_token,
+    text: token.token,
     onCopy: () => {
       setCopyState('copied');
       window.setTimeout(() => setCopyState('idle'), 1500);
@@ -171,7 +161,7 @@ export function CreatedProvisionerTokenPanel({token}: {token: CreateProvisionerT
         </div>
         <div className="flex items-center gap-8 max-[640px]:flex-col max-[640px]:items-stretch">
           <Code variant="paragraph" className="min-w-0 flex-1 break-all">
-            {token.raw_token}
+            {token.token}
           </Code>
           <Button
             size="sm"

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

@@ -10,10 +10,10 @@ describe('manualRegistrationTokenCreateErrorToFormError', () => {
     expect(result).toEqual({kind: 'form', message: 'Try later'});
   });
 
-  test('routes Error to a form-level alert with the error message', () => {
+  test('does not expose an unknown Error message', () => {
     const result = manualRegistrationTokenCreateErrorToFormError(new Error('boom'));
 
-    expect(result).toEqual({kind: 'form', message: 'boom'});
+    expect(result).toEqual({kind: 'form', message: 'Something went wrong. Try again.'});
   });
 
   test('falls back to generic copy for non-Error throwables', () => {

package/src/components/manual-registration-token-errors.ts

@@ -8,6 +8,5 @@ export function manualRegistrationTokenErrorMessage(error: unknown): string {
     }
     return error.message;
   }
-  if (error instanceof Error) return error.message;
   return 'Something went wrong. Try again.';
 }

package/src/components/manual-registration-token-format.test.ts

@@ -1,18 +1,18 @@
+import {tokenDisplayName} from '#core/token.js';
 import {
   formatManualRegistrationTokenDate,
   formatManualRegistrationTokenTimestamp,
-  manualRegistrationTokenDisplayName,
 } from './manual-registration-token-format.js';
 
-describe('manualRegistrationTokenDisplayName', () => {
+describe('tokenDisplayName', () => {
   test('uses the token name when present', () => {
-    const result = manualRegistrationTokenDisplayName({name: 'Deploy runner'});
+    const result = tokenDisplayName({name: 'Deploy runner'});
 
     expect(result).toBe('Deploy runner');
   });
 
   test('falls back for unnamed tokens', () => {
-    const result = manualRegistrationTokenDisplayName({name: null});
+    const result = tokenDisplayName({name: null});
 
     expect(result).toBe('Unnamed token');
   });

package/src/components/manual-registration-token-format.ts

@@ -1,4 +1,3 @@
-import type {ManualRegistrationTokenDto} from '@shipfox/api-runners-dto';
 import {formatDate, formatTimestamp} from '@shipfox/react-ui/utils';
 
 export function formatManualRegistrationTokenDate(value: string | null): string {
@@ -10,9 +9,3 @@ export function formatManualRegistrationTokenTimestamp(value: string | null): st
   if (!value) return undefined;
   return formatTimestamp(value);
 }
-
-export function manualRegistrationTokenDisplayName(
-  token: Pick<ManualRegistrationTokenDto, 'name'>,
-): string {
-  return token.name || 'Unnamed token';
-}

package/src/components/manual-registration-token-list.tsx

@@ -1,4 +1,3 @@
-import type {ManualRegistrationTokenDto} from '@shipfox/api-runners-dto';
 import {Button, IconButton} from '@shipfox/react-ui/button';
 import {Callout} from '@shipfox/react-ui/callout';
 import {
@@ -26,17 +25,13 @@ import {
   TableRow,
 } from '@shipfox/react-ui/table';
 import {Code, Text} from '@shipfox/react-ui/typography';
-import {useQueryClient} from '@tanstack/react-query';
 import {useState} from 'react';
-import {
-  manualRegistrationTokenQueryKeys,
-  useRevokeManualRegistrationTokenMutation,
-} from '#hooks/api/manual-registration-tokens.js';
+import {type ManualRegistrationToken, tokenDisplayName} from '#core/token.js';
+import {useRevokeManualRegistrationTokenMutation} from '#hooks/api/manual-registration-tokens.js';
 import {manualRegistrationTokenErrorMessage} from './manual-registration-token-errors.js';
 import {
   formatManualRegistrationTokenDate,
   formatManualRegistrationTokenTimestamp,
-  manualRegistrationTokenDisplayName,
 } from './manual-registration-token-format.js';
 import {TokenDate} from './token-date.js';
 import {TokenName} from './token-name.js';
@@ -46,7 +41,7 @@ export function ManualRegistrationTokenList({
   tokens,
 }: {
   workspaceId: string;
-  tokens: ManualRegistrationTokenDto[];
+  tokens: ManualRegistrationToken[];
 }) {
   return (
     <>
@@ -65,7 +60,7 @@ export function ManualRegistrationTokenList({
             {tokens.map((token) => (
               <TableRow key={token.id}>
                 <TableCell>
-                  <TokenName name={manualRegistrationTokenDisplayName(token)} />
+                  <TokenName name={tokenDisplayName(token)} />
                 </TableCell>
                 <TableCell>
                   <Code variant="paragraph" className="block truncate">
@@ -73,10 +68,10 @@ export function ManualRegistrationTokenList({
                   </Code>
                 </TableCell>
                 <TableCell>
-                  <ManualRegistrationTokenDate value={token.expires_at} />
+                  <ManualRegistrationTokenDate value={token.expiresAt} />
                 </TableCell>
                 <TableCell>
-                  <ManualRegistrationTokenDate value={token.created_at} />
+                  <ManualRegistrationTokenDate value={token.createdAt} />
                 </TableCell>
                 <TableCell className="text-right">
                   <RevokeManualRegistrationTokenButton workspaceId={workspaceId} token={token} />
@@ -97,7 +92,7 @@ export function ManualRegistrationTokenList({
           >
             <div className="flex items-start justify-between gap-12">
               <div className="min-w-0 flex-1">
-                <TokenName name={manualRegistrationTokenDisplayName(token)} />
+                <TokenName name={tokenDisplayName(token)} />
                 <Code variant="paragraph" className="block truncate text-foreground-neutral-muted">
                   {token.prefix}
                 </Code>
@@ -108,13 +103,13 @@ export function ManualRegistrationTokenList({
               <div>
                 <dt className="text-foreground-neutral-muted">Expires</dt>
                 <dd>
-                  <ManualRegistrationTokenDate value={token.expires_at} />
+                  <ManualRegistrationTokenDate value={token.expiresAt} />
                 </dd>
               </div>
               <div>
                 <dt className="text-foreground-neutral-muted">Created</dt>
                 <dd>
-                  <ManualRegistrationTokenDate value={token.created_at} />
+                  <ManualRegistrationTokenDate value={token.createdAt} />
                 </dd>
               </div>
             </dl>
@@ -140,19 +135,15 @@ function RevokeManualRegistrationTokenButton({
   token,
 }: {
   workspaceId: string;
-  token: ManualRegistrationTokenDto;
+  token: ManualRegistrationToken;
 }) {
-  const queryClient = useQueryClient();
-  const revokeToken = useRevokeManualRegistrationTokenMutation();
+  const revokeToken = useRevokeManualRegistrationTokenMutation(workspaceId);
   const [open, setOpen] = useState(false);
-  const tokenName = manualRegistrationTokenDisplayName(token);
+  const tokenName = tokenDisplayName(token);
 
   async function handleRevoke() {
     try {
-      await revokeToken.mutateAsync({workspaceId, tokenId: token.id});
-      await queryClient.invalidateQueries({
-        queryKey: manualRegistrationTokenQueryKeys.list(workspaceId),
-      });
+      await revokeToken.mutateAsync(token.id);
       setOpen(false);
     } catch {
       // React Query stores the error for the inline modal alert.

package/src/components/manual-registration-tokens-settings-section.tsx

@@ -1,4 +1,3 @@
-import type {CreateManualRegistrationTokenResponseDto} from '@shipfox/api-runners-dto';
 import {QueryLoadError} from '@shipfox/client-ui';
 import {Button} from '@shipfox/react-ui/button';
 import {Icon} from '@shipfox/react-ui/icon';
@@ -12,6 +11,7 @@ import {
 } from '@shipfox/react-ui/modal';
 import {Header, Text} from '@shipfox/react-ui/typography';
 import {useState} from 'react';
+import type {CreatedManualRegistrationToken} from '#core/token.js';
 import {useManualRegistrationTokensQuery} from '#hooks/api/manual-registration-tokens.js';
 import {
   CreatedManualRegistrationTokenPanel,
@@ -30,10 +30,8 @@ export function WorkspaceManualRegistrationTokensSettingsSection({
 }) {
   const tokensQuery = useManualRegistrationTokensQuery(workspaceId);
   const [isModalOpen, setIsModalOpen] = useState(false);
-  const [createdToken, setCreatedToken] = useState<CreateManualRegistrationTokenResponseDto | null>(
-    null,
-  );
-  const tokens = tokensQuery.data?.manual_registration_tokens ?? [];
+  const [createdToken, setCreatedToken] = useState<CreatedManualRegistrationToken | null>(null);
+  const tokens = tokensQuery.data ?? [];
 
   function handleOpenChange(nextOpen: boolean) {
     setIsModalOpen(nextOpen);

package/src/components/provisioner-token-errors.ts

@@ -7,6 +7,5 @@ export function provisionerTokenErrorMessage(error: unknown): string {
     }
     return error.message;
   }
-  if (error instanceof Error) return error.message;
   return 'Something went wrong. Try again.';
 }

package/src/components/provisioner-token-form-errors.test.ts

@@ -21,10 +21,10 @@ describe('provisionerTokenCreateErrorToFormError', () => {
     });
   });
 
-  test('routes Error to a form-level alert with the error message', () => {
+  test('does not expose an unknown Error message', () => {
     const result = provisionerTokenCreateErrorToFormError(new Error('boom'));
 
-    expect(result).toEqual({kind: 'form', message: 'boom'});
+    expect(result).toEqual({kind: 'form', message: 'Something went wrong. Try again.'});
   });
 
   test('falls back to generic copy for non-Error throwables', () => {

package/src/components/provisioner-token-format.test.ts

@@ -1,24 +1,25 @@
-import type {ProvisionerTokenDto} from '@shipfox/api-runners-dto';
 import {
-  formatProvisionerTokenDate,
-  formatProvisionerTokenTimestamp,
+  type ProvisionerToken,
   provisionerConnectionStatus,
   provisionerTokenDisplayName,
+} from '#core/token.js';
+import {
+  formatProvisionerTokenDate,
+  formatProvisionerTokenTimestamp,
 } from './provisioner-token-format.js';
 
-const token: ProvisionerTokenDto = {
+const token: ProvisionerToken = {
   id: '33333333-3333-4333-8333-333333333333',
-  scope: 'workspace',
-  workspace_id: '11111111-1111-4111-8111-111111111111',
+  workspaceId: '11111111-1111-4111-8111-111111111111',
   prefix: 'sf_pt_abcde',
   name: 'Docker provisioner',
-  created_by_user_id: '22222222-2222-4222-8222-222222222222',
-  revoked_by_user_id: null,
-  expires_at: '2026-05-09T00:00:00.000Z',
-  revoked_at: null,
-  last_seen_at: null,
-  created_at: '2026-05-08T00:00:00.000Z',
-  updated_at: '2026-05-08T00:00:00.000Z',
+  createdByUserId: '22222222-2222-4222-8222-222222222222',
+  revokedByUserId: null,
+  expiresAt: '2026-05-09T00:00:00.000Z',
+  revokedAt: null,
+  lastSeenAt: null,
+  createdAt: '2026-05-08T00:00:00.000Z',
+  updatedAt: '2026-05-08T00:00:00.000Z',
 };
 
 describe('provisionerTokenDisplayName', () => {
@@ -73,7 +74,7 @@ describe('provisionerConnectionStatus', () => {
 
   test('returns last seen when inactive with a last seen timestamp', () => {
     const result = provisionerConnectionStatus(
-      {...token, last_seen_at: '2026-05-08T01:00:00.000Z'},
+      {...token, lastSeenAt: '2026-05-08T01:00:00.000Z'},
       new Set(),
     );
 

package/src/components/provisioner-token-format.ts

@@ -1,12 +1,5 @@
-import type {ProvisionerTokenDto} from '@shipfox/api-runners-dto';
-import type {DotVariant} from '@shipfox/react-ui/dot';
 import {formatDate, formatTimestamp} from '@shipfox/react-ui/utils';
 
-export type ProvisionerConnectionStatus =
-  | {kind: 'connected'; dotVariant: DotVariant; label: 'Connected'}
-  | {kind: 'last-seen'; dotVariant: DotVariant; label: 'Last seen'; lastSeenAt: string}
-  | {kind: 'never-connected'; dotVariant: DotVariant; label: 'Never connected'};
-
 export function formatProvisionerTokenDate(value: string | null): string {
   if (!value) return 'Never';
   return formatDate(value);
@@ -16,25 +9,3 @@ export function formatProvisionerTokenTimestamp(value: string | null): string |
   if (!value) return undefined;
   return formatTimestamp(value);
 }
-
-export function provisionerTokenDisplayName(token: Pick<ProvisionerTokenDto, 'name'>): string {
-  return token.name || 'Unnamed provisioner';
-}
-
-export function provisionerConnectionStatus(
-  token: Pick<ProvisionerTokenDto, 'id' | 'last_seen_at'>,
-  activeIds: ReadonlySet<string>,
-): ProvisionerConnectionStatus {
-  if (activeIds.has(token.id)) {
-    return {kind: 'connected', dotVariant: 'success', label: 'Connected'};
-  }
-  if (token.last_seen_at) {
-    return {
-      kind: 'last-seen',
-      dotVariant: 'neutral',
-      label: 'Last seen',
-      lastSeenAt: token.last_seen_at,
-    };
-  }
-  return {kind: 'never-connected', dotVariant: 'neutral', label: 'Never connected'};
-}

package/src/components/provisioner-token-list.tsx

@@ -1,4 +1,3 @@
-import type {ProvisionerTokenDto} from '@shipfox/api-runners-dto';
 import {Button, IconButton} from '@shipfox/react-ui/button';
 import {Callout} from '@shipfox/react-ui/callout';
 import {Dot} from '@shipfox/react-ui/dot';
@@ -28,18 +27,17 @@ import {
   TableRow,
 } from '@shipfox/react-ui/table';
 import {Code, Text} from '@shipfox/react-ui/typography';
-import {useQueryClient} from '@tanstack/react-query';
 import {useState} from 'react';
 import {
-  provisionerTokenQueryKeys,
-  useRevokeProvisionerTokenMutation,
-} from '#hooks/api/provisioner-tokens.js';
+  type ProvisionerToken,
+  provisionerConnectionStatus,
+  provisionerTokenDisplayName,
+} from '#core/token.js';
+import {useRevokeProvisionerTokenMutation} from '#hooks/api/provisioner-tokens.js';
 import {provisionerTokenErrorMessage} from './provisioner-token-errors.js';
 import {
   formatProvisionerTokenDate,
   formatProvisionerTokenTimestamp,
-  provisionerConnectionStatus,
-  provisionerTokenDisplayName,
 } from './provisioner-token-format.js';
 import {TokenDate} from './token-date.js';
 import {TokenName} from './token-name.js';
@@ -50,7 +48,7 @@ export function ProvisionerTokenList({
   activeIds,
 }: {
   workspaceId: string;
-  tokens: ProvisionerTokenDto[];
+  tokens: ProvisionerToken[];
   activeIds: ReadonlySet<string>;
 }) {
   return (
@@ -82,10 +80,10 @@ export function ProvisionerTokenList({
                   <ProvisionerStatusCell token={token} activeIds={activeIds} />
                 </TableCell>
                 <TableCell>
-                  <ProvisionerTokenDate value={token.expires_at} />
+                  <ProvisionerTokenDate value={token.expiresAt} />
                 </TableCell>
                 <TableCell>
-                  <ProvisionerTokenDate value={token.created_at} />
+                  <ProvisionerTokenDate value={token.createdAt} />
                 </TableCell>
                 <TableCell className="text-right">
                   <RevokeProvisionerTokenButton workspaceId={workspaceId} token={token} />
@@ -120,13 +118,13 @@ export function ProvisionerTokenList({
               <div>
                 <dt className="text-foreground-neutral-muted">Expires</dt>
                 <dd>
-                  <ProvisionerTokenDate value={token.expires_at} />
+                  <ProvisionerTokenDate value={token.expiresAt} />
                 </dd>
               </div>
               <div>
                 <dt className="text-foreground-neutral-muted">Created</dt>
                 <dd>
-                  <ProvisionerTokenDate value={token.created_at} />
+                  <ProvisionerTokenDate value={token.createdAt} />
                 </dd>
               </div>
             </dl>
@@ -151,7 +149,7 @@ function ProvisionerStatusCell({
   token,
   activeIds,
 }: {
-  token: ProvisionerTokenDto;
+  token: ProvisionerToken;
   activeIds: ReadonlySet<string>;
 }) {
   const status = provisionerConnectionStatus(token, activeIds);
@@ -175,22 +173,15 @@ function RevokeProvisionerTokenButton({
   token,
 }: {
   workspaceId: string;
-  token: ProvisionerTokenDto;
+  token: ProvisionerToken;
 }) {
-  const queryClient = useQueryClient();
-  const revokeToken = useRevokeProvisionerTokenMutation();
+  const revokeToken = useRevokeProvisionerTokenMutation(workspaceId);
   const [open, setOpen] = useState(false);
   const tokenName = provisionerTokenDisplayName(token);
 
   async function handleRevoke() {
     try {
-      await revokeToken.mutateAsync({workspaceId, tokenId: token.id});
-      await queryClient.invalidateQueries({
-        queryKey: provisionerTokenQueryKeys.list(workspaceId),
-      });
-      await queryClient.invalidateQueries({
-        queryKey: provisionerTokenQueryKeys.active(workspaceId),
-      });
+      await revokeToken.mutateAsync(token.id);
       setOpen(false);
     } catch {
       // React Query stores the error for the inline modal alert.

package/src/components/provisioner-tokens-settings-section.tsx

@@ -1,4 +1,3 @@
-import type {CreateProvisionerTokenResponseDto} from '@shipfox/api-runners-dto';
 import {QueryLoadError} from '@shipfox/client-ui';
 import {Button} from '@shipfox/react-ui/button';
 import {Icon} from '@shipfox/react-ui/icon';
@@ -13,6 +12,7 @@ import {
 import {RelativeTimeProvider} from '@shipfox/react-ui/relative-time';
 import {Header, Text} from '@shipfox/react-ui/typography';
 import {useMemo, useState} from 'react';
+import type {CreatedProvisionerToken} from '#core/token.js';
 import {
   useActiveProvisionersQuery,
   useProvisionerTokensQuery,
@@ -31,10 +31,10 @@ export function WorkspaceProvisionerTokensSettingsSection({workspaceId}: {worksp
   const tokensQuery = useProvisionerTokensQuery(workspaceId);
   const activeProvisionersQuery = useActiveProvisionersQuery(workspaceId);
   const [isModalOpen, setIsModalOpen] = useState(false);
-  const [createdToken, setCreatedToken] = useState<CreateProvisionerTokenResponseDto | null>(null);
-  const tokens = tokensQuery.data?.tokens ?? [];
+  const [createdToken, setCreatedToken] = useState<CreatedProvisionerToken | null>(null);
+  const tokens = tokensQuery.data ?? [];
   const activeIds = useMemo(
-    () => new Set(activeProvisionersQuery.data?.provisioners.map((provisioner) => provisioner.id)),
+    () => new Set(activeProvisionersQuery.data?.map((provisioner) => provisioner.id)),
     [activeProvisionersQuery.data],
   );
 

package/src/components/token-expiration-select.test.ts

@@ -0,0 +1,15 @@
+import {expirationCommand} from './token-expiration-select.js';
+
+describe('expirationCommand', () => {
+  test('maps "never" to a non-expiring command', () => {
+    const result = expirationCommand('never');
+
+    expect(result).toEqual({kind: 'never'});
+  });
+
+  test('maps a TTL option to an expires-after command in seconds', () => {
+    const result = expirationCommand('86400');
+
+    expect(result).toEqual({kind: 'expires-after', seconds: 86_400});
+  });
+});