@joekytc/dsh-swarm 0.1.0

package/client/KanbanBoard.tsx

@@ -0,0 +1,168 @@
+import { useEffect, useMemo, useRef, useState } from 'react';
+import type { BoardState, Handoff, Task } from '../src/domain/types.js';
+import type { BoardClientSnapshot } from './board-store.js';
+import { deriveWorkflowBoard, type ChainFilter } from './workflow-model.js';
+import { WorkflowRail } from './WorkflowRail.js';
+import { TaskDrawer } from './TaskDrawer.js';
+
+/** 折叠面板默认全打开（用户决策）：只记录用户手动折叠的链路（collapsed 集合），未折叠即展开。 */
+function defaultCollapsed(): Set<string> { return new Set(); }
+
+/** T26/T27/T32：列表（多链路垂直轨道）↔ 原位任务详情切换；归档筛选、详情未读提示、乐观操作失败回滚后的可重试错误。
+ *  折叠面板默认全打开：collapsed 集合只含用户手动折叠的链路，新链路默认展开。 */
+export function KanbanBoard(props: {
+  snapshot: BoardClientSnapshot;
+  postAction(action: unknown): Promise<unknown>;
+  /** purge 类操作无事件流，成功后需重拉权威快照。 */
+  onResync?(): Promise<void>;
+}) {
+  const { board } = props.snapshot;
+  const [collapsed, setCollapsed] = useState<Set<string>>(() => defaultCollapsed());
+  const [query, setQuery] = useState('');
+  const [statusFilter, setStatusFilter] = useState<Set<ChainFilter>>(new Set());
+  const [selectedId, setSelectedId] = useState<string | null>(() => history.state?.kanbanTaskId ?? null);
+  const [failedAction, setFailedAction] = useState<{ taskId: string; action: unknown } | null>(null);
+  const listRef = useRef<HTMLDivElement>(null);
+  const saved = useRef<{ collapsed: string[]; scrollTop: number }>({ collapsed: [], scrollTop: 0 });
+  const snapshotRef = useRef(props.snapshot);
+  snapshotRef.current = props.snapshot;
+  const detailOpenedSeq = useRef<number | null>(null);
+
+  useEffect(() => {
+    const onPop = () => {
+      const id = history.state?.kanbanTaskId ?? null;
+      detailOpenedSeq.current = id ? snapshotRef.current.lastSeq : null;
+      setSelectedId(id);
+      if (!id) {
+        setCollapsed(new Set(saved.current.collapsed));
+        requestAnimationFrame(() => { if (listRef.current) listRef.current.scrollTop = saved.current.scrollTop; });
+      }
+    };
+    window.addEventListener('popstate', onPop);
+    return () => window.removeEventListener('popstate', onPop);
+  }, []);
+
+  useEffect(() => {
+    const onKey = (e: KeyboardEvent) => {
+      if (e.key === 'Escape' && selectedId) history.back();
+    };
+    window.addEventListener('keydown', onKey);
+    return () => window.removeEventListener('keydown', onKey);
+  }, [selectedId]);
+
+  const views = useMemo(
+    () => (board ? deriveWorkflowBoard(board, { selectedTaskId: selectedId, now: Date.now(), statusFilter }) : []),
+    [board, selectedId, statusFilter],
+  );
+
+  const runAction = async (action: unknown) => {
+    try {
+      await props.postAction(action);
+    } catch {
+      const a = action as { taskId?: string };
+      setFailedAction({ taskId: a.taskId ?? '', action });
+    }
+  };
+
+  /** 状态筛选：多选并集；再次点击取消选中。 */
+  const toggleFilter = (f: ChainFilter) => {
+    setStatusFilter((current) => {
+      const next = new Set(current);
+      if (next.has(f)) next.delete(f); else next.add(f);
+      return next;
+    });
+  };
+
+  /** 折叠面板：点击链路标题切换折叠/展开（默认全打开，collapsed 记录手动折叠的链路）。 */
+  const toggleChain = (chainId: string) => {
+    setCollapsed((current) => {
+      const next = new Set(current);
+      if (next.has(chainId)) next.delete(chainId); else next.add(chainId);
+      return next;
+    });
+  };
+
+  if (!board) {
+    return <div className="dsh-kb-loading">加载看板…</div>;
+  }
+
+  const selectedView = selectedId
+    ? views.flatMap((v) => v.tasks).find((v) => v.task.id === selectedId) ?? null
+    : null;
+
+  if (selectedView) {
+    const task: Task = selectedView.task;
+    const chain = board.chains.get(task.chainId)!;
+    const specCard = chain.specCardId ? board.specCards.get(chain.specCardId) ?? null : null;
+    const handoff = board.handoffs.get(task.id) ?? null;
+    const parentHandoffs: Handoff[] = task.parents
+      .map((id) => board.handoffs.get(id))
+      .filter((h): h is Handoff => h !== undefined);
+    const parentTasks: Task[] = task.parents
+      .map((id) => board.tasks.get(id))
+      .filter((t): t is Task => t !== undefined);
+    const chainTasks = views.find((v) => v.chain.id === task.chainId)?.tasks ?? [];
+    const selectedIndex = chainTasks.findIndex((v) => v.task.id === task.id);
+    const related = chainTasks.filter((v) => v.related).map((v) => v.task);
+    const upstream = related.filter((t) => chainTasks.findIndex((v) => v.task.id === t.id) < selectedIndex);
+    const downstream = related.filter((t) => chainTasks.findIndex((v) => v.task.id === t.id) > selectedIndex);
+    // T32：详情打开后到达的该任务新事件 → 头部未读提示，不自动切换 tab/列表
+    const unreadCount = board.events.filter((e) => e.taskId === task.id && e.seq > (detailOpenedSeq.current ?? props.snapshot.lastSeq)).length;
+    return (
+      <TaskDrawer
+        task={task}
+        chain={chain}
+        events={board.events}
+        handoff={handoff}
+        parentHandoffs={parentHandoffs}
+        parentTasks={parentTasks}
+        specCard={specCard}
+        upstream={upstream}
+        downstream={downstream}
+        unreadCount={unreadCount}
+        actionError={props.snapshot.actionError}
+        readOnly={task.status === 'archived'}
+        onRetry={failedAction && failedAction.taskId === task.id ? () => void runAction(failedAction.action) : undefined}
+        onComment={(body) => void runAction({ type: 'comment', taskId: task.id, body })}
+        onAction={(action) => void runAction(action)}
+        onClose={() => history.back()}
+      />
+    );
+  }
+
+  const openTask = (taskId: string) => {
+    detailOpenedSeq.current = props.snapshot.lastSeq;
+    saved.current = { collapsed: [...collapsed], scrollTop: listRef.current?.scrollTop ?? 0 };
+    history.pushState({ ...history.state, kanbanTaskId: taskId }, '');
+    setSelectedId(taskId);
+  };
+
+  return (
+    <div className="dsh-kb-tab-body" ref={listRef}>
+      <div className="dsh-kb-toolbar">
+        <input
+          aria-label="搜索链路"
+          value={query}
+          onChange={(e) => setQuery(e.target.value)}
+          placeholder="搜索链路/任务"
+        />
+      </div>
+      <WorkflowRail
+        chains={views}
+        collapsedChainIds={collapsed}
+        query={query}
+        statusFilter={statusFilter}
+        onToggleFilter={toggleFilter}
+        onToggleChain={toggleChain}
+        onOpenTask={openTask}
+        onConfirmAudit={(chainId) => void runAction({ type: 'confirm-audit', chainId })}
+        onRenameChain={(chainId, title) => void runAction({ type: 'rename', chainId, title })}
+        onDeleteChain={async (chainId) => {
+          // 直连 postAction：失败 throw 上抛删除弹窗展示（runAction 吞错仅服务 TaskDrawer 重试条）
+          await props.postAction({ type: 'delete', chainId });
+          await props.onResync?.();
+        }}
+      />
+    </div>
+  );
+}

