feat(v2): task board, lifted from the d215 frame

frontend/src/i18n/__tests__/zhNumberUnitSpacing.test.ts

@@ -44,6 +44,8 @@ const OPAQUE_PLACEHOLDERS = [
   // common.aboutPage receives a page title, currently Latin, not a count.
   'adapter', 'title',
   'holder', 'actor',
+  // board.card.needs names the task a blocked card waits on (TASK-123), not a count.
+  'dep',
   // Runtime ownership names the visible blocking Pods and installers.
   'blockers', 'harness', 'effort', 'model',
   // runTrace.served names the requested and the answering model groups.

frontend/src/i18n/locales/en.json

@@ -1513,6 +1513,10 @@
     "title": "Board",
     "backToChat": "Back to chat",
     "newTask": "New task",
+    "addTo": "Add to {{column}}",
+    "card": {
+      "needs": "Needs {{dep}}"
+    },
     "taskCount_one": "{{count}} task",
     "taskCount_other": "{{count}} tasks",
     "focus": {
@@ -1592,7 +1596,9 @@
       "saveError": "Could not save this change. Try again.",
       "statusLabel": "Status",
       "showEarlierUpdates": "Show {{count}} earlier updates",
-      "hideEarlierUpdates": "Hide earlier updates"
+      "hideEarlierUpdates": "Hide earlier updates",
+      "depends": "Depends on",
+      "noDeps": "None"
     },
     "form": {
       "title": "Title",

frontend/src/i18n/locales/zh-CN.json

@@ -1506,6 +1506,10 @@
     "title": "看板",
     "backToChat": "返回聊天",
     "newTask": "新建任务",
+    "addTo": "添加到{{column}}",
+    "card": {
+      "needs": "依赖 {{dep}}"
+    },
     "taskCount_other": "{{count}}个任务",
     "focus": {
       "eyebrow": "Pod 方向",
@@ -1584,7 +1588,9 @@
       "saveError": "未能保存更改，请重试。",
       "statusLabel": "状态",
       "showEarlierUpdates": "显示{{count}}条更早的更新",
-      "hideEarlierUpdates": "隐藏更早的更新"
+      "hideEarlierUpdates": "隐藏更早的更新",
+      "depends": "依赖",
+      "noDeps": "无"
     },
     "form": {
       "title": "标题",

frontend/src/v2/__tests__/V2PodBoard.test.tsx

@@ -711,11 +711,47 @@ test('detail status is a segment that moves the task, and older updates fold beh
   expect(within(segment).getByRole('radio', { name: 'Pending' })).toHaveAttribute('aria-checked', 'true');
   fireEvent.click(within(segment).getByRole('radio', { name: /in progress/i }));
   await waitFor(() => expect(axios.patch).toHaveBeenCalledWith('/api/v1/tasks/pod-1/TASK-5', { status: 'claimed' }, expect.any(Object)));
-  // Newest three show; the two oldest fold behind the toggle.
+  // Newest two show, as the d215 frame draws; the three oldest fold behind the toggle.
   expect(within(dialog).queryByText('one')).toBeNull();
-  expect(within(dialog).queryByText('two')).toBeNull();
+  expect(within(dialog).queryByText('three')).toBeNull();
+  expect(within(dialog).getByText('four')).toBeInTheDocument();
   expect(within(dialog).getByText('five')).toBeInTheDocument();
-  fireEvent.click(within(dialog).getByRole('button', { name: 'Show 2 earlier updates' }));
+  fireEvent.click(within(dialog).getByRole('button', { name: 'Show 3 earlier updates' }));
   expect(within(dialog).getByText('one')).toBeInTheDocument();
   expect(within(dialog).getByRole('button', { name: 'Hide earlier updates' })).toHaveAttribute('aria-expanded', 'true');
 });
+
+// S4 (d215 frame): the marks and keys the frame draws.
+test('Add to Pending opens the one create dialog, and the card marks name what they show', async () => {
+  wireAxios([
+    { taskId: 'TASK-2', title: 'Open work', status: 'pending', updates: [] },
+    { taskId: 'TASK-3', title: 'Waiting work', status: 'blocked', dep: 'TASK-2', updates: [] },
+    { taskId: 'TASK-4', title: 'Waiting on nothing named', status: 'blocked', updates: [] },
+  ]);
+  renderBoard();
+  const pending = await screen.findByRole('region', { name: 'Pending' });
+
+  // An open card carries the frame's hollow ring, named, with no visible text.
+  expect(within(pending).getByRole('img', { name: 'Not claimed' })).toBeInTheDocument();
+  expect(screen.getByTitle('TASK-2')).not.toHaveTextContent('Not claimed');
+  // A blocked card shows what it waits on only when the task records it.
+  const blocked = screen.getByRole('region', { name: 'Blocked' });
+  expect(within(blocked).getByRole('img', { name: 'Needs TASK-2' })).toBeInTheDocument();
+  expect(within(blocked).getAllByRole('img')).toHaveLength(1);
+  // Hover keys are icon-only and keep their words as names.
+  expect(within(pending).getByRole('button', { name: 'Start' })).toHaveAttribute('title', 'Start');
+
+  fireEvent.click(within(pending).getByRole('button', { name: 'Add to Pending' }));
+  expect(screen.getByRole('dialog', { name: 'New task' })).toBeInTheDocument();
+});
+
+test('the drawer heads with the id and badge, titles in the body, and lists what the task depends on', async () => {
+  wireAxios([{ taskId: 'TASK-3', title: 'Waiting work', priority: 'P1', status: 'blocked', dep: 'TASK-2', watchers: [], updates: [] }]);
+  renderBoard();
+  fireEvent.click(await screen.findByTitle('TASK-3'));
+  const dialog = screen.getByRole('dialog', { name: 'Waiting work' });
+  expect(within(dialog).getByRole('heading', { level: 2, name: 'Waiting work' })).toBeInTheDocument();
+  expect(within(dialog).getByText('Depends on')).toBeInTheDocument();
+  expect(within(dialog).getByText('TASK-2')).toBeInTheDocument();
+  expect(within(dialog).getByRole('button', { name: 'Close' })).toHaveAttribute('title', 'Close');
+});

frontend/src/v2/__tests__/signalTokens.test.ts

@@ -120,6 +120,7 @@ describe('dark-safe surfaces (TASK-681)', () => {
     });
   });
   test('the board drawer scrim is --v2-scrim', () => {
-    expect(rd('../v2.css')).toMatch(/\.v2-board__overlay\s*\{\s*background:\s*var\(--v2-scrim\)/);
+    // S4: the board's rules live in its own sheet; the scrim backs the phone sheet.
+    expect(rd('../components/V2PodBoard.css')).toMatch(/\.v2-board__overlay\s*\{\s*background:\s*var\(--v2-scrim\)/);
   });
 });