dsh-data-domain-knowledge 0.1.0-alpha.13 → 0.1.0-alpha.15

package/src/client/convert/ConvertPanel.tsx

@@ -1,583 +0,0 @@
-import { useCallback, useEffect, useMemo, useState, type ChangeEvent, type ReactNode } from 'react'
-import {
-  AlertCircle, Check, Copy, Download, ExternalLink, FileText, FileUp, Inbox,
-  Package, RefreshCw, RotateCcw, ScanEye, X,
-} from '@tita-agent/ui/icons'
-import type { LucideIcon } from '@tita-agent/ui/icons'
-import { Badge, Button, Input, Label, SelectMenu, Switch, Tabs, TabsContent, TabsList, TabsTrigger, cn } from '@tita-agent/ui/components'
-import { styles } from './styles.ts'
-import '@tita-agent/ui/styles.css'
-// The panel ships its own `tdc-*` stylesheet; without this import the class names
-// resolve to nothing and the panel renders unstyled.
-import './styles.css'
-
-/**
- * The conversion kernel is mounted by the knowledge plugin at `/convert`.
- * Frozen contract — see spec/VERSION-MATRIX.md.
- */
-const BASE = '/convert'
-
-interface TaskSummary {
-  id: string
-  state: 'queued' | 'running' | 'succeeded' | 'failed' | 'cancelled'
-  inputKind: string
-  title: string
-  sourceFormat: string
-  parser?: string
-  progress: number | null
-  stage: string
-  message?: string
-  error?: { code: string; message: string; suggestion?: string } | null
-  warnings: Array<{ code: string; message: string }>
-  assetCount: number
-  wordCount: number
-  contentHash?: string
-  externalId?: string
-  deliveryDir?: string
-}
-
-interface AdapterCapability {
-  id: string
-  description: string
-  kinds: string[]
-  extensions: string[]
-  availability: { available: boolean; reason?: string; suggestion?: string }
-}
-
-interface CapabilityReport {
-  adapters: AdapterCapability[]
-  supportedExtensions: string[]
-  runtime: Record<string, { available: boolean; version?: string; error?: string }>
-  rootDir: string
-  outDir: string
-  knowledgeRoot: string
-  knowledgeRootSource: string
-  ingestEnabled: boolean
-}
-
-/** Plugin-level facts served by `/convert/api/plugin` (the kernel cannot know them). */
-interface PluginInfo {
-  rootDir: string
-  outDir: string
-  mountPath: string
-  knowledgeRoot: string
-  knowledgeRootSource: string
-  knowledgeBaseUrl: string
-  ingestEnabled: boolean
-}
-
-interface IngestResult {
-  taskId: string
-  sourceId?: string
-  sourcePath?: string
-  knowledgeRoot: string
-  externalId: string
-  contentHash: string
-  sourceFormat: string
-  parser: string
-  assets: Array<{ rel: string; target: string; bytes: number }>
-  cardHints: { entityTypes: string[]; sourceRefs: string[]; title: string; summary: string; contentWithImages: string; imageRefs: string[] }
-  notes: string[]
-  knowledgeRootSource?: string
-}
-
-interface Envelope<T> { ok?: boolean; data?: T; warnings?: string[]; error?: { code?: string; message?: string; suggestion?: string } }
-
-async function requestJson<T>(url: string, init?: RequestInit): Promise<Envelope<T>> {
-  const response = await fetch(url, init)
-  const text = await response.text()
-  if (!text.trim()) throw new Error(`服务端返回空响应（HTTP ${response.status}）`)
-  let payload: Envelope<T>
-  try {
-    payload = JSON.parse(text) as Envelope<T>
-  } catch {
-    throw new Error(`服务端返回了无效响应（HTTP ${response.status}）`)
-  }
-  if (!response.ok || payload.ok === false) {
-    const error = new Error([payload.error?.code, payload.error?.message].filter(Boolean).join(' · ') || `请求失败（${response.status}）`)
-    ;(error as Error & { suggestion?: string }).suggestion = payload.error?.suggestion
-    throw error
-  }
-  return payload
-}
-
-function describe(cause: unknown): string {
-  if (!(cause instanceof Error)) return String(cause)
-  const suggestion = (cause as Error & { suggestion?: string }).suggestion
-  return suggestion ? `${cause.message} — 建议：${suggestion}` : cause.message
-}
-
-const STATE_META: Record<TaskSummary['state'], { label: string; tone: 'neutral' | 'success' | 'warning' | 'blue' }> = {
-  queued: { label: '排队', tone: 'warning' },
-  running: { label: '进行中', tone: 'blue' },
-  succeeded: { label: '已交付', tone: 'success' },
-  failed: { label: '失败', tone: 'neutral' },
-  cancelled: { label: '已取消', tone: 'neutral' },
-}
-
-const KIND_META: Record<string, { label: string; icon: LucideIcon }> = {
-  file: { label: '文件', icon: FileText },
-  text: { label: '文本', icon: FileUp },
-}
-
-function formatBytes(bytes: number | undefined): string {
-  if (!bytes) return '0 B'
-  const units = ['B', 'KB', 'MB', 'GB']
-  let value = bytes
-  let unit = 0
-  while (value >= 1024 && unit < units.length - 1) { value /= 1024; unit += 1 }
-  return `${value.toFixed(value >= 10 || unit === 0 ? 0 : 1)} ${units[unit]}`
-}
-
-export interface ConvertPanelProps {
-  visible: boolean
-  /** Settings scope handed in by the client shell; the panel reads live values from the plugin API. */
-  settings?: { convert?: unknown }
-}
-
-export function ConvertPanel({ visible }: ConvertPanelProps): ReactNode {
-  const [view, setView] = useState('tasks')
-  const [tasks, setTasks] = useState<TaskSummary[]>([])
-  const [capabilities, setCapabilities] = useState<CapabilityReport | null>(null)
-  const [selected, setSelected] = useState<TaskSummary | null>(null)
-  const [markdown, setMarkdown] = useState('')
-  const [ingest, setIngest] = useState<IngestResult | null>(null)
-  const [error, setError] = useState<string | null>(null)
-  const [notice, setNotice] = useState<string | null>(null)
-  const [busy, setBusy] = useState(false)
-  const [form, setForm] = useState({ kind: 'upload', path: '', text: '', title: '', adapter: '' })
-  const [uploadFile, setUploadFile] = useState<File | null>(null)
-  const [ingestForm, setIngestForm] = useState({ title: '', planOnly: false })
-
-  const load = useCallback(async () => {
-    try {
-      const [tasksPayload, capabilityPayload, pluginPayload] = await Promise.all([
-        requestJson<{ tasks: TaskSummary[] }>(`${BASE}/api/tasks`),
-        requestJson<CapabilityReport>(`${BASE}/api/capabilities`),
-        requestJson<PluginInfo>(`${BASE}/api/plugin`),
-      ])
-      setTasks(tasksPayload.data?.tasks ?? [])
-      setCapabilities(capabilityPayload.data ? { ...capabilityPayload.data, ...pluginPayload.data } as CapabilityReport : null)
-      setError(null)
-    } catch (cause) {
-      setError(describe(cause))
-    }
-  }, [])
-
-  useEffect(() => { void load() }, [load, visible])
-
-  useEffect(() => {
-    if (!visible) return undefined
-    const timer = setInterval(() => { void load() }, 4000)
-    return () => clearInterval(timer)
-  }, [load, visible])
-
-  const selectedId = selected?.id ?? ''
-
-  const openTask = useCallback(async (task: TaskSummary) => {
-    setSelected(task)
-    setIngest(null)
-    setMarkdown('')
-    setIngestForm({ title: task.title ?? '', planOnly: false })
-    try {
-      const detail = await requestJson<TaskSummary>(`${BASE}/api/tasks/${encodeURIComponent(task.id)}`)
-      if (detail.data) setSelected(detail.data)
-      if (task.state === 'succeeded') {
-        const body = await fetch(`${BASE}/api/tasks/${encodeURIComponent(task.id)}/markdown`)
-        if (body.ok) setMarkdown(await body.text())
-      }
-    } catch (cause) {
-      setError(describe(cause))
-    }
-  }, [])
-
-  const submit = useCallback(async () => {
-    setBusy(true)
-    setError(null)
-    setNotice(null)
-    try {
-      const common = {
-        title: form.title.trim() || undefined,
-        adapter: form.adapter.trim() || undefined,
-      }
-      let payload: Envelope<{ id?: string }>
-      if (form.kind === 'upload') {
-        // The kernel owns multipart parsing, staging and cleanup, so the browser
-        // hands it the bytes directly instead of a path only the server can see.
-        if (!uploadFile) throw new Error('请先选择一个文件。')
-        const body = new FormData()
-        body.append('file', uploadFile, uploadFile.name)
-        if (common.title) body.append('title', common.title)
-        if (common.adapter) body.append('adapter', common.adapter)
-        payload = await requestJson(`${BASE}/api/tasks`, { method: 'POST', body })
-      } else if (form.kind === 'file') {
-        if (!form.path.trim()) throw new Error('本机路径转换需要一个绝对路径（供 Agent 或本机脚本使用）。')
-        payload = await requestJson(`${BASE}/api/tasks`, {
-          method: 'POST',
-          headers: { 'content-type': 'application/json' },
-          body: JSON.stringify({ kind: 'file', local_path: form.path.trim(), ...common }),
-        })
-      } else {
-        payload = await requestJson(`${BASE}/api/tasks`, {
-          method: 'POST',
-          headers: { 'content-type': 'application/json' },
-          body: JSON.stringify({ kind: 'text', text: form.text, ...common }),
-        })
-      }
-      setNotice(`任务已受理：${payload.data?.id ?? ''}`)
-      setUploadFile(null)
-      setView('tasks')
-      await load()
-    } catch (cause) {
-      setError(describe(cause))
-    } finally {
-      setBusy(false)
-    }
-  }, [form, load, uploadFile])
-
-  const act = useCallback(async (taskId: string, action: 'cancel' | 'retry') => {
-    try {
-      await requestJson(`${BASE}/api/tasks/${encodeURIComponent(taskId)}/${action}`, { method: 'POST' })
-      await load()
-    } catch (cause) {
-      setError(describe(cause))
-    }
-  }, [load])
-
-  const runIngest = useCallback(async () => {
-    if (!selectedId) return
-    setBusy(true)
-    setError(null)
-    setNotice(null)
-    try {
-      const result = await requestJson<IngestResult>(`${BASE}/api/ingest`, {
-        method: 'POST',
-        headers: { 'content-type': 'application/json' },
-        body: JSON.stringify({
-          task_id: selectedId,
-          title: ingestForm.title.trim() || undefined,
-          plan_only: ingestForm.planOnly,
-        }),
-      })
-      setIngest(result.data ?? null)
-      setNotice(ingestForm.planOnly ? '已完成入库预演（未写入）' : `已写入知识库：${result.data?.sourceId ?? ''}`)
-    } catch (cause) {
-      setError(describe(cause))
-    } finally {
-      setBusy(false)
-    }
-  }, [ingestForm, selectedId])
-
-  const copy = useCallback((value: string) => {
-    void navigator.clipboard?.writeText(value).then(() => setNotice('已复制到剪贴板')).catch(() => setError('复制失败'))
-  }, [])
-
-  const cardPrompt = useMemo(() => {
-    if (!ingest) return ''
-    const hints = ingest.cardHints
-    return [
-      `请为刚录入的来源 ${ingest.sourceId ?? ''} 写一张 wiki 卡片，让图片进入多模态召回：`,
-      `- 坐标实体类型建议：${hints.entityTypes.join(' / ')}（使用系统固定模板）`,
-      `- source_refs：${hints.sourceRefs.join(', ')}`,
-      `- 标题：${hints.title}`,
-      `- 正文必须使用下面这些图片相对路径（按对应坐标实体目录解析）：`,
-      ...hints.imageRefs.map(ref => `  - ${ref}`),
-      '调用 propose_wiki_cards 时把图片引用原样写进 content（正文只读，之后改不了，所以一次写对）。',
-    ].join('\n')
-  }, [ingest])
-
-  const runningCount = tasks.filter(task => task.state === 'running' || task.state === 'queued').length
-
-  return (
-    <div className={styles.panel}>
-      <div className={styles.header}>
-        <div className={styles.headerCopy}>
-          <h3 className={styles.headerTitle}>格式转换</h3>
-          <p className={styles.headerSubtitle}>
-            PDF / Office / 视频 / 音频 / 图片 → 知识就绪 Markdown + 本地图片
-          </p>
-        </div>
-        <div className={styles.headerActions}>
-          <a className="tita-uiButton" href={`${BASE}/`} target="_blank" rel="noreferrer" title="打开内核控制台（Vue3）">
-            <ExternalLink size={14} />
-          </a>
-          <Button variant="ghost" size="sm" onClick={() => void load()} title="刷新">
-            <RefreshCw size={14} />
-          </Button>
-        </div>
-      </div>
-
-      <div className={styles.body}>
-        {error && <p className={cn(styles.small, styles.error)}><AlertCircle size={12} /> {error}</p>}
-        {notice && <p className={cn(styles.small, styles.notice)}><Check size={12} /> {notice}</p>}
-
-        <Tabs value={view} onValueChange={setView}>
-          <TabsList>
-            <TabsTrigger value="tasks">任务{runningCount > 0 ? ` (${runningCount})` : ''}</TabsTrigger>
-            <TabsTrigger value="new">新转换</TabsTrigger>
-            <TabsTrigger value="ingest">知识入库</TabsTrigger>
-            <TabsTrigger value="caps">能力</TabsTrigger>
-          </TabsList>
-
-          {/* ---------------------------------------------------------- tasks */}
-          <TabsContent value="tasks">
-            {tasks.length === 0 && <p className={styles.empty}>还没有转换任务。</p>}
-            <div className={styles.taskList}>
-              {tasks.map(task => {
-                const meta = STATE_META[task.state]
-                const kind = KIND_META[task.inputKind] ?? KIND_META.file!
-                const KindIcon = kind.icon
-                return (
-                  <div key={task.id} className={cn(styles.task, selectedId === task.id && styles.taskActive)}>
-                    <div className={styles.taskMain}>
-                      <div className={styles.taskTitle}>
-                        <KindIcon size={12} /> {task.title}
-                      </div>
-                      <div className={styles.taskMeta}>
-                        {task.parser ?? task.inputKind} · {task.assetCount} 图 / {task.wordCount} 字 · {task.stage}
-                        {task.message ? ` · ${task.message}` : ''}
-                      </div>
-                      {task.state === 'running' && (
-                        <div className={styles.progress}>
-                          <div className={styles.progressBar} style={{ width: task.progress === null ? '100%' : `${Math.round(task.progress * 100)}%` }} />
-                        </div>
-                      )}
-                      {task.error && (
-                        <div className={cn(styles.taskMeta, styles.error)}>
-                          {task.error.code} · {task.error.message}
-                          {task.error.suggestion ? ` — ${task.error.suggestion}` : ''}
-                        </div>
-                      )}
-                    </div>
-                    <div className={styles.taskSide}>
-                      <Badge tone={meta.tone}>{meta.label}</Badge>
-                      <div className={styles.taskActions}>
-                        <Button variant="ghost" size="sm" title="详情" onClick={() => void openTask(task)}><ScanEye size={13} /></Button>
-                        {task.state === 'running' || task.state === 'queued'
-                          ? <Button variant="ghost" size="sm" title="取消" onClick={() => void act(task.id, 'cancel')}><X size={13} /></Button>
-                          : task.state === 'failed' || task.state === 'cancelled'
-                            // 只有这两个状态还能重试。已交付的任务**输入在交付后就清理了**，
-                            // 给它一枚重试按钮，点了只会得到 TASK_ALREADY_DELIVERED，
-                            // 而修复之前那一次点击还会顺手删掉刚交付的产物。
-                            ? <Button variant="ghost" size="sm" title="重试" onClick={() => void act(task.id, 'retry')}><RotateCcw size={13} /></Button>
-                            : null}
-                        {task.state === 'succeeded' && (
-                          <a className="tita-uiButton" href={`${BASE}/api/tasks/${encodeURIComponent(task.id)}/files/index.md`} target="_blank" rel="noreferrer" title="打开 index.md">
-                            <Download size={13} />
-                          </a>
-                        )}
-                      </div>
-                    </div>
-                  </div>
-                )
-              })}
-            </div>
-          </TabsContent>
-
-          {/* ------------------------------------------------------------ new */}
-          <TabsContent value="new">
-            <div className={styles.field}>
-              <span className={styles.fieldLabel}>输入类型</span>
-              <SelectMenu
-                value={form.kind}
-                onValueChange={next => setForm({ ...form, kind: next })}
-                aria-label="输入类型"
-                options={[
-                  { value: 'upload', label: '上传文件' },
-                  { value: 'file', label: '文档（本机路径）' },
-                  { value: 'text', label: '内联文本' },
-                ]}
-              />
-            </div>
-
-            {form.kind === 'upload' && (
-              <label className={styles.field}>
-                <span className={styles.fieldLabel}>文件</span>
-                <input
-                  className={styles.fileInput}
-                  type="file"
-                  accept={(capabilities?.supportedExtensions ?? ['.docx', '.pdf', '.pptx', '.xlsx', '.csv', '.epub', '.rtf']).join(',')}
-                  onChange={(event: ChangeEvent<HTMLInputElement>) => setUploadFile(event.target.files?.[0] ?? null)}
-                />
-                <span className={styles.fieldHint}>
-                  支持 {(capabilities?.supportedExtensions ?? []).map(item => item.replace('.', '')).join(' ')}；文件由内核直接接收，不需要先放到本机某个路径。
-                </span>
-                {uploadFile && <span className={styles.fieldHint}>已选择：{uploadFile.name}（{formatBytes(uploadFile.size)}）</span>}
-              </label>
-            )}
-
-            {form.kind === 'file' && (
-              <label className={styles.field}>
-                <span className={styles.fieldLabel}>本机绝对路径</span>
-                <Input value={form.path} spellCheck={false} placeholder="/Users/you/Documents/spec.docx" onChange={(event: ChangeEvent<HTMLInputElement>) => setForm({ ...form, path: event.target.value })} />
-                <span className={styles.fieldHint}>
-                  给 Agent 或本机脚本用的入口：文件必须已经在运行 DSH 的这台机器上。
-                </span>
-              </label>
-            )}
-
-            {form.kind === 'text' && (
-              <label className={styles.field}>
-                <span className={styles.fieldLabel}>文本</span>
-                <textarea className={styles.pre} rows={8} value={form.text} onChange={(event: ChangeEvent<HTMLTextAreaElement>) => setForm({ ...form, text: event.target.value })} />
-              </label>
-            )}
-
-            <div className={styles.grid2}>
-              <label className={styles.field}>
-                <span className={styles.fieldLabel}>标题（可选）</span>
-                <Input value={form.title} onChange={(event: ChangeEvent<HTMLInputElement>) => setForm({ ...form, title: event.target.value })} />
-              </label>
-            </div>
-
-            <div className={styles.field}>
-              <span className={styles.fieldLabel}>adapter（可选）</span>
-              <SelectMenu
-                value={form.adapter}
-                onValueChange={next => setForm({ ...form, adapter: next })}
-                aria-label="adapter（可选）"
-                options={[
-                  { value: '', label: '自动选择' },
-                  ...(capabilities?.adapters ?? []).map(adapter => ({
-                    value: adapter.id,
-                    label: `${adapter.id}${adapter.availability.available ? '' : '（不可用）'}`,
-                  })),
-                ]}
-              />
-            </div>
-
-            <Button variant="default" disabled={busy} onClick={() => void submit()}>
-              <FileUp size={14} /> {busy ? '提交中…' : '开始转换'}
-            </Button>
-          </TabsContent>
-
-          {/* --------------------------------------------------------- ingest */}
-          <TabsContent value="ingest">
-            {!selectedId && <p className={styles.empty}>先在「任务」里选择一个已交付的任务。</p>}
-            {selectedId && (
-              <>
-                <dl className={styles.kv}>
-                  <div><dt>任务</dt><dd><span className={styles.code}>{selectedId}</span></dd></div>
-                  <div><dt>标题</dt><dd>{selected?.title}</dd></div>
-                  <div><dt>交付目录</dt><dd><span className={styles.code}>{selected?.deliveryDir}</span></dd></div>
-                  <div><dt>content_hash</dt><dd><span className={styles.code}>{selected?.contentHash}</span></dd></div>
-                  <div><dt>知识库根目录</dt><dd><span className={styles.code}>{capabilities?.knowledgeRoot}</span> <span className={styles.muted}>({capabilities?.knowledgeRootSource})</span></dd></div>
-                </dl>
-
-                <div className={styles.grid2}>
-                  <label className={styles.field}>
-                    <span className={styles.fieldLabel}>标题覆盖（可选）</span>
-                    <Input value={ingestForm.title} onChange={(event: ChangeEvent<HTMLInputElement>) => setIngestForm({ ...ingestForm, title: event.target.value })} />
-                  </label>
-                </div>
-
-                <div className={cn(styles.row, styles.section)}>
-                  <Switch checked={ingestForm.planOnly} onCheckedChange={checked => setIngestForm({ ...ingestForm, planOnly: checked })} />
-                  <Label>仅预演（plan_only，不写入）</Label>
-                </div>
-
-                <Button variant="default" disabled={busy || !capabilities?.ingestEnabled} onClick={() => void runIngest()}>
-                  <Package size={14} /> {ingestForm.planOnly ? '预演入库' : '写入知识库'}
-                </Button>
-                {capabilities && !capabilities.ingestEnabled && (
-                  <p className={styles.fieldHint}>插件设置里关闭了「允许一键入库」。</p>
-                )}
-
-                {ingest && (
-                  <div className={styles.section}>
-                    <h4 className={styles.sectionTitle}>入库结果</h4>
-                    <dl className={styles.kv}>
-                      <div><dt>source_id</dt><dd><span className={styles.code}>{ingest.sourceId ?? '（预演）'}</span></dd></div>
-                      <div><dt>来源路径</dt><dd><span className={styles.code}>{ingest.sourcePath ?? '—'}</span></dd></div>
-                      <div><dt>图片资产</dt><dd>{ingest.assets.length} 个</dd></div>
-                    </dl>
-
-                    {ingest.assets.length > 0 && (
-                      <div className={styles.assetGrid}>
-                        {ingest.assets.map(asset => (
-                          <figure key={asset.rel} className={styles.assetCard}>
-                            <img src={`${BASE}/api/tasks/${encodeURIComponent(selectedId)}/files/${asset.rel}`} alt={asset.rel} loading="lazy" />
-                            <figcaption>{formatBytes(asset.bytes)}</figcaption>
-                          </figure>
-                        ))}
-                      </div>
-                    )}
-
-                    {ingest.notes.length > 0 && (
-                      <ul className={cn(styles.small, styles.muted)}>
-                        {ingest.notes.map(note => <li key={note}>{note}</li>)}
-                      </ul>
-                    )}
-
-                    <h4 className={styles.sectionTitle}>给 Agent 的卡片提示</h4>
-                    <pre className={styles.pre}>{cardPrompt}</pre>
-                    <div className={cn(styles.row, styles.section)}>
-                      <Button variant="ghost" size="sm" onClick={() => copy(cardPrompt)}><Copy size={13} /> 复制</Button>
-                      <Button variant="ghost" size="sm" onClick={() => copy(ingest.cardHints.contentWithImages)}><Copy size={13} /> 复制卡片正文</Button>
-                    </div>
-                    <p className={styles.fieldHint}>
-                      图片必须在 wiki 卡片里被引用才会进入多模态向量（编译段每个单元只取第一张图），所以这一步不能省。
-                    </p>
-                  </div>
-                )}
-              </>
-            )}
-          </TabsContent>
-
-          {/* ----------------------------------------------------------- caps */}
-          <TabsContent value="caps">
-            {!capabilities && <p className={styles.empty}>能力信息不可用。</p>}
-            {capabilities && (
-              <>
-                <ul className={styles.capList}>
-                  {capabilities.adapters.map(adapter => (
-                    <li key={adapter.id} className={styles.capItem}>
-                      <span className={adapter.availability.available ? styles.dotOn : styles.dotOff} />
-                      <div>
-                        <strong>{adapter.id}</strong>
-                        <div className={styles.taskMeta}>{adapter.description}</div>
-                        {!adapter.availability.available && adapter.availability.reason && (
-                          <div className={cn(styles.taskMeta, styles.error)}>{adapter.availability.reason}</div>
-                        )}
-                        {adapter.availability.suggestion && <div className={styles.taskMeta}>{adapter.availability.suggestion}</div>}
-                      </div>
-                    </li>
-                  ))}
-                </ul>
-
-                <h4 className={styles.sectionTitle}>支持的输入格式</h4>
-                <p className={styles.taskMeta}>{(capabilities.supportedExtensions ?? []).join(' ')}</p>
-
-                <h4 className={styles.sectionTitle}>引擎</h4>
-                <ul className={styles.capList}>
-                  {Object.entries(capabilities.runtime).map(([name, probe]) => (
-                    <li key={name} className={styles.capItem}>
-                      <span className={probe.available ? styles.dotOn : styles.dotOff} />
-                      <div>
-                        <strong>{name}</strong>
-                        <div className={styles.taskMeta}>{probe.available ? probe.version : probe.error}</div>
-                      </div>
-                    </li>
-                  ))}
-                </ul>
-
-                <h4 className={styles.sectionTitle}>路径</h4>
-                <dl className={styles.kv}>
-                  <div><dt>交付根目录</dt><dd><span className={styles.code}>{capabilities.outDir}</span></dd></div>
-                  <div><dt>知识库根目录</dt><dd><span className={styles.code}>{capabilities.knowledgeRoot}</span></dd></div>
-                </dl>
-              </>
-            )}
-          </TabsContent>
-        </Tabs>
-
-        {selected && markdown && (
-          <div className={styles.section}>
-            <h4 className={styles.sectionTitle}><Inbox size={12} /> 交付预览 · {selected.title}</h4>
-            <pre className={styles.pre}>{markdown.slice(0, 6000)}</pre>
-          </div>
-        )}
-      </div>
-    </div>
-  )
-}