DiAL/openspec/changes/frontend-architecture-refactor/tasks.md

1. 后端 Meta API

• 1.1 在 src/shared/api.ts 中新增 MetaResponse 类型定义
• 1.2 创建 src/server/routes/meta.ts，实现 handleMeta 从 checkerRegistry.supportedTypes 返回数据
• 1.3 在 src/server/app.ts 中注册 /api/meta 路由
• 1.4 在 tests/server/app.test.ts 中添加 /api/meta 端点测试（GET/HEAD/405）

2. 前端 Hook 拆分

• 2.1 创建 src/web/hooks/use-queries.ts，迁入 queryKeys、fetchJson、useSummary、useTargets，新增 useMeta
• 2.2 重写 src/web/hooks/use-target-detail.ts，仅保留 Drawer 状态管理和条件查询（trend/history）
• 2.3 更新 src/web/app.tsx 的 import 路径适配新 hook 文件

3. 前端组件拆分

• 3.1 创建 src/web/utils/stats.ts，提取统计计算纯函数（computeTrendStats）
• 3.2 创建 src/web/constants/history-table-columns.tsx，将 HISTORY_COLUMNS 从 Drawer 中移出
• 3.3 创建 src/web/components/OverviewTab.tsx，从 TargetDetailDrawer 中提取概览面板逻辑
• 3.4 创建 src/web/components/HistoryTab.tsx，从 TargetDetailDrawer 中提取记录面板逻辑
• 3.5 精简 src/web/components/TargetDetailDrawer.tsx，仅保留 Drawer 壳 + 时间选择 + Tab 切换

4. 类型筛选器动态化

• 4.1 将 src/web/constants/target-table-columns.tsx 中的 TARGET_TABLE_COLUMNS 改为工厂函数 createTargetTableColumns(checkerTypes)
• 4.2 从 src/web/constants/target-table-filters.ts 中移除 typeFilter（statusFilter 保留）
• 4.3 更新 src/web/components/TargetBoard.tsx，调用 useMeta + useMemo 生成列定义并传递给 TargetGroup
• 4.4 更新 src/web/components/TargetGroup.tsx，新增 columns prop 替代静态导入
• 4.5 删除 src/web/constants/target-type-display.ts
• 4.6 更新 src/web/components/TargetDetailDrawer.tsx 标题栏，直接使用 target.type 替代 getTargetTypeDisplay

5. 小问题修复

• 5.1 修复 StatusDonut.tsx：Cell key 从 index 改为 data[index].name
• 5.2 修复 StatusBar.tsx：新增 maxSlots prop（默认 30），用 prop 驱动格数渲染
• 5.3 修复 TrendChart.tsx：移除 loading prop，仅保留 data prop

6. 测试补充与更新

• 6.1 创建 tests/web/utils/time.test.ts，测试 subtractHours（正常、跨天、跨月、0 小时）
• 6.2 创建 tests/web/utils/stats.test.ts，测试 computeTrendStats 纯函数
• 6.3 更新 tests/web/constants/target-table-filters.test.ts，移除 typeFilter 相关测试
• 6.4 删除 tests/web/constants/target-type-display.test.ts
• 6.5 创建 tests/web/constants/target-table-columns.test.ts，测试 createTargetTableColumns 工厂函数

7. 质量保障与文档

• 7.1 执行 bun run check 确保类型检查、lint、测试全部通过
• 7.2 更新 DEVELOPMENT.md 中前端目录结构、组件清单和 hook 说明