89db580ca4
Covers: app layout, initiatives list, initiative detail (4 tabs), agents page, inbox, settings (health + projects), and all dialogs.
226 lines
9.8 KiB
Markdown
226 lines
9.8 KiB
Markdown
# Plan Tab (`?tab=plan`)
|
|
|
|
Two-column layout: phase sidebar (260px) + phase detail panel.
|
|
|
|
## Default State (phases exist, one selected)
|
|
|
|
```
|
|
+============================================================================+
|
|
| < Back |
|
|
| Auth System Overhaul [ACTIVE] [YOLO] [git] main [P] backend |
|
|
| [ Content ] [*Plan*] [ Execution ] [ Review ] |
|
|
+============================================================================+
|
|
| | |
|
|
| PHASES [+][detail] Phase 2: Implement OAuth [READY] [...] |
|
|
| | |
|
|
| +--------+ | +--------------------------------------------------------+ |
|
|
| | 1. DB | | | | |
|
|
| | Schema | | | Implement the OAuth 2.0 authorization code flow | |
|
|
| | [DONE] | | | with PKCE extension for public clients. | |
|
|
| | 3/3 | | | | |
|
|
| +--------+ | | Support Google, GitHub, and Microsoft as identity | |
|
|
| +--------+ | | providers with configurable scopes. | |
|
|
| | 2. OAuth| | | | |
|
|
| | Flow | | +--------------------------------------------------------+ |
|
|
| |*[READY]*| | |
|
|
| | 0 tasks| | Dependencies |
|
|
| | dep: 1 | | [+ Add dependency v] |
|
|
| +--------+ | * Phase 1: DB Schema [DONE] [x] |
|
|
| +--------+ | |
|
|
| | 3. UI | | Tasks (0/5) |
|
|
| | [PEND] | | ├── Set up OAuth routes [PENDING] [x] |
|
|
| | 5 tasks| | ├── Implement PKCE flow [PENDING] [x] |
|
|
| | dep:1,2| | ├── Google provider adapter [RUNNING] agent-1 [x] |
|
|
| +--------+ | ├── GitHub provider adapter [BLOCKED] [x] |
|
|
| | | blocked by: Google provider adapter |
|
|
| 260px | └── Microsoft provider adapter [PENDING] [x] |
|
|
| | |
|
|
+============================================================================+
|
|
```
|
|
|
|
## Phase Sidebar
|
|
|
|
```
|
|
+------------+
|
|
| PHASES [+][sparkles] <-- [+] adds phase, [sparkles] details all phases
|
|
| |
|
|
| +--------+ |
|
|
| | 1 | | Phase number
|
|
| | DB | | Phase name (truncated)
|
|
| | Schema | |
|
|
| | [DONE] | | StatusBadge (small)
|
|
| | 3/3 | | "X/Y tasks" count
|
|
| +--------+ |
|
|
| +--------+ |
|
|
| |*2 *| | * = active/selected (left blue border + accent bg)
|
|
| | OAuth | |
|
|
| | Flow | |
|
|
| |[READY] | |
|
|
| | 0 tasks| | "Needs decomposition" if 0 tasks
|
|
| | dep: 1 | | "depends on: Phase X" (if dependencies)
|
|
| +--------+ |
|
|
| |
|
|
| [New phase name___] <-- inline input when adding
|
|
| |
|
|
+------------+
|
|
```
|
|
|
|
## Phase Actions (sidebar header)
|
|
|
|
```
|
|
PHASES [Detailing (2)] [+] [Detail All]
|
|
^^^^^^^^^^^^^^ ^^^^^^^^^^^
|
|
spinner when agents sparkles icon
|
|
are detailing disabled if no eligible phases
|
|
```
|
|
|
|
## Phase Detail Panel
|
|
|
|
### Header
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| Phase 2: Implement OAuth Flow [READY] [git] branch [...] |
|
|
| | |
|
|
| branch badge v
|
|
| +--------+
|
|
| | Delete |
|
|
| | Phase |
|
|
| +--------+
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
- Phase name is editable (click to toggle inline input)
|
|
- `[...]` dropdown: Delete Phase
|
|
|
|
### When No Tasks and No Agent Running
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| Phase 2: Implement OAuth Flow [READY] [ Detail Tasks ] |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
### Detailing In Progress
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| Phase 2: Implement OAuth Flow [READY] [spinner] Detailing |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
### Pending Review Banner
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| [!] This phase is pending review. Go to the Review tab to review. |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
### Phase Content Editor
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| Implement the OAuth 2.0 authorization code flow with PKCE |
|
|
| extension for public clients. |
|
|
| |
|
|
| Support Google, GitHub, and Microsoft as identity providers |
|
|
| with configurable scopes. |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
Tiptap editor, auto-saves via `usePhaseAutoSave`.
|
|
|
|
### Dependencies Section
|
|
|
|
```
|
|
Dependencies
|
|
[+ Add dependency v] <-- dropdown of other phases
|
|
* Phase 1: DB Schema [DONE] [x] <-- status dot + remove button
|
|
* Phase 4: Testing [PENDING] [x]
|
|
```
|
|
|
|
### ChangeSet Banner (after detail agent completes)
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| [v] 5 tasks created [>] expand |
|
|
| |
|
|
| + task "Set up OAuth routes" |
|
|
| + task "Implement PKCE flow" |
|
|
| + task "Google provider adapter" |
|
|
| + task "GitHub provider adapter" |
|
|
| + task "Microsoft provider adapter" |
|
|
| |
|
|
| [ Revert ] [ Dismiss ] |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
### Tasks Section
|
|
|
|
```
|
|
Tasks (3/5)
|
|
|
|
├── Set up OAuth routes [PENDING] [x]
|
|
├── Implement PKCE flow [PENDING] [x]
|
|
├── Google provider adapter [RUNNING] agent: blue-fox-7 [x]
|
|
├── GitHub provider adapter [BLOCKED] [x]
|
|
| blocked by: Google provider adapter
|
|
└── Microsoft provider adapter [PENDING] [x]
|
|
```
|
|
|
|
- Tree connectors: `├──` for middle items, `└──` for last
|
|
- Agent name links to `/inbox` when assigned
|
|
- Delete `[x]` appears on hover (Shift+click bypasses confirm)
|
|
- `<DependencyIndicator>` shown below blocked tasks
|
|
- Clicking a task row opens `<TaskDetailModal>`
|
|
|
|
## Empty State (no phases)
|
|
|
|
```
|
|
+============================================================================+
|
|
| | |
|
|
| PHASES [+] | |
|
|
| | No phases yet |
|
|
| | |
|
|
| | [spinner] Planning phases... |
|
|
| | -- or -- |
|
|
| | [sparkles Plan Phases] or [ Add Phase ] |
|
|
| | |
|
|
+============================================================================+
|
|
```
|
|
|
|
## Task Detail Modal (overlay)
|
|
|
|
```
|
|
+----------------------------------------------------------+
|
|
| Set up OAuth routes [x] |
|
|
| |
|
|
| Status [PENDING] | Priority normal |
|
|
| Phase 2. OAuth Flow | Type execute |
|
|
| Agent (none) | |
|
|
| |
|
|
| Description |
|
|
| Create Express routes for /auth/login, /auth/callback, |
|
|
| and /auth/logout with proper middleware chain. |
|
|
| |
|
|
| Dependencies |
|
|
| * DB Schema Migration [DONE] |
|
|
| |
|
|
| Blocks |
|
|
| * GitHub provider adapter [BLOCKED] |
|
|
| |
|
|
| [ Queue Task ] [ Stop Task ] |
|
|
+----------------------------------------------------------+
|
|
```
|
|
|
|
## Source
|
|
|
|
- `packages/web/src/components/ExecutionTab.tsx`
|
|
- `packages/web/src/components/execution/PhaseSidebarItem.tsx`
|
|
- `packages/web/src/components/execution/PhaseDetailPanel.tsx`
|
|
- `packages/web/src/components/execution/PhaseActions.tsx`
|
|
- `packages/web/src/components/execution/PlanSection.tsx`
|
|
- `packages/web/src/components/TaskRow.tsx`
|
|
- `packages/web/src/components/TaskDetailModal.tsx`
|