taskchef 8.7.0 → 9.0.0

package/src/dashboard/react/components/ActivityTimeline.tsx

@@ -1,118 +0,0 @@
-import { Box, Paper, Stack, Text } from "@mantine/core";
-import {
-  IconCurrencyDollar,
-  IconHistory,
-  IconHourglass,
-  IconStack2,
-} from "@tabler/icons-react";
-import { mergeProjectedTurns, turnPresentation } from "../../state.js";
-import { turnReportedWorkView, turnUsageMetricsView } from "../presentation";
-import type { Task, TaskTurn } from "../types";
-import { useEffect, useState } from "react";
-import { RelativeTime } from "./RelativeTime";
-import { LinkedText } from "./LinkedText";
-import { ShimmerText } from "./ShimmerText";
-import { StatCell, StaticStat, StatsGrid } from "./StatsGrid";
-import { StatusBadge } from "./StatusBadge";
-
-export function ActivityTimeline({ highlightTurnRef, task }: { highlightTurnRef: string | null; task: Task }) {
-  const turns = mergeProjectedTurns(task, []) as Task["turns"];
-  if (!turns?.length) return <Text c="dimmed" size="sm">No turn history has been recorded.</Text>;
-  return (
-    <Stack gap="sm">
-      {[...turns].reverse().map((turn, index) => {
-        const presentation = turnPresentation(turn);
-        const identity = turn.turnRef ?? turn.turnId ?? `turn-${index}`;
-        const highlighted = identity === highlightTurnRef;
-        const usage = turnUsageMetricsView(task, turn);
-        return (
-          <Paper
-            className={`taskchef-turn${highlighted ? " taskchef-turn-highlighted" : ""}`}
-            data-turn-ref={identity}
-            key={identity}
-            p="sm"
-            radius="md"
-            tabIndex={highlighted ? -1 : undefined}
-            withBorder
-          >
-            <Stack gap={7}>
-              <Box className="taskchef-turn-heading">
-                <Text c="dimmed" size="xs">{presentation.sourceLabel}</Text>
-                <StatusBadge status={presentation.status} />
-              </Box>
-              <Box>
-                <Text c="dimmed" className="taskchef-field-label" size="xs">Request</Text>
-                <Text className="taskchef-preserve-lines" size="sm">
-                  <LinkedText task={task} text={turn.requestSummary ?? "Request not recorded."} />
-                </Text>
-              </Box>
-              <Box>
-                <Text c="dimmed" className="taskchef-field-label" size="xs">Result</Text>
-                <Text className="taskchef-preserve-lines" size="sm">
-                  {presentation.status === "working"
-                    ? <ShimmerText>{presentation.summary}</ShimmerText>
-                    : <LinkedText task={task} text={presentation.summary} />}
-                </Text>
-              </Box>
-              <StatsGrid variant="turn">
-                <StatCell>
-                  <RelativeTime
-                    icon={<IconHistory aria-hidden size={14} />}
-                    label="Turn update time"
-                    value={presentation.updatedAt}
-                  />
-                </StatCell>
-                <StatCell>
-                  <TurnReportedWork turn={turn} />
-                </StatCell>
-                <StatCell usageState={usage.kind}>
-                  <StaticStat
-                    accessibleLabel={usage.tokens.accessibleLabel}
-                    animated={usage.animated}
-                    icon={<IconStack2 aria-hidden size={14} />}
-                    title="Tokens"
-                    value={usage.tokens.value}
-                  />
-                </StatCell>
-                <StatCell usageState={usage.kind}>
-                  <StaticStat
-                    accessibleLabel={usage.cost.accessibleLabel}
-                    animated={usage.animated}
-                    icon={<IconCurrencyDollar aria-hidden size={14} />}
-                    title="Estimated cost"
-                    value={usage.cost.value}
-                  />
-                </StatCell>
-              </StatsGrid>
-              {usage.note && <Text c="dimmed" size="xs">{usage.note}</Text>}
-            </Stack>
-          </Paper>
-        );
-      })}
-    </Stack>
-  );
-}
-
-function TurnReportedWork({ turn }: { turn: TaskTurn }) {
-  const now = useLiveNow(turn.result === null);
-  const elapsed = turnReportedWorkView(turn, now);
-  return (
-    <StaticStat
-      accessibleLabel={elapsed.accessibleLabel}
-      icon={<IconHourglass aria-hidden size={14} />}
-      title="Duration"
-      value={elapsed.value}
-    />
-  );
-}
-
-function useLiveNow(active: boolean) {
-  const [now, setNow] = useState(() => Date.now());
-  useEffect(() => {
-    if (!active) return undefined;
-    setNow(Date.now());
-    const interval = window.setInterval(() => setNow(Date.now()), 1_000);
-    return () => window.clearInterval(interval);
-  }, [active]);
-  return now;
-}