package/client/KanbanTab.tsx

@@ -0,0 +1,26 @@
+import { useEffect, useMemo } from 'react';
+import { createBoardStore, type BoardStore } from './board-store.js';
+import { useKanbanBoard } from './useKanbanBoard.js';
+import { KanbanBoard } from './KanbanBoard.js';
+import { ConnectionBanner } from './ConnectionBanner.js';
+
+/** T30：会话中心 conversation.view 第三个 tab（对话→轨迹→看板）。全高布局，无浮层/拖拽/宽度记忆。 */
+export function KanbanTab(props: { store?: BoardStore } = {}) {
+  const own = useMemo(() => props.store ?? createBoardStore(), [props.store]);
+  const snapshot = useKanbanBoard(own);
+
+  useEffect(() => {
+    if (props.store) return;
+    void own.start();
+    return () => { own.stop(); };
+  }, [own, props.store]);
+
+  return (
+    <div className="dsh-kb-tab" role="region" aria-label="看板">
+      <ConnectionBanner connection={snapshot.connection} lastSuccessAt={snapshot.lastSuccessAt} onRetry={() => void own.retry()} />
+      {snapshot.board
+        ? <KanbanBoard snapshot={snapshot} postAction={(action) => own.postAction(action)} onResync={() => own.retry()} />
+        : <div className="dsh-kb-loading">加载看板…</div>}
+    </div>
+  );
+}

