Covers: app layout, initiatives list, initiative detail (4 tabs), agents page, inbox, settings (health + projects), and all dialogs.
155 lines
6.5 KiB
Markdown
155 lines
6.5 KiB
Markdown
# Content Tab (`?tab=content`)
|
|
|
|
Two-column layout: page tree sidebar + rich text editor with refine agent panel.
|
|
|
|
## Default State (editing a page)
|
|
|
|
```
|
|
+============================================================================+
|
|
| < Back |
|
|
| Auth System Overhaul [ACTIVE] [YOLO] [git] main [P] backend |
|
|
| [*Content*] [ Plan ] [ Execution ] [ Review ] |
|
|
+============================================================================+
|
|
| | |
|
|
| Pages | [Refine with Agent] Saving... |
|
|
| | |
|
|
| > Root | Overview |
|
|
| > Auth | ___________________________________________________________ |
|
|
| > API | |
|
|
| > + | The authentication system needs a complete overhaul to |
|
|
| > + | support OAuth 2.0 and multi-tenant configurations. |
|
|
| | |
|
|
| | ## Current Problems |
|
|
| | |
|
|
| | - Session tokens expire too frequently |
|
|
| | - No support for SSO providers |
|
|
| | - Password reset flow is broken on mobile |
|
|
| | |
|
|
| | ## Proposed Solution |
|
|
| | |
|
|
| | Migrate to JWT-based auth with refresh token rotation... |
|
|
| | |
|
|
| 192px | flex-1 |
|
|
+============================================================================+
|
|
```
|
|
|
|
## Page Tree Sidebar (192px, border-right)
|
|
|
|
```
|
|
+-----------+
|
|
| Pages |
|
|
| |
|
|
| > Root Page Title [+] <-- hover shows + to add child
|
|
| > Auth Overview [+]
|
|
| > Login Flow <-- active page highlighted
|
|
| > Token Design
|
|
| > API Design [+]
|
|
| > Database Schema [+]
|
|
| |
|
|
+-----------+
|
|
```
|
|
|
|
- FileText icon + truncated title per node
|
|
- Active page gets accent background
|
|
- Hover reveals `+` button to create child page
|
|
- Indentation: 12px per depth level
|
|
- Click navigates to page
|
|
|
|
## Title Input
|
|
|
|
```
|
|
Overview___________________________
|
|
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
3xl bold, transparent bg, no border
|
|
Editable inline, auto-saves on blur
|
|
```
|
|
|
|
## Tiptap Editor
|
|
|
|
Rich text editor with:
|
|
- StarterKit (headings, lists, bold, italic, code blocks, etc.)
|
|
- Slash commands (type `/` to trigger command palette)
|
|
- Page links (inline links to other pages in the tree)
|
|
- Auto-save via `useAutoSave` hook (debounced)
|
|
|
|
## Refine Agent Panel States
|
|
|
|
### Idle (no agent)
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| [sparkles] Refine with Agent |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
Clicking opens `<RefineSpawnDialog>`.
|
|
|
|
### Running
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| [spinner] Architect is refining... |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
### Waiting for Input (questions)
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| +------------------------------------------------------------------+ |
|
|
| | Q1: Should we include OAuth 2.0 PKCE flow? | |
|
|
| | ( ) Yes, include PKCE | |
|
|
| | ( ) No, standard auth code flow is fine | |
|
|
| | ( ) Let me specify: [________________] | |
|
|
| | | |
|
|
| | Q2: Which identity providers should we support? | |
|
|
| | [x] Google | |
|
|
| | [ ] GitHub | |
|
|
| | [x] Microsoft | |
|
|
| | | |
|
|
| | [ Cancel ] [ Dismiss ] [ Send Answers ]| |
|
|
| +------------------------------------------------------------------+ |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
### Completed (with changes)
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| [v] Agent completed |
|
|
| +------------------------------------------------------------------+ |
|
|
| | [v] ChangeSet: 3 changes [>] expand | |
|
|
| | | |
|
|
| | + page "OAuth Flow" | |
|
|
| | ~ page "Auth Overview" (modified) | |
|
|
| | + page "Token Rotation" | |
|
|
| | | |
|
|
| | [ Revert ] [ Dismiss ] | |
|
|
| +------------------------------------------------------------------+ |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
### Completed (no changes)
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| Agent completed -- no changes made. [ Dismiss ] |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
### Crashed
|
|
|
|
```
|
|
+------------------------------------------------------------------------+
|
|
| [!] Agent crashed unexpectedly. [ Retry ] |
|
|
+------------------------------------------------------------------------+
|
|
```
|
|
|
|
## Source
|
|
|
|
- `packages/web/src/components/editor/ContentTab.tsx`
|
|
- `packages/web/src/components/editor/PageTree.tsx`
|
|
- `packages/web/src/components/editor/RefineAgentPanel.tsx`
|
|
- `packages/web/src/components/QuestionForm.tsx`
|
|
- `packages/web/src/components/ChangeSetBanner.tsx`
|