package/src/dashboard/react/components/ModelSettings.test.tsx

@@ -1,180 +0,0 @@
-import { MantineProvider } from '@mantine/core';
-import { act, cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { afterEach, expect, test, vi } from 'vitest';
-import { ModelSettings } from './ModelSettings';
-
-const apiMocks = vi.hoisted(() => ({ updateModelRole: vi.fn() }));
-vi.mock('../api', () => apiMocks);
-
-vi.mock('@mantine/core', async () => {
-  const { createElement } = await import('react');
-  const block = ({ children, className, 'aria-label': ariaLabel }: { children?: import('react').ReactNode; className?: string; 'aria-label'?: string }) => createElement('div', { className, 'aria-label': ariaLabel }, children);
-  return {
-    MantineProvider: block, Tooltip: block, Badge: block, Group: block, Paper: block, SimpleGrid: block, Stack: block, Text: block, Title: block,
-    Select: ({ 'aria-busy': busy, 'aria-label': label, data = [], disabled, onChange, readOnly, value }: { 'aria-busy'?: boolean; 'aria-label': string; data?: Array<string | { value: string; label: string; disabled?: boolean }>; disabled?: boolean; onChange: (value: string | null) => void; readOnly?: boolean; value: string | null }) => createElement('select', { 'aria-busy': busy, 'aria-label': label, disabled, 'aria-readonly': readOnly, value: value ?? '', onChange: (event: { currentTarget: { value: string } }) => onChange(event.currentTarget.value) }, [createElement('option', { key: '', value: '' }), ...data.map((item) => typeof item === 'string' ? createElement('option', { key: item, value: item }, item) : createElement('option', { key: item.value, value: item.value, disabled: item.disabled }, item.label))]),
-    Alert: ({ children }: { children?: import('react').ReactNode }) => createElement('div', { role: 'alert' }, children),
-    ActionIcon: ({ children, loading, onClick, 'aria-label': label, ...props }: { children?: import('react').ReactNode; loading?: boolean; onClick: () => void; 'aria-label': string; className?: string }) => createElement('button', { ...props, disabled: loading, onClick, 'aria-label': label }, children),
-  };
-});
-
-afterEach(() => { cleanup(); vi.unstubAllGlobals(); vi.clearAllMocks(); });
-
-test('shows the built-in TaskChef usage engine without an availability status', async () => {
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValue({
-    ok: true,
-    json: async () => ({
-      profiles: [],
-      usageProvider: { provider: 'TaskChef', version: '8.6.2' },
-    }),
-  }));
-  render(<MantineProvider><ModelSettings /></MantineProvider>);
-  expect(await screen.findByText('TaskChef 8.6.2')).toBeInTheDocument();
-  expect(screen.getByText('Usage provider')).toBeInTheDocument();
-  expect(screen.getByText(/TaskChef’s accounting engine/)).toBeInTheDocument();
-  expect(screen.queryByText('available')).not.toBeInTheDocument();
-});
-
-test('uses the shared dashboard content and section treatment', async () => {
-  const role = { role: 'planner', source: null, model: 'gpt-one', effort: 'low', status: 'configured', problems: [] as string[] };
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValue({
-    ok: true,
-    json: async () => ({
-      profiles: [{ id: 'personal', roles: [role], problems: [], modelOptions: [{ value: 'gpt-one', label: 'GPT One', efforts: ['low'] }] }],
-      usageProvider: { provider: 'ccusage', status: 'available', version: '20.0.21' },
-    }),
-  }));
-  const { container } = render(<MantineProvider><ModelSettings /></MantineProvider>);
-  expect(await screen.findByRole('combobox', { name: 'planner model' })).toBeInTheDocument();
-  expect(container.querySelector('[aria-label="Model settings"]')).toHaveClass('taskchef-settings');
-  expect(container.querySelector('.taskchef-settings-fields')).toBeInTheDocument();
-  expect(container.querySelectorAll('.taskchef-section')).toHaveLength(2);
-});
-
-test('refresh shows configuration failures and does not label them honored', async () => {
-  const role = { role: 'reviewer', source: '/fixture/reviewer.toml', effectiveSource: '/fixture/reviewer.toml', model: 'fixture', effort: 'low', status: 'configured', availability: 'not checked', fallback: 'inherit parent settings', problems: [] as string[] };
-  const profile = { id: 'personal', project: 'Personal', roles: [role], problems: [], catalogSource: null };
-  const fetchMock = vi.fn().mockResolvedValueOnce({ ok: true, json: async () => ({ profiles: [profile] }) })
-    .mockResolvedValueOnce({ ok: true, json: async () => ({ profiles: [{ ...profile, roles: [{ ...role, status: 'invalid', problems: ['Unsupported effort'] }] }] }) });
-  vi.stubGlobal('fetch', fetchMock);
-  render(<MantineProvider><ModelSettings /></MantineProvider>);
-  expect(await screen.findByText('configured')).toBeInTheDocument();
-  const refresh = screen.getByRole('button', { name: 'Refresh' });
-  expect(refresh).toHaveClass('taskchef-icon-button');
-  await waitFor(() => expect(refresh).toBeEnabled());
-  await act(async () => { fireEvent.click(refresh); });
-  expect(await screen.findByText('Unsupported effort')).toBeInTheDocument();
-  expect(screen.queryByText(/Requested effective settings/)).not.toBeInTheDocument();
-});
-
-test('request failure remains visible and can be retried', async () => {
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValueOnce({ ok: false }).mockResolvedValueOnce({ ok: true, json: async () => ({ profiles: [] }) }));
-  render(<MantineProvider><ModelSettings /></MantineProvider>);
-  expect(await screen.findByRole('alert')).toHaveTextContent('could not be loaded');
-  const refresh = screen.getByRole('button', { name: 'Refresh' });
-  await waitFor(() => expect(refresh).toBeEnabled());
-  await act(async () => { fireEvent.click(refresh); });
-  await waitFor(() => expect(screen.queryByRole('alert')).not.toBeInTheDocument());
-});
-
-
-test('non-string TOML values show diagnostics without crashing settings', async () => {
-  const role = { role: 'reviewer', source: '/fixture/reviewer.toml', model: { slug: 'bad' }, effort: ['bad'], status: 'invalid', availability: 'not checked', fallback: 'inherit parent settings', problems: ['model must be a nonempty string'] };
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: true, json: async () => ({ profiles: [{ id: 'personal', project: 'Personal', roles: [role], problems: [], catalogSource: null }] }) }));
-  render(<MantineProvider><ModelSettings /></MantineProvider>);
-  expect(await screen.findByText('model must be a nonempty string')).toBeInTheDocument();
-  expect(screen.getByRole('combobox', { name: 'reviewer model' })).toHaveValue('');
-  expect(screen.getByRole('combobox', { name: 'reviewer reasoning effort' })).toBeDisabled();
-});
-
-test('saves dropdown changes and displays a home-relative agent source', async () => {
-  const role = { role: 'planner', source: '/Users/example/.codex/agents/planner.toml', displaySource: '~/.codex/agents/planner.toml', model: 'gpt-one', effort: 'low', status: 'configured', problems: [] as string[] };
-  const profile = { id: 'personal', roles: [role], problems: [], modelOptions: [
-    { value: 'gpt-one', label: 'GPT One', efforts: ['low', 'high'] },
-    { value: 'gpt-two', label: 'GPT Two', efforts: ['medium'] },
-  ] };
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: true, json: async () => ({ profiles: [profile] }) }));
-  apiMocks.updateModelRole.mockResolvedValue({ profile: { ...profile, roles: [{ ...role, model: 'gpt-two', effort: 'medium' }] } });
-  render(<MantineProvider><ModelSettings /></MantineProvider>);
-  const model = await screen.findByRole('combobox', { name: 'planner model' });
-  fireEvent.change(model, { target: { value: 'gpt-two' } });
-  expect(model).toHaveValue('gpt-two');
-  expect(model).toHaveAttribute('aria-readonly', 'true');
-  expect(screen.queryByText('Saving…')).not.toBeInTheDocument();
-  await waitFor(() => expect(apiMocks.updateModelRole).toHaveBeenCalledWith('planner', 'gpt-two', 'medium'));
-  expect(await screen.findByText('Source: ~/.codex/agents/planner.toml')).toBeInTheDocument();
-});
-
-test('serializes role saves so an older response cannot replace a newer selection', async () => {
-  const planner = { role: 'planner', source: null, model: 'gpt-one', effort: 'low', status: 'configured', problems: [] as string[] };
-  const reviewer = { ...planner, role: 'reviewer' };
-  const profile = { id: 'personal', roles: [planner, reviewer], problems: [], modelOptions: [
-    { value: 'gpt-one', label: 'GPT One', efforts: ['low'] },
-    { value: 'gpt-two', label: 'GPT Two', efforts: ['medium'] },
-  ] };
-  let resolveFirst!: (value: { profile: typeof profile }) => void;
-  apiMocks.updateModelRole.mockReturnValueOnce(new Promise((resolve) => { resolveFirst = resolve; }));
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: true, json: async () => ({ profiles: [profile] }) }));
-  render(<MantineProvider><ModelSettings /></MantineProvider>);
-  const plannerModel = await screen.findByRole('combobox', { name: 'planner model' });
-  const reviewerModel = screen.getByRole('combobox', { name: 'reviewer model' });
-  fireEvent.change(plannerModel, { target: { value: 'gpt-two' } });
-  fireEvent.change(reviewerModel, { target: { value: 'gpt-two' } });
-  fireEvent.click(screen.getByRole('button', { name: 'Refresh' }));
-  expect(apiMocks.updateModelRole).toHaveBeenCalledTimes(1);
-  expect(apiMocks.updateModelRole).toHaveBeenCalledWith('planner', 'gpt-two', 'medium');
-  expect(fetch).toHaveBeenCalledTimes(1);
-  await act(async () => resolveFirst({ profile: { ...profile, roles: [{ ...planner, model: 'gpt-two', effort: 'medium' }, reviewer] } }));
-  await waitFor(() => expect(reviewerModel).toHaveAttribute('aria-readonly', 'false'));
-  apiMocks.updateModelRole.mockResolvedValueOnce({ profile: { ...profile, roles: [{ ...planner, model: 'gpt-two', effort: 'medium' }, { ...reviewer, model: 'gpt-two', effort: 'medium' }] } });
-  fireEvent.change(reviewerModel, { target: { value: 'gpt-two' } });
-  await waitFor(() => expect(apiMocks.updateModelRole).toHaveBeenCalledTimes(2));
-});
-
-const effortRole = { role: 'planner', source: null, model: 'gpt-one', effort: 'low', status: 'configured', problems: [] as string[] };
-const effortProfile = { id: 'personal', roles: [effortRole], problems: [], modelOptions: [
-  { value: 'gpt-one', label: 'GPT One', efforts: ['low', 'medium', 'high', 'xhigh', 'max', 'ultra'] },
-  { value: 'gpt-two', label: 'GPT Two', efforts: ['max', 'medium'] },
-] };
-
-test.each([['Light', 'low'], ['Medium', 'medium'], ['High', 'high'], ['Extra High', 'xhigh'], ['Ultra', 'ultra']])('saves %s as native %s and omits max choices', async (label, native) => {
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: true, json: async () => ({ profiles: [effortProfile] }) }));
-  apiMocks.updateModelRole.mockResolvedValue({ profile: { ...effortProfile, roles: [{ ...effortRole, effort: native }] } });
-  render(<ModelSettings />);
-  const effort = await screen.findByRole('combobox', { name: 'planner reasoning effort' });
-  expect(screen.getByRole('option', { name: label })).toHaveValue(native);
-  expect(screen.queryByRole('option', { name: /max/i })).not.toBeInTheDocument();
-  fireEvent.change(effort, { target: { value: native } });
-  await waitFor(() => expect(apiMocks.updateModelRole).toHaveBeenCalledWith('planner', 'gpt-one', native));
-});
-
-test('model changes filter supported efforts and never default to max', async () => {
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: true, json: async () => ({ profiles: [effortProfile] }) }));
-  apiMocks.updateModelRole.mockResolvedValue({ profile: { ...effortProfile, roles: [{ ...effortRole, model: 'gpt-two', effort: 'medium' }] } });
-  render(<ModelSettings />);
-  fireEvent.change(await screen.findByRole('combobox', { name: 'planner model' }), { target: { value: 'gpt-two' } });
-  await waitFor(() => expect(apiMocks.updateModelRole).toHaveBeenCalledWith('planner', 'gpt-two', 'medium'));
-  expect(screen.getByRole('option', { name: 'Medium' })).toHaveValue('medium');
-  expect(screen.queryByRole('option', { name: 'Light' })).not.toBeInTheDocument();
-  expect(screen.queryByRole('option', { name: /max/i })).not.toBeInTheDocument();
-});
-
-test('saved max is displayed without being selectable and survives refresh and supported model changes', async () => {
-  const profile = { ...effortProfile, roles: [{ ...effortRole, effort: 'max' }] };
-  vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: true, json: async () => ({ profiles: [profile] }) }));
-  apiMocks.updateModelRole.mockResolvedValue({ profile: { ...profile, roles: [{ ...effortRole, model: 'gpt-two', effort: 'max' }] } });
-  render(<ModelSettings />);
-  const effort = await screen.findByRole('combobox', { name: 'planner reasoning effort' });
-  expect(effort).toHaveValue('max');
-  expect(screen.getByRole('option', { name: 'Max (current setting)' })).toBeDisabled();
-  fireEvent.click(screen.getByRole('button', { name: 'Refresh' }));
-  await waitFor(() => expect(fetch).toHaveBeenCalledTimes(2));
-  expect(apiMocks.updateModelRole).not.toHaveBeenCalled();
-  await waitFor(() => expect(effort).toHaveAttribute('aria-readonly', 'false'));
-  fireEvent.change(screen.getByRole('combobox', { name: 'planner model' }), { target: { value: 'gpt-two' } });
-  await waitFor(() => expect(apiMocks.updateModelRole).toHaveBeenCalledWith('planner', 'gpt-two', 'max'));
-  await waitFor(() => expect(effort).toHaveAttribute('aria-readonly', 'false'));
-  apiMocks.updateModelRole.mockResolvedValue({ profile: { ...profile, roles: [{ ...effortRole, model: 'gpt-two', effort: 'medium' }] } });
-  fireEvent.change(effort, { target: { value: 'medium' } });
-  await waitFor(() => expect(apiMocks.updateModelRole).toHaveBeenLastCalledWith('planner', 'gpt-two', 'medium'));
-  expect(screen.queryByRole('option', { name: /max/i })).not.toBeInTheDocument();
-});