package/client/RenameModal.tsx

@@ -0,0 +1,38 @@
+import { useState } from 'react';
+
+/** T7：轻量改名弹窗（链标题/任务卡标题共用；GUI 仅 human）。内联实现，无额外依赖。 */
+export function RenameModal(props: { title: string; initialValue: string; onSave(title: string): void; onCancel(): void }) {
+  const [value, setValue] = useState(props.initialValue);
+  const save = () => {
+    const next = value.trim();
+    if (next) props.onSave(next);
+  };
+  return (
+    <div className="dsh-kb-rename-overlay" onClick={(e) => { e.stopPropagation(); props.onCancel(); }}>
+      <div
+        className="dsh-kb-rename-modal"
+        role="dialog"
+        aria-modal="true"
+        aria-label={props.title}
+        onClick={(e) => e.stopPropagation()}
+      >
+        <div className="dsh-kb-rename-modal__label">{props.title}</div>
+        <input
+          className="dsh-kb-rename-modal__input"
+          aria-label={props.title}
+          value={value}
+          autoFocus
+          onChange={(e) => setValue(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === 'Enter') save();
+            if (e.key === 'Escape') props.onCancel();
+          }}
+        />
+        <div className="dsh-kb-rename-modal__actions">
+          <button type="button" className="dsh-kb-rename-cancel" onClick={props.onCancel}>取消</button>
+          <button type="button" className="dsh-kb-rename-save" onClick={save}>保存</button>
+        </div>
+      </div>
+    </div>
+  );
+}

package/client/TaskDrawer.tsx

