0ff65b0b02
Update all user-facing strings (HTML title, manifest, header logo, browser title updater), code comments, and documentation references. Folder name retained as-is.
12 KiB
12 KiB
Initiative Detail Wireframe
The Initiative Detail screen shows the hierarchical breakdown of an initiative into phases and tasks. It provides visibility into progress, dependencies, and agent assignments.
ASCII Wireframe
+--------------------------------------------------------------------------------+
| <- Back to Dashboard INITIATIVE DETAIL [Actions]|
+--------------------------------------------------------------------------------+
| |
| +--------------------------------------------------------------------------+ |
| | # User Authentication System [ACTIVE] | |
| | Created: 2026-01-15 | Updated: 2026-02-01 | By: user | |
| +--------------------------------------------------------------------------+ |
| |
| +---------------------------+ +--------------------------------------------+ |
| | PROGRESS | | KEY DECISIONS | |
| | | | | |
| | [==========------] 67% | | v Authentication Method | |
| | | | JWT with httpOnly cookies | |
| | Phases: 2/3 complete | | Reason: XSS protection, refresh tokens | |
| | Tasks: 18/27 complete | | | |
| | | | v Token Expiry | |
| +---------------------------+ | 15min access / 7d refresh | |
| | Reason: Balance security & UX | |
| | | |
| | > Session Storage (collapsed) | |
| | > Password Policy (collapsed) | |
| +--------------------------------------------+ |
| |
| +---------------------------------------------------------------------------+ |
| | PHASES [Queue All] | |
| +---------------------------------------------------------------------------+ |
| |
| v Phase 1: Core Infrastructure ------------------------------------ COMPLETE |
| | |
| |-- Task: Initialize repository --------------------------------- DONE |
| |-- Task: Configure TypeScript ---------------------------------- DONE |
| |-- Task: Setup build pipeline ---------------------------------- DONE |
| |-- Task: Create bin entry -------------------------------------- DONE |
| |-- Task: Add commander integration ----------------------------- DONE |
| |-- Task: Create ProcessManager --------------------------------- DONE |
| |-- Task: Implement graceful shutdown --------------------------- DONE |
| +-- Task: Add signal handlers ----------------------------------- DONE |
| |
| v Phase 2: Data Layer ----------------------------------------- IN PROGRESS |
| | |
| |-- Task: Create schema ----------------------------------------- DONE |
| |-- Task: Run migrations --------------- [gastown] --------- IN PROGRESS |
| |-- Task: User repository -------------------- [blocked] ------- PENDING |
| | ^ blocked by: Run migrations |
| |-- Task: Task repository -------------------- [blocked] ------- PENDING |
| | ^ blocked by: Run migrations |
| +-- Task: Init repository -------------------- [blocked] ------- PENDING |
| ^ blocked by: User repository, Task repository |
| |
| > Phase 3: Git Integration (0/6 tasks) ----------------------------- PENDING |
| ^ blocked by: Phase 2 |
| |
+----------------------------------------------------------------------------------+
Legend:
v = Expanded section (click to collapse)
> = Collapsed section (click to expand)
^ = Dependency indicator
Status Indicators:
DONE / COMPLETE = Task/phase finished
IN PROGRESS = Currently being worked on
PENDING = Not yet started
BLOCKED = Has unresolved dependencies
[agent-name] = Agent assigned to task
Expanded View: Task with Agent
+-- Task: Run migrations -------------------------------------------- IN PROGRESS
|
| Assigned to: gastown Started: 2026-02-01 14:30
| Worktree: ~/.cw-worktrees/gastown Duration: 12m 34s
|
| +------------------------------------------------------------------+
| | Last output (3 min ago): |
| | > Running migration 003_add_sessions... |
| | > Creating index on sessions.user_id... |
| +------------------------------------------------------------------+
|
| [View Logs] [View Worktree] [Stop Agent]
Expanded View: Blocked Task with Dependencies
+-- Task: Init repository --------------------------------------------- PENDING
|
| ^ Blocked by:
| | Task: User repository (PENDING)
| | Task: Task repository (PENDING)
|
| Dependencies must complete before this task can start.
|
| [Spawn Agent] (disabled - blocked)
Component Specifications
PhaseAccordion
Container for a phase that can be expanded/collapsed to show its tasks.
Props:
| Prop | Type | Description |
|---|---|---|
phase |
Phase |
Phase entity with status, number, name |
tasks |
Task[] |
Tasks belonging to this phase |
expanded |
boolean |
Whether section is expanded |
onToggle |
() => void |
Toggle expand/collapse |
Behavior:
- Default: First incomplete phase expanded, completed phases collapsed
- Click header to toggle expand/collapse
- Shows phase status badge (COMPLETE, IN PROGRESS, PENDING, BLOCKED)
- Shows task count:
(completed/total tasks) - Shows dependency indicator if blocked by another phase
TaskRow
Single task row with status, assignment, and actions.
Props:
| Prop | Type | Description |
|---|---|---|
task |
Task |
Task entity with title, status, assigned_to |
depth |
number |
Nesting depth for indentation |
isLast |
boolean |
Whether this is last sibling (affects connector) |
Behavior:
- Click row opens TaskDetailModal
- Shows agent name inline if assigned:
[agent-name] - Shows status: DONE, IN PROGRESS, PENDING, BLOCKED
- Pending tasks show "Spawn Agent" on hover
- Tree connectors:
|--for siblings,+--for last item
DependencyIndicator
Shows what's blocking a task or phase.
Props:
| Prop | Type | Description |
|---|---|---|
blockedBy |
Dependency[] |
Array of blocking items |
type |
'task' | 'phase' |
What level this dependency is at |
Behavior:
- Renders
^symbol with hover tooltip - Clicking shows full dependency path
- Format:
blocked by: {task/phase name}
DecisionList
Collapsible list of key decisions made for this initiative.
Props:
| Prop | Type | Description |
|---|---|---|
decisions |
Decision[] |
Array of {topic, decision, reason} |
maxVisible |
number |
How many to show before "show more" |
Behavior:
- Each decision is collapsible (topic visible, details expand)
vprefix for expanded,>for collapsed- Shows topic as header, decision and reason as details
ProgressPanel
Shows overall progress metrics for the initiative.
Props:
| Prop | Type | Description |
|---|---|---|
phasesComplete |
number |
Completed phases count |
phasesTotal |
number |
Total phases |
tasksComplete |
number |
Completed tasks count |
tasksTotal |
number |
Total tasks |
Behavior:
- Progress bar shows percentage based on tasks
- Breakdown by phase and task counts
Interaction Notes
Click Actions
| Element | Action |
|---|---|
| Phase header | Expand/collapse phase |
| Task row | Opens TaskDetailModal |
Agent name [gastown] |
Navigates to agent detail view |
| "Spawn Agent" button | Opens agent spawn dialog for this task |
| "Queue Phase" button | Dispatches all pending tasks in phase to queue |
| "Queue All" button | Dispatches all pending tasks across all phases |
| Back button | Returns to Initiative Dashboard |
| Decision topic | Expand/collapse decision details |
TaskDetailModal
When clicking a task row, a modal opens with:
+------------------------------------------------------+
| Task: Run migrations [X] |
+------------------------------------------------------+
| |
| Status: IN PROGRESS Priority: Normal |
| Phase: Data Layer Started: 14:30 |
| Assigned: gastown |
| |
| Description: |
| Run database migrations for user and session |
| tables. Verify indexes created correctly. |
| |
| Dependencies: |
| - Task: Create schema (DONE) |
| |
| Blocks: |
| - Task: User repository |
| - Task: Task repository |
| |
| [View Agent Logs] [Stop Task] [Mark Complete] |
+------------------------------------------------------+
Agent Spawn Dialog
When clicking "Spawn Agent" on a pending task:
+------------------------------------------------------+
| Spawn Agent for Task [X] |
+------------------------------------------------------+
| |
| Task: User repository |
| Phase: Data Layer |
| |
| Agent name: [auto-generated: yaletown] |
| Mode: [Execute v] |
| |
| The agent will: |
| 1. Create isolated git worktree |
| 2. Execute the task |
| 3. Report completion or questions |
| |
| [Cancel] [Spawn Agent] |
+------------------------------------------------------+
Status Colors
| Status | Color | Meaning |
|---|---|---|
| COMPLETE / DONE | Green | Work finished |
| IN PROGRESS / ACTIVE | Blue | Currently being worked |
| PENDING | Gray | Not yet started |
| BLOCKED | Orange | Has unresolved dependencies |
Responsive Considerations
- On narrow screens, collapse the KEY DECISIONS panel
- Phase tree maintains full width for readability
- Task rows truncate long titles with ellipsis
- Agent names link to agent detail in all views
Wireframe for: Initiative Detail Screen Part of: Codewalkers Frontend Design