package/src/dashboard/react/components/ModelSettings.tsx

@@ -1,106 +0,0 @@
-import { ActionIcon, Alert, Badge, Group, Paper, Select, SimpleGrid, Stack, Text, Title } from '@mantine/core';
-import { IconRefresh } from '@tabler/icons-react';
-import { useEffect, useState } from 'react';
-import { updateModelRole } from '../api';
-
-const effortLabels: Record<string, string> = { low: 'Light', medium: 'Medium', high: 'High', xhigh: 'Extra High', ultra: 'Ultra' };
-
-type ModelOption = { value: string; label: string; efforts: string[] };
-type Role = { role: string; source: string | null; displaySource?: string | null; model: unknown; effort: unknown; status: string; problems: string[] };
-type Profile = { id: string; roles: Role[]; problems: string[]; modelOptions?: ModelOption[] };
-type UsageProvider = { provider: string; version: string | null };
-
-export function ModelSettings() {
-  const [profiles, setProfiles] = useState<Profile[]>([]);
-  const [usageProvider, setUsageProvider] = useState<UsageProvider | null>(null);
-  const [error, setError] = useState<string | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [saving, setSaving] = useState<string | null>(null);
-  const [showSaving, setShowSaving] = useState<string | null>(null);
-  const [revision, setRevision] = useState(0);
-  useEffect(() => {
-    const controller = new AbortController();
-    setLoading(true);
-    setError(null);
-    fetch('/api/settings', { signal: controller.signal }).then(async (response) => {
-      if (!response.ok) throw new Error('Settings preview could not be loaded.');
-      const data = await response.json() as { profiles: Profile[]; usageProvider?: UsageProvider };
-      setProfiles(data.profiles);
-      setUsageProvider(data.usageProvider ?? null);
-    }).catch((failure: Error) => {
-      if (!controller.signal.aborted) setError(failure.message);
-    }).finally(() => { if (!controller.signal.aborted) setLoading(false); });
-    return () => controller.abort();
-  }, [revision]);
-  useEffect(() => {
-    setShowSaving(null);
-    if (!saving) return;
-    const timeout = window.setTimeout(() => setShowSaving(saving), 400);
-    return () => window.clearTimeout(timeout);
-  }, [saving]);
-  const profile = profiles.find((item) => item.id === 'personal');
-  const save = async (role: Role, model: string, effort: string) => {
-    setSaving(role.role);
-    setError(null);
-    setProfiles((current) => current.map((item) => item.id !== 'personal' ? item : {
-      ...item,
-      roles: item.roles.map((candidate) => candidate.role === role.role ? { ...candidate, model, effort } : candidate),
-    }));
-    try {
-      const result = await updateModelRole(role.role, model, effort) as { profile: Profile };
-      setProfiles([result.profile]);
-    } catch (failure) {
-      setProfiles((current) => current.map((item) => item.id !== 'personal' ? item : {
-        ...item,
-        roles: item.roles.map((candidate) => candidate.role === role.role ? role : candidate),
-      }));
-      setError(failure instanceof Error ? failure.message : 'Model role could not be saved.');
-    } finally {
-      setSaving(null);
-    }
-  };
-  return <Stack className="taskchef-settings" gap="sm" aria-label="Model settings">
-    <Group justify="space-between">
-      <Title order={2} size="h5">Model roles</Title>
-      <ActionIcon aria-label="Refresh" aria-busy={loading} aria-disabled={loading || saving !== null} className="taskchef-icon-button" color="gray" variant="subtle" size="lg" onClick={() => {
-        if (loading || saving) return;
-        setLoading(true);
-        setRevision((value) => value + 1);
-      }}><IconRefresh className={loading ? 'taskchef-refresh-spinning' : undefined} size={18} stroke={1.8} /></ActionIcon>
-    </Group>
-    <Text c="dimmed" size="sm">Your models for orchestration, planning, implementation, and review.</Text>
-    {error && <Alert color="red" role="alert">{error}</Alert>}
-    {profile && <>
-      {profile.problems.map((problem) => <Alert color="yellow" key={problem}>{problem}</Alert>)}
-      {profile.roles.map((role) => <Paper className="taskchef-section" key={role.role} withBorder p="sm">
-        <Stack gap="xs">
-          <Group justify="space-between"><Title order={3} size="h5" tt="capitalize">{role.role}</Title><Badge color={['invalid', 'unavailable'].includes(role.status) ? 'red' : role.status === 'missing' ? 'gray' : 'teal'}>{role.status}</Badge></Group>
-          <SimpleGrid className="taskchef-settings-fields" cols={2}>
-            <Select label="Model" aria-label={`${role.role} model`} aria-busy={loading || saving !== null} data={profile.modelOptions ?? []} value={typeof role.model === 'string' ? role.model : null} readOnly={loading || saving !== null} allowDeselect={false} searchable onChange={(model) => {
-              if (loading || saving || !model) return;
-              const option = profile.modelOptions?.find((candidate) => candidate.value === model);
-              const effort = typeof role.effort === 'string' && option?.efforts.includes(role.effort) ? role.effort : option?.efforts.find((value) => value !== 'max');
-              if (effort) void save(role, model, effort);
-            }} />
-            <Select label="Reasoning effort" aria-label={`${role.role} reasoning effort`} aria-busy={loading || saving !== null} data={[
-              ...(profile.modelOptions?.find((option) => option.value === role.model)?.efforts ?? []).filter((value) => value !== 'max').map((value) => ({ value, label: effortLabels[value] ?? value })),
-              ...(role.effort === 'max' ? [{ value: 'max', label: 'Max (current setting)', disabled: true }] : []),
-            ]} value={typeof role.effort === 'string' ? role.effort : null} disabled={typeof role.model !== 'string'} readOnly={loading || saving !== null} allowDeselect={false} onChange={(effort) => {
-              if (!loading && !saving && effort && effort !== 'max' && typeof role.model === 'string') void save(role, role.model, effort);
-            }} />
-          </SimpleGrid>
-          <Text size="sm" style={{ overflowWrap: 'anywhere' }}>Source: {role.displaySource ?? role.source ?? 'No role file'}</Text>
-          {showSaving === role.role && <Text c="dimmed" size="sm" role="status">Saving…</Text>}
-          {role.problems.map((problem) => <Alert key={problem} color="red">{problem}</Alert>)}
-        </Stack>
-      </Paper>)}
-    </>}
-    {usageProvider && <Paper className="taskchef-section" withBorder p="sm">
-      <Stack gap="xs">
-        <Title order={3} size="h5">Usage provider</Title>
-        <Text size="sm">{usageProvider.provider}{usageProvider.version ? ` ${usageProvider.version}` : ' version unavailable'}</Text>
-        <Text c="dimmed" size="sm">Reads saved Codex usage with TaskChef’s accounting engine.</Text>
-      </Stack>
-    </Paper>}
-  </Stack>;
-}