@@ -0,0 +1,212 @@
+import { useState } from 'react';
+import type { Chain, Handoff, KanbanEvent, SpecCard, Task } from '../src/domain/types.js';
+import { statusLabelOf } from './workflow-model.js';
+
+const ROLE_NAME: Record<Task['assignee'], string> = {
+  v: 'orchestrator', p: 'planner', w: 'wiki-bridge', d: 'fullstack-dev', pt: 'plan-review', dt: 'impl-review',
+};
+
+const TABS = [
+  ['overview', '概览'], ['timeline', '轨迹'], ['handoff', '交接'], ['spec', '规格'], ['comments', '评论'],
+] as const;
+
+function formatValue(value: unknown): string {
+  if (Array.isArray(value)) return value.map(String).join(', ');
+  if (typeof value === 'object' && value !== null) return JSON.stringify(value);
+  return String(value ?? '');
+}
+
+function formatTime(at: number): string {
+  return new Date(at).toLocaleString();
+}
+
+/** T27/T32：原位任务详情，固定五区；未读提示、乐观操作失败重试、破坏性操作二次确认。 */
+export function TaskDrawer(props: {
+  task: Task;
+  chain: Chain;
+  events: KanbanEvent[];
+  handoff: Handoff | null;
+  parentHandoffs: Handoff[];
+  parentTasks?: Task[];
+  specCard: SpecCard | null;
+  upstream: Task[];
+  downstream: Task[];
+  unreadCount?: number;
+  actionError?: { taskId: string; message: string } | null;
+  readOnly?: boolean;
+  onRetry?: () => void;
+  onComment(body: string): void;
+  onAction(action: { type: string; taskId: string; reason?: string; summary?: string; metadata?: Record<string, unknown>; body?: string }): void;
+  onClose(): void;
+}) {
+  const { task, events, handoff, specCard, chain } = props;
+  const [tab, setTab] = useState<string>('overview');
+  const [pending, setPending] = useState<{ kind: 'block' | 'complete' | 'archive'; value: string } | null>(null);
+  const timeline = events.filter((e) => e.taskId === task.id).toSorted((a, b) => a.seq - b.seq);
+  const comments = timeline.filter((e) => e.kind === 'task/commented');
+  const submitComment = (el: HTMLInputElement) => {
+    const value = el.value.trim();
+    if (!value) return;
+    props.onComment(value);
+    el.value = '';
+  };
+  const arm = (kind: 'block' | 'complete' | 'archive') => {
+    setPending({ kind, value: '' });
+    if (kind === 'archive') {
+      window.setTimeout(() => setPending((current) => (current?.kind === 'archive' ? null : current)), 3000);
+    }
+  };
+  // T32 fix：complete/block 服务端强制要求 summary/reason，在确认态内联收集，避免 400 后永久失败
+  const submitPayload = (kind: 'block' | 'complete') => {
+    if (pending?.kind !== kind || !pending.value.trim()) return;
+    const value = pending.value;
+    setPending(null);
+    if (kind === 'block') props.onAction({ type: 'block', taskId: task.id, reason: value });
+    else props.onAction({ type: 'complete', taskId: task.id, summary: value });
+  };
+  const submitArchive = () => {
+    if (pending?.kind !== 'archive') return;
+    setPending(null);
+    props.onAction({ type: 'archive', taskId: task.id });
+  };
+  return (
+    <div className="dsh-kb-detail">
+      <header className="dsh-kb-detail__header">
+        <button type="button" aria-label="返回任务列表" onClick={props.onClose}>←</button>
+        <span className={`dsh-kb-profile dsh-kb-profile--${task.assignee}`}>{task.assignee.toUpperCase()}</span>
+        <div className="dsh-kb-detail__identity">
+          <strong>{task.title}</strong>
+          <span>{task.id} · {task.mode} · attempt {task.attempts + 1}</span>
+        </div>
+        {props.unreadCount ? (
+          <button type="button" className="dsh-kb-unread" onClick={() => setTab('timeline')}>{props.unreadCount} 条新更新</button>
+        ) : null}
+        {!props.readOnly && (
+          <div className="dsh-kb-detail__actions">
+          {task.status === 'running' && <button type="button" onClick={() => arm('complete')}>完成</button>}
+          {task.status === 'running' && <button type="button" onClick={() => arm('block')}>阻塞</button>}
+          {task.status === 'blocked' && <button type="button" onClick={() => props.onAction({ type: 'unblock', taskId: task.id })}>解除阻塞</button>}
+          {task.status === 'failed' && <button type="button" onClick={() => props.onAction({ type: 'retry', taskId: task.id })}>重试</button>}
+          {['done', 'failed', 'blocked'].includes(task.status) && (
+            <button type="button" data-confirming={pending?.kind === 'archive' || undefined} onClick={pending?.kind === 'archive' ? submitArchive : () => arm('archive')}>
+              {pending?.kind === 'archive' ? '确认归档' : '归档'}
+            </button>
+          )}
+          {pending?.kind === 'complete' && (
+            <span className="dsh-kb-action-form">
+              <input aria-label="交接摘要" value={pending.value} onChange={(e) => setPending({ kind: 'complete', value: e.target.value })} placeholder="交接摘要" />
+              <button type="button" disabled={!pending.value.trim()} onClick={() => submitPayload('complete')}>确认完成</button>
+              <button type="button" onClick={() => setPending(null)}>取消</button>
+            </span>
+          )}
+          {pending?.kind === 'block' && (
+            <span className="dsh-kb-action-form">
+              <input aria-label="阻塞原因" value={pending.value} onChange={(e) => setPending({ kind: 'block', value: e.target.value })} placeholder="阻塞原因" />
+              <button type="button" disabled={!pending.value.trim()} onClick={() => submitPayload('block')}>确认阻塞</button>
+              <button type="button" onClick={() => setPending(null)}>取消</button>
+            </span>
+          )}
+          </div>
+        )}
+      </header>
+      {props.actionError?.taskId === task.id && (
+        <div className="dsh-kb-action-error" role="alert">
+          <span>操作失败：{props.actionError.message}</span>
+          {props.onRetry && <button type="button" onClick={props.onRetry}>重试操作</button>}
+        </div>
+      )}
+      <div role="tablist" aria-label="任务详情">
+        {TABS.map(([id, label]) => (
+          <button key={id} type="button" role="tab" aria-selected={tab === id} onClick={() => setTab(id)}>{label}</button>
+        ))}
+      </div>
+      {tab === 'overview' && (
+        <section role="tabpanel">
+          <h4>Workflow 上下文</h4>
+          <p>{props.upstream.at(-1)?.title ?? '无上游'} → {task.title} → {props.downstream[0]?.title ?? '无下游'}</p>
+          <dl>
+            <dt>Profile</dt><dd>{task.assignee.toUpperCase()} / {ROLE_NAME[task.assignee]}</dd>
+            <dt>状态</dt><dd>{statusLabelOf(task.status)}</dd>
+            <dt>Chain</dt><dd>{chain.title}</dd>
+            <dt>优先级</dt><dd>{task.priority}</dd>
+            <dt>心跳</dt><dd>{task.heartbeats.length}</dd>
+            <dt>依赖</dt><dd>{props.parentTasks && props.parentTasks.length > 0 ? props.parentTasks.map((p) => p.title).join(' → ') : '无'}</dd>
+            <dt>重试</dt><dd>{task.attempts} 次{task.status === 'failed' ? ' · 可立即重试' : task.status === 'blocked' ? ' · 解除阻塞后可重试' : ''}</dd>
+          </dl>
+          <p>{task.body || '无附加任务描述'}</p>
+        </section>
+      )}
+      {tab === 'timeline' && (
+        <section role="tabpanel">
+          <ol>
+            {timeline.map((event) => (
+              <li key={event.seq}><code>{event.kind}</code><span>seq {event.seq} · {event.author} · {event.at}</span></li>
+            ))}
+          </ol>
+        </section>
+      )}
+      {tab === 'handoff' && (
+        <section role="tabpanel">
+          {props.parentTasks && props.parentTasks.length > 0 && (
+            <>
+              <h4>父任务原文</h4>
+              {props.parentTasks.map((p) => (
+                <p key={p.id}><strong>{p.title}</strong>{p.body ? `：${p.body}` : '（无正文）'}</p>
+              ))}
+            </>
+          )}
+          {props.parentHandoffs.length > 0 && (
+            <>
+              <h4>父任务交接</h4>
+              {props.parentHandoffs.map((h, i) => (
+                <p key={i}><strong>{h.summary}</strong> {formatValue(h.metadata)}</p>
+              ))}
+            </>
+          )}
+          <h4>当前任务交接</h4>
+          <p>{handoff?.summary ?? '当前任务尚无交接'}</p>
+          {handoff && Object.entries(handoff.metadata).map(([key, value]) => (
+            <p key={key}><strong>{key}</strong>: {formatValue(value)}</p>
+          ))}
+        </section>
+      )}
+      {tab === 'spec' && (
+        <section role="tabpanel">
+          <h4>Problem</h4><p>{specCard?.sections.problem ?? '无规格卡'}</p>
+          <h4>Solution</h4><p>{specCard?.sections.solution ?? '无'}</p>
+          <h4>User stories</h4><p>{specCard?.sections.user_stories.join('; ') || '无'}</p>
+          <h4>Implementation decisions</h4><p>{specCard?.sections.impl_decisions.join('; ') || '无'}</p>
+          <h4>Testing</h4><p>{specCard?.sections.testing ?? '无'}</p>
+          <h4>Out of scope</h4><p>{specCard?.sections.out_of_scope ?? '无'}</p>
+          <h4>附件</h4>
+          {specCard && specCard.attachments.length > 0 ? (
+            <ul className="dsh-kb-spec-attachments">
+              {specCard.attachments.map((a) => (
+                <li key={`${a.name}-${a.ref}`}>
+                  <span className="dsh-kb-spec-attachment__kind">{a.kind}</span>
+                  <strong>{a.name}</strong> <code>{a.ref}</code>
+                </li>
+              ))}
+            </ul>
+          ) : <p>无附件</p>}
+        </section>
+      )}
+      {tab === 'comments' && (
+        <section role="tabpanel">
+          {comments.map((event) => (
+            <p key={event.seq}>
+              <strong>{event.author}</strong> <time dateTime={new Date(event.at).toISOString()}>{formatTime(event.at)}</time>
+              : {String(event.payload['body'])}
+            </p>
+          ))}
+          {!props.readOnly && (
+            <input
+              aria-label="添加评论"
+              onKeyDown={(e) => { if (e.key === 'Enter') submitComment(e.target as HTMLInputElement); }}
+            />
+          )}
+        </section>
+      )}
+    </div>
+  );
+}

