Files
Codewalkers/docs/wireframes/initiatives-list.md
Lukas May 89db580ca4 docs: Add ASCII wireframe mockups for all frontend pages
Covers: app layout, initiatives list, initiative detail (4 tabs),
agents page, inbox, settings (health + projects), and all dialogs.
2026-03-02 17:28:14 +09:00

115 lines
6.1 KiB
Markdown

# Initiatives List (`/initiatives`)
Main dashboard showing all initiatives with progress tracking and quick actions.
## Default State
```
+============================================================================+
| CODEWALK DISTRICT |
| [*Initiatives*] [ Agents ] [ Inbox ] [ Settings ] |
+============================================================================+
| |
| Initiatives [All v] [ + New Initiative ] |
| |
| +----------------------------------------------------------------------+ |
| | Auth System Overhaul ACTIVE [=====> ] 3/7 phases | |
| | | |
| | [ View ] [Spawn Architect v] [ ... ] | |
| +----------------------------------------------------------------------+ |
| |
| +----------------------------------------------------------------------+ |
| | Mobile App Redesign ACTIVE [==> ] 1/5 phases | |
| | | |
| | [ View ] [Spawn Architect v] [ ... ] | |
| +----------------------------------------------------------------------+ |
| |
| +----------------------------------------------------------------------+ |
| | API Documentation COMPLETED [========] 4/4 phases | |
| | | |
| | [ View ] [Spawn Architect v] [ ... ] | |
| +----------------------------------------------------------------------+ |
| |
+============================================================================+
```
## Status Filter Dropdown
```
[ All v]
+--------------+
| All |
| Active |
| Completed |
| Archived |
+--------------+
```
## Initiative Card Detail
```
+------------------------------------------------------------------------+
| Initiative Name |
| |
| [STATUS] [==========> ] 3/7 phases |
| |
| [ View ] [Spawn Architect v] [ ... ] |
+------------------------------------------------------------------------+
| |
v v
+------------+ +----------+
| Discuss | | Archive |
| Plan | | Delete |
+------------+ +----------+
```
- **Status badge**: Color-coded (green=active, grey=completed, etc.)
- **Progress bar**: Green when 100%, blue otherwise
- **Spawn Architect dropdown**: Discuss / Plan options
- **More menu (...)**: Archive / Delete (with `window.confirm`, Shift+click bypasses)
## Empty State
```
+============================================================================+
| |
| Initiatives [ + New Initiative ] |
| |
| |
| No initiatives yet |
| |
| [ Create your first initiative ] |
| |
| |
+============================================================================+
```
## Loading State
```
+============================================================================+
| |
| Initiatives [ + New Initiative ] |
| |
| +----------------------------------------------------------------------+ |
| | ░░░░░░░░░░░░░░░░░░░░░░░ | |
| | ░░░░░░░░░░░░░ | |
| +----------------------------------------------------------------------+ |
| +----------------------------------------------------------------------+ |
| | ░░░░░░░░░░░░░░░░░░░░░░░ | |
| | ░░░░░░░░░░░░░ | |
| +----------------------------------------------------------------------+ |
| +----------------------------------------------------------------------+ |
| | ░░░░░░░░░░░░░░░░░░░░░░░ | |
| | ░░░░░░░░░░░░░ | |
| +----------------------------------------------------------------------+ |
| |
+============================================================================+
```
## Source
- `packages/web/src/routes/initiatives/index.tsx`
- `packages/web/src/components/InitiativeList.tsx`
- `packages/web/src/components/InitiativeCard.tsx`