feat(web): add homepage operations map

docs/LOGBOOK.md

@@ -27696,3 +27696,61 @@ production browser smoke:
 - Ansible / PlayBook runtime：約 95%；候選 PlayBook 已呈現在 AwoooP，但本 incident 尚無 check/apply 紀錄。
 - 完整自動修復 production claim：約 3.5%；Gate 5 projection 是可見性與安全閘，不是自動修復成功。真正提升要完成 executor handoff 並用 24h verified_success 拉高。
 - 完整 AI Agent 自動化飛輪：約 63%；監控、告警、審批、證據鏈、前端可視化更完整，但執行成功率與學習閉環仍是主缺口。
+
+## 2026-06-02 — Frontend product UX 12-agent audit + homepage operations map
+
+**背景**：
+- 使用者指出 production 首頁與 AwoooP/Alerts/Governance 等頁面文字量過大、難以快速判讀流程階段，且首頁無法正常上下滾動。
+- 本輪以 12 個 read-only agent 分工盤點：IA/navigation、首頁、AwoooP、Alerts、KM/Governance、Observability、Automation/Ansible、Security/IwoooS、i18n、Visual System、Data/API truth、Responsive/A11y。
+- 主工作區 `/Users/ogt/awoooi` 仍有大量既有 dirty/untracked 變更；本輪在乾淨 worktree `/private/tmp/awoooi-frontend-product-audit-20260602` 基於最新 `gitea/main` 開發，避免混入無關變更。
+
+**本輪完成**：
+- 首頁 `/zh-TW` 新增 `homepage-product-map` 首屏區塊：
+  - 產品化呈現 AI 自動化事件生命週期：Alert / Sentry / SigNoz → AwoooP 收件 → OpenClaw / Hermes → MCP 證據 → PlayBook 閘門 → Ansible Check → Approval / Apply → Verify / KM。
+  - 右側以表格化模組列呈現 AwoooP Run Timeline、AI Router / Agent 分工、PlayBook / MCP / Ansible、KM / Governance 的 owner 與資料來源。
+  - 不新增假數字，沿用 production truth-chain / homepage brief / quality summary 的既有資料；資料未回應時顯示暫不可用，不宣稱自動修復完成。
+- 修正首頁 scroll owner：
+  - 原本 overview 外層 `height: calc(100vh - 68px)` + `overflowY:auto` 造成 document 不是主要 scroll owner，production 實測 document height 只有約 1299px、內層 scrollHeight 約 6023px。
+  - 改為 `minHeight: calc(100vh - 68px)` + `overflowY:visible`，恢復正常 document scroll。
+- 補 `zh-TW` / `en` i18n：`dashboard.homeProductMap.*`，避免把本輪討論文字硬寫在頁面中。
+
+**12-agent 盤點收斂**：
+- IA/navigation：46 個 route、108 個 TSX component 粗盤；主導航是 8 主入口 + legacy + bottom，與「五柱導航」註解不一致。需要下一波收斂孤島頁：`/topology`、`/aiops/timeline`、`/reports`、`/alert-operation-logs`、`/users`。
+- AwoooP：Runs / Work Items / Approvals 資料結構夠完整，但頁面把 incident、recurrence、repair、source correlation、approval、truth-chain 混在同一閱讀面。下一波需要 Run detail flow / evidence table / approval gate drawer。
+- Alerts：`/incidents` 目前沒有 `alertname/source/fingerprint/hit_count/source_logs` projection，前端無法判讀重複告警。需要 incident correlation projection。
+- KM/Governance：後端已有 `knowledge_degradation` / `kb_stale` governance event，但前端 events/query/model 與後端 schema 不完全對齊，operator 看到的是告警而不是 workflow。需要 KM Health tab。
+- Observability：Monitoring/Alerts/APM 仍偏列表文字，缺 severity x hour heatmap、source matrix、routing funnel、host/service heatmap。`MonitoringPanel` 與 `/dashboard` payload contract 也需對齊。
+- Automation/Ansible：Ansible 不是一級 ActionType；AutoRepairPanel 只露少量 gate 資訊，未呈現 cooldown / service registry / anti-pattern / verifier / rollback / KM links。需要 AutoRepair gate trace + Ansible coverage table。
+- Visual System：缺共用 Button / Badge / DataTable / PageHeader / EmptyState / MetricCard primitive，導致頁面大量手刻卡片、文字牆與 emoji icon 殘留。
+- Data/API truth：AIOps mock、首頁/classic static host catalog、CPU/RAM fallback、Code Review 內網 URL、`NEXT_PUBLIC_API_URL ?? ''` catch-to-empty 是 P1 技術債；需 API-backed truth source 與 public/proxy-safe URLs。
+- Responsive/A11y：首頁 scroll owner 已先修；仍需 mobile drawer shell、FlowPipeline mobile vertical mode、tab semantics、focus-visible、touch target 與 text contrast 修正。
+
+**驗證**：
+- `node -e "JSON.parse(...zh-TW.json); JSON.parse(...en.json); console.log('json ok')"` → `json ok`
+- `pnpm --filter @awoooi/web typecheck` → success
+- Local dev：
+  - `NEXT_PUBLIC_API_URL=https://awoooi.wooo.work pnpm --filter @awoooi/web dev -- --hostname 127.0.0.1 --port 3112`
+  - Browser DOM：`productMapPresent=true`、`docScrollHeight=5428`、`bodyScrollHeight=5428`、`navVisible=true`
+  - Desktop screenshot layout audit：`horizontalOverflow=0`、`overflowingCount=0`
+  - Mobile 390px layout audit：`productMapPresent=true`、`horizontalOverflow=0`、`overflowingCount=0`
+- Production build：
+  - `NEXT_PUBLIC_API_URL=https://awoooi.wooo.work NEXT_PRIVATE_BUILD_WORKER_COUNT=1 pnpm --filter @awoooi/web build` → success
+  - Build size note：`/[locale]` 32.5 kB / First Load JS 277 kB；`/topology` 492 kB / First Load JS 722 kB，後續需另列 performance debt。
+
+**下一波優先順序**：
+1. AwoooP Run detail / Evidence table / Approval gate drawer：讓 operator 一眼知道跑到哪一關、誰負責、缺什麼證據。
+2. Incident correlation projection：`fingerprint/hit_count/source_logs/Sentry/SigNoz/Telegram/AwoooP run` 進 `/incidents` 與 timeline，解決重複告警不可判讀。
+3. KM Health / Governance workflow：把 `knowledge_degradation` 從告警文字轉成 stale buckets、owner review、dispatch/verify workflow。
+4. AutoRepair gate trace + Ansible coverage table：把 PlayBook match、dry-run、policy、approval、verify、KM link 與 Ansible check/apply/diff 變成可掃描表格。
+5. Frontend primitives / i18n debt：建立 Button/Badge/DataTable/PageHeader/EmptyState/MetricCard，先改 AwoooP 與 Alerts；清 AwoooP/Code Review 硬編文案與內網 URL。
+
+**目前整體進度（本階段完成後）**：
+- 全站前端 IA / 可讀性盤點：約 100%；12 個 read-only agent 已完成並已收斂為 wave。
+- 首頁產品化入口：約 78%；已補 Operations Map 與正常 document scroll，仍需清舊 static/fallback 區塊與拆大檔。
+- AwoooP / HITL 可視化：約 99.2%；本輪未改 executor handoff，仍缺 Run detail evidence table 與 legacy duplicate reconciliation。
+- Alerts recurrence / source correlation：約 68%；問題已定位，需新增 API projection 後前端才能準確呈現重複與來源。
+- KM / Governance workflow：約 58%；後端事件已有，前端 workflow/health tab 尚未完成。
+- Ansible / AutoRepair gate 可視化：約 52%；候選資料與 runbook 已有，尚缺一級 ActionType / coverage table / gate trace。
+- Frontend design system / i18n：約 46%；盤點完成，但 primitives 與 AwoooP i18n 大掃除尚未實作。
+- 完整自動修復 production claim：約 3.5%；本輪是 UX/可視化進展，未提高 verified auto-repair execution success。
+- 完整 AI Agent 自動化飛輪：約 66%；可視化與產品入口改善，但真正自動執行、驗證、學習閉環仍需下一波 API + executor + governance 工作。