package/client/WorkflowRail.tsx

@@ -0,0 +1,175 @@
+import { useState } from 'react';
+import { CHAIN_FILTERS, CHAIN_FILTER_LABEL, type ChainFilter, type ChainWorkflowView } from './workflow-model.js';
+import { BoardCard } from './BoardCard.js';
+import { RenameModal } from './RenameModal.js';
+
+function matches(view: ChainWorkflowView, query: string): boolean {
+  const q = query.trim().toLowerCase();
+  if (!q) return true;
+  if (view.chain.title.toLowerCase().includes(q)) return true;
+  return view.tasks.some((item) => item.task.title.toLowerCase().includes(q));
+}
+
+/** T26/T32：多链路垂直轨道。折叠面板默认全打开（collapsed 集合只含手动折叠链路）；阻塞链路折叠时仍露出警告摘要；搜索命中期间临时展开；“已完成”筛选切换归档视图。
+ *  T7：链标题行右侧铅笔改名（div role=button 内嵌按钮，避免 button-in-button）。 */
+export function WorkflowRail(props: {
+  chains: ChainWorkflowView[];
+  /** 用户手动折叠的链路集合；不在集合内即展开（默认全打开）。 */
+  collapsedChainIds: ReadonlySet<string>;
+  query: string;
+  /** 链路状态筛选（多选并集；空=默认视图）。 */
+  statusFilter: ReadonlySet<ChainFilter>;
+  onToggleFilter(filter: ChainFilter): void;
+  onToggleChain(chainId: string): void;
+  onOpenTask(taskId: string): void;
+  /** D23：用户 GUI 确认链完成产物归属（POST /kanban/action {type:'confirm-audit'}）。 */
+  onConfirmAudit?(chainId: string): void;
+  /** T7：GUI 链标题改名（POST /kanban/action {type:'rename', chainId, title}）。 */
+  onRenameChain?(chainId: string, title: string): void;
+  /** 整链硬删除（POST /kanban/action {type:'delete', chainId}）；失败 throw 由弹窗展示。 */
+  onDeleteChain?(chainId: string): Promise<void>;
+}) {
+  const searching = props.query.trim().length > 0;
+  const visible = props.chains.filter((view) => matches(view, props.query));
+  const [renamingChainId, setRenamingChainId] = useState<string | null>(null);
+  const renamingChain = renamingChainId ? props.chains.find((v) => v.chain.id === renamingChainId)?.chain : undefined;
+  const [deletingChainId, setDeletingChainId] = useState<string | null>(null);
+  const [deleteError, setDeleteError] = useState<string | null>(null);
+  const deletingView = deletingChainId ? props.chains.find((v) => v.chain.id === deletingChainId) : undefined;
+  const confirmDelete = async () => {
+    if (!deletingChainId) return;
+    setDeleteError(null);
+    try {
+      await props.onDeleteChain?.(deletingChainId);
+      setDeletingChainId(null);
+    } catch (err) {
+      setDeleteError(String(err));
+    }
+  };
+  return (
+    <div className="dsh-kb-rail">
+      <div className="dsh-kb-filters" role="group" aria-label="按链路状态筛选">
+        {CHAIN_FILTERS.map((f) => {
+          const active = props.statusFilter.has(f);
+          return (
+            <button
+              key={f}
+              type="button"
+              className={`dsh-kb-filter${active ? ' dsh-kb-filter--active' : ''}`}
+              aria-pressed={active}
+              onClick={() => props.onToggleFilter(f)}
+            >
+              {CHAIN_FILTER_LABEL[f]}
+            </button>
+          );
+        })}
+      </div>
+      <div className="dsh-kb-rail__list" role="list" aria-label="任务链路">
+        {visible.length === 0 ? (
+          <div className="dsh-kb-empty" role="status">
+            {searching ? '无匹配链路' : '暂无看板任务，输入 /plan: 开启新链路'}
+          </div>
+        ) : visible.map((view) => {
+          const matched = searching ? view.tasks.filter((item) => item.task.title.toLowerCase().includes(props.query.trim().toLowerCase())) : view.tasks;
+          const expanded = searching || !props.collapsedChainIds.has(view.chain.id);
+          const done = view.tasks.filter((item) => item.task.status === 'done' || item.task.status === 'archived').length;
+          const blocked = view.tasks.some((item) => item.task.status === 'blocked' || item.task.status === 'failed');
+          const summary = view.blockedSummary ?? (blocked ? '链路受阻' : `${done}/${view.tasks.length}`);
+          return (
+            <section key={view.chain.id} className={`dsh-kb-chain dsh-kb-chain--${view.chain.status}`}>
+              <div
+                role="button"
+                tabIndex={0}
+                className="dsh-kb-chain__title"
+                aria-expanded={expanded}
+                onClick={() => props.onToggleChain(view.chain.id)}
+                onKeyDown={(e) => {
+                  if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); props.onToggleChain(view.chain.id); }
+                }}
+              >
+                <span className="dsh-kb-chain__chevron" aria-hidden="true" />
+                <span className="dsh-kb-chain__name">{view.chain.title}</span>
+                <span className="dsh-kb-chain__meta">{done}/{view.tasks.length}</span>
+                {props.onDeleteChain && (
+                  <button
+                    type="button"
+                    className="dsh-kb-chain__delete"
+                    aria-label="删除需求"
+                    onClick={(e) => { e.stopPropagation(); setDeleteError(null); setDeletingChainId(view.chain.id); }}
+                    onKeyDown={(e) => { e.stopPropagation(); }}
+                  >
+                    <svg viewBox="0 0 16 16" width="12" height="12" aria-hidden="true">
+                      <path d="M2.5 4h11M6.5 4V2.5h3V4M4 4l.7 9.5h6.6L12 4" fill="none" stroke="currentColor" strokeWidth="1.3" strokeLinecap="round" strokeLinejoin="round" />
+                      <path d="M6.6 6.5v4.5M9.4 6.5v4.5" stroke="currentColor" strokeWidth="1.3" strokeLinecap="round" />
+                    </svg>
+                  </button>
+                )}
+                {props.onRenameChain && (
+                  <button
+                    type="button"
+                    className="dsh-kb-chain__rename"
+                    aria-label="改链标题"
+                    onClick={(e) => { e.stopPropagation(); setRenamingChainId(view.chain.id); }}
+                    onKeyDown={(e) => { e.stopPropagation(); }}
+                  >
+                    ✎
+                  </button>
+                )}
+              </div>
+              {(blocked || view.blockedSummary) && (
+                <div className="dsh-kb-chain__warning">{summary}</div>
+              )}
+              {/* D23：completed 链存在未确认 audit-warning → 顶部警告行 + 确认按钮（阻塞最终汇报直至确认） */}
+              {view.audit && !view.audit.confirmed && (
+                <div className="dsh-kb-chain__warning dsh-kb-chain__audit">
+                  <span>⚠ 主 agent 疑似越权写工作区产物（{view.audit.evidenceCount} 条线索），最终汇报已阻塞，请核对产物归属</span>
+                  <button type="button" className="dsh-kb-audit-confirm" onClick={() => props.onConfirmAudit?.(view.chain.id)}>
+                    确认产物归属
+                  </button>
+                </div>
+              )}
+              {expanded && (
+                <ol className="dsh-kb-nodes">
+                  {(matched.length > 0 ? matched : view.tasks).map((item) => (
+                    <li key={item.task.id} className={`dsh-kb-node dsh-kb-node--${item.lineState}`}>
+                      <BoardCard view={item} onOpen={props.onOpenTask} />
+                    </li>
+                  ))}
+                </ol>
+              )}
+            </section>
+          );
+        })}
+      </div>
+      {renamingChain && props.onRenameChain && (
+        <RenameModal
+          title="改链标题"
+          initialValue={renamingChain.title}
+          onSave={(title) => { props.onRenameChain?.(renamingChain.id, title); setRenamingChainId(null); }}
+          onCancel={() => setRenamingChainId(null)}
+        />
+      )}
+      {deletingView && props.onDeleteChain && (
+        <div className="dsh-kb-rename-overlay" onClick={(e) => { e.stopPropagation(); setDeletingChainId(null); }}>
+          <div
+            className="dsh-kb-rename-modal"
+            role="dialog"
+            aria-modal="true"
+            aria-label="删除需求"
+            onClick={(e) => e.stopPropagation()}
+          >
+            <div className="dsh-kb-rename-modal__label">删除需求</div>
+            <div className="dsh-kb-delete-modal__text">
+              将永久删除「{deletingView.chain.title || '未命名需求'}」及其下 {deletingView.tasks.length} 张角色卡，不可恢复。确认删除？
+            </div>
+            {deleteError && <div className="dsh-kb-delete-modal__error" role="alert">删除失败：{deleteError}</div>}
+            <div className="dsh-kb-rename-modal__actions">
+              <button type="button" className="dsh-kb-rename-cancel" onClick={() => setDeletingChainId(null)}>取消</button>
+              <button type="button" className="dsh-kb-delete-confirm" onClick={() => void confirmDelete()}>删除</button>
+            </div>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}