TrueGrowth/openspec/changes/refactor-truegrowth-ui-system/tasks.md

1. UI Foundation

• 1.1 Add local apps/web/src/ui component entry
• 1.2 Add core components for buttons, fields, cards, overlays, tabs, tooltip, toast, table, badges, progress, and page templates
• 1.3 Import UI styles into the global app stylesheet
• 1.4 Add @/ui TypeScript path alias

2. Documentation and Templates

• 2.1 Add TrueGrowth UI system documentation
• 2.2 Add list-page, form-page, and generator-page templates
• 2.3 Document TDesign compatibility boundary and Lucide-only rule
• 2.4 Add /image AI image-generation golden page standard
• 2.5 Add media-library and status page templates derived from the golden page

3. Guard Rails

• 3.1 Add static UI system check script
• 3.2 Block new app imports of tdesign-react
• 3.3 Block new app imports of tdesign-icons-react
• 3.4 Block common hard-coded blue primary colors in app UI
• 3.5 Require the golden page standard and templates in the UI system check

4. Golden Page Migration

• 4.1 Browser-audit every navigation-entered first-level route against /image
• 4.2 Migrate /video to the golden generator layout and verify with screenshots
• 4.3 Migrate /avatar dialogs, image/video grids, and creation flow to the golden generator/media layout
• 4.4 Migrate /assets to the golden media-library layout
• 4.5 Migrate /publish, /tasks, /models, /settings, and /workflow shell/dialog surfaces to the golden status/settings layout
• 4.6 Verify every migrated route in light and dark mode with browser screenshots and one primary interaction

5. Validation

• 5.1 Run UI system static check
• 5.2 Run pnpm nx run web:typecheck
• 5.3 Run pnpm build:web