thread-master/docs/product/opportunity-inbox/tasks/T820-demand-map-mock-editor.md

T820 — demand map mock editor

Status: done Milestone: M2 Est. change: ~190 lines

Goal

完成後 mock UI 可查看與編輯五類 DemandMap phrase，顯示來源依據、完整度、版本與 stale／待確認狀態。

Depends on

• T801、T810

Inputs

• apps/web/src/pages/RadarWatchesPage.tsx
• apps/web/src/components/radar/ProductContextReadiness.tsx
• Spec §4.1、§6.3、驗收 #6

Outputs

程式變更（預期路徑）

路徑	動作	說明
apps/web/src/components/radar/DemandMapEditor.tsx	add	五類 phrase、basis、origin、enabled 編輯
apps/web/src/data/mock/radarRepo.ts	edit	get/save demand map mock
apps/web/src/pages/RadarWatchesPage.tsx	edit	產品上下文入口與 incomplete gate
apps/web/src/pages/RadarWatchesPage.test.tsx	add/edit	產品資料不足、保存與 conflict 測試

行為變更

• baseline 由產品資料免費生成；產品只有名稱時顯示 incomplete，不能啟動新巡邏。

API / 契約（若有）

• 使用 T801 DemandMap 型別；保存需帶目前 map version。

Out of scope

• 不呼叫真 AI、不接 live DemandMap API。

Acceptance

• 五類內容、basis、origin、待補資料都能讀懂。
• phrase 編輯不記 platform credits。
• 指令：

cd apps/web && npm run test -- RadarWatchesPage DemandMapEditor && npm run build

Notes

custom phrase 與 AI phrase 視覺上要可區分，但不把 AI phrase 當產品真相。