package/src/dashboard/react/components/NotificationCenter.test.tsx

@@ -1,76 +0,0 @@
-import { MantineProvider } from "@mantine/core";
-import { cleanup, fireEvent, render, screen } from "@testing-library/react";
-import { afterEach, expect, test, vi } from "vitest";
-import { fixtureTask } from "../fixtures";
-import type { NotificationSnapshot } from "../types";
-import { NotificationCenter } from "./NotificationCenter";
-
-const notification: NotificationSnapshot = {
-  id: "task-completed",
-  taskId: "11111111-1111-4111-8111-111111111111",
-  title: "Review checkout reconciliation",
-  status: "completed",
-  event: "completed",
-  turnRef: "turn-one",
-  turnId: null,
-  timestamp: "2026-08-30T08:10:00.000Z",
-  summary: "Review completed.",
-};
-
-afterEach(() => {
-  cleanup();
-  vi.useRealTimers();
-});
-
-test("notification portal stays non-modal until the operator chooses an action", () => {
-  vi.useFakeTimers();
-  vi.setSystemTime(new Date("2026-08-30T12:10:00.000Z"));
-  const onOpen = vi.fn();
-  const onDismiss = vi.fn();
-  render(
-    <MantineProvider>
-      <button autoFocus type="button">Detail action</button>
-      <NotificationCenter
-        notifications={[notification]}
-        onClear={() => {}}
-        onDismiss={onDismiss}
-        onOpen={onOpen}
-        tasks={[fixtureTask()]}
-      />
-    </MantineProvider>,
-  );
-  expect(screen.getByRole("button", { name: "Detail action" })).toHaveFocus();
-  const panel = screen.getByRole("region", { name: "Task notifications" });
-  expect(panel).toBeVisible();
-  expect(panel.querySelector(".taskchef-notification-list")).toBeInTheDocument();
-  expect(screen.getByRole("button", { name: /Open current task details/ })).toHaveAccessibleDescription(
-    /Review completed\. \d+ hours ago/,
-  );
-  expect(panel.nextElementSibling).toHaveTextContent(
-    /Task completed\. Review checkout reconciliation\. Review completed\. Turn ref turn-one\. \d+ hours ago\./,
-  );
-  fireEvent.click(screen.getByRole("button", { name: /Open current task details/ }));
-  expect(onOpen).toHaveBeenCalledWith(notification);
-  fireEvent.click(screen.getByRole("button", { name: /Dismiss Task completed notification/ }));
-  expect(onDismiss).toHaveBeenCalledWith(notification);
-});
-
-test("can render inside a focus-trapped task detail", () => {
-  render(
-    <MantineProvider>
-      <div data-testid="detail-dialog">
-        <NotificationCenter
-          notifications={[notification]}
-          onClear={() => {}}
-          onDismiss={() => {}}
-          onOpen={() => {}}
-          tasks={[fixtureTask()]}
-          withinPortal={false}
-        />
-      </div>
-    </MantineProvider>,
-  );
-  expect(screen.getByTestId("detail-dialog")).toContainElement(
-    screen.getByRole("region", { name: "Task notifications" }),
-  );
-});

package/src/dashboard/react/components/NotificationCenter.tsx

@@ -1,111 +0,0 @@
-import { ActionIcon, Box, Button, Group, Paper, Portal, ScrollArea, Stack, Text, Tooltip } from "@mantine/core";
-import { IconBell, IconX } from "@tabler/icons-react";
-import { notificationDismissLabel, notificationOpenLabel, notificationTitle } from "../../state.js";
-import { formatExactTime, formatRelativeTime } from "../../time.js";
-import type { NotificationSnapshot, Task } from "../types";
-import { StatusBadge } from "./StatusBadge";
-
-export function NotificationCenter({
-  notifications,
-  announcements = notifications,
-  onClear,
-  onDismiss,
-  onOpen,
-  tasks,
-  withinPortal = true,
-}: {
-  announcements?: NotificationSnapshot[];
-  notifications: NotificationSnapshot[];
-  onClear: () => void;
-  onDismiss: (notification: NotificationSnapshot) => void;
-  onOpen: (notification: NotificationSnapshot) => void;
-  tasks: Task[];
-  withinPortal?: boolean;
-}) {
-  if (notifications.length === 0) return null;
-  const content = (
-    <>
-      <Paper
-        aria-label="Task notifications"
-        className="taskchef-notifications"
-        p="sm"
-        radius="md"
-        role="region"
-        shadow="xl"
-        withBorder
-      >
-        <Group justify="space-between" mb="xs">
-          <Group gap={6}>
-            <IconBell aria-hidden size={16} />
-            <Text fw={700} size="sm">Updates</Text>
-          </Group>
-          <Button onClick={onClear} size="compact-xs" variant="subtle">Clear all</Button>
-        </Group>
-        <ScrollArea.Autosize className="taskchef-notification-scroll" mah="min(55vh, 520px)" type="auto">
-          <Stack className="taskchef-notification-list" gap={6}>
-            {notifications.map((notification) => {
-              const available = tasks.some((task) => task.id === notification.taskId);
-              const descriptionId = `notification-${Math.abs(hash(notification.id))}`;
-              const summaryId = `${descriptionId}-summary`;
-              const metadataId = `${descriptionId}-metadata`;
-              return (
-                <Paper className="taskchef-notification" key={notification.id} p="xs" radius="sm">
-                  <Group align="flex-start" gap="xs" wrap="nowrap">
-                    <button
-                      aria-describedby={[notification.summary ? summaryId : null, metadataId].filter(Boolean).join(" ")}
-                      aria-label={notificationOpenLabel(notification, available)}
-                      className="taskchef-notification-open"
-                      onClick={() => onOpen(notification)}
-                      type="button"
-                    >
-                      <Group gap="xs" justify="space-between" wrap="nowrap">
-                        <Text fw={700} size="sm">{notificationTitle(notification)}</Text>
-                        <StatusBadge status={notification.status} />
-                      </Group>
-                      <Text lineClamp={1} size="sm">{notification.title}</Text>
-                      {notification.summary && <Text className="taskchef-preserve-lines" id={summaryId} lineClamp={3} size="xs">{notification.summary}</Text>}
-                      <Text c="dimmed" id={metadataId} size="xs">
-                        <Tooltip label={formatExactTime(notification.timestamp)}><span>{formatRelativeTime(notification.timestamp)}</span></Tooltip>{available ? "" : " · Task no longer available"}
-                      </Text>
-                    </button>
-                    <Tooltip label="Dismiss notification">
-                      <ActionIcon
-                        aria-label={notificationDismissLabel(notification)}
-                        color="gray"
-                        onClick={() => onDismiss(notification)}
-                        size="compact-sm"
-                        variant="subtle"
-                      >
-                        <IconX aria-hidden size={14} />
-                      </ActionIcon>
-                    </Tooltip>
-                  </Group>
-                </Paper>
-              );
-            })}
-          </Stack>
-        </ScrollArea.Autosize>
-      </Paper>
-      <Box aria-atomic="true" aria-live="polite" className="taskchef-visually-hidden" role="status">
-        {announcements.map(notificationAnnouncement).join(" ")}
-      </Box>
-    </>
-  );
-  return withinPortal ? <Portal>{content}</Portal> : content;
-}
-
-function notificationAnnouncement(notification: NotificationSnapshot) {
-  return [
-    notificationTitle(notification),
-    notification.title,
-    notification.summary,
-    notification.turnRef ? `Turn ref ${notification.turnRef}` : null,
-    formatRelativeTime(notification.timestamp),
-  ].filter(Boolean).map((part) => String(part).replace(/[.\s]+$/, "")).join(". ") + ".";
-}
-
-function hash(value: string) {
-  let result = 0;
-  for (const character of value) result = ((result << 5) - result + character.charCodeAt(0)) | 0;
-  return result;
-}

package/src/dashboard/react/components/PullRequestBadges.tsx

@@ -1,18 +0,0 @@
-import { Badge, Group } from "@mantine/core";
-import { IconGitMerge, IconGitPullRequest, IconGitPullRequestDraft } from "@tabler/icons-react";
-import type { PullRequestStatus } from "../types";
-
-export function PullRequestBadges({ pullRequests = [] }: { pullRequests?: PullRequestStatus[] }) {
-  if (!pullRequests.length) return null;
-  return <Group gap={4} wrap="wrap" aria-label="Attached pull requests">
-    {pullRequests.map((pr) => {
-      const merged = pr.state === "merged";
-      const draft = pr.state === "draft";
-      const label = merged ? "Merged" : draft ? "Draft" : pr.state === "closed" ? "Closed, not merged" : pr.state === "unknown" ? "Status unavailable" : pr.checks === "passed" ? "Checks passed" : pr.checks === "none" ? "No checks" : pr.checks === "pending" ? "Checks pending" : pr.checks === "failed" ? "Checks failed" : "Checks unavailable";
-      const Icon = merged ? IconGitMerge : draft ? IconGitPullRequestDraft : IconGitPullRequest;
-      const color = merged ? "violet" : draft || pr.state === "unknown" ? "gray" : pr.state === "closed" || pr.checks === "failed" ? "red" : pr.checks === "passed" ? "green" : "yellow";
-      const safeLink = /^https:\/\/github\.com\/[A-Za-z0-9-]+\/[A-Za-z0-9_.-]+\/pull\/[1-9]\d*\/?$/.test(pr.url);
-      return <Badge key={pr.url} component="a" href={safeLink ? pr.url : undefined} target="_blank" rel="noopener noreferrer" variant="light" color={color} size="xs" leftSection={<Icon size={12} aria-hidden />} title={`${pr.url}\n${label}${pr.error ? `: ${pr.error}` : ""}${pr.checkedAt ? `\nChecked ${new Date(pr.checkedAt).toLocaleString()}` : ""}`} style={{ cursor: "pointer", textTransform: "none", maxWidth: "100%" }}>#{pr.url.match(/\/pull\/(\d+)/)?.[1] ?? "PR"} · {label}</Badge>;
-    })}
-  </Group>;
-}