DOC20_R3_CHANGE_LIST.md
Design Mockups/DOC20 Mockups/DOC20_R3_CHANGE_LIST.md
# DOC20 R2.4 → R3 — Complete Change List
## Audited from Q Unified Workspace mockup evolution (V4 → V7.3)
---
## A. STRUCTURAL ARCHITECTURE CHANGES
1. **Browser column: 4 modes (Nav added)**
- Nav tab (compass icon) is the primary app navigation surface
- Replaces the need for a long left sidebar menu
- Contains: Conversations, Activity link, Pages (9 nav links), Open Tabs switcher
- Auto-switching: note→Notes, web→Web, chat/utility→Nav, doc→Browser
2. **Tab system: expanded types**
- New types: chat (💬 green), room (👥 indigo), task (✅ amber), utility (⚙️ gray), panel, forum
- All types render in tab bar with icons and colors
- Existing types preserved: note, doc, web, clips
3. **Transient utility tabs**
- Blue outline border (not dashed), insert at leftmost position
- One at a time — opening new utility replaces existing
- Persist when navigating away (do NOT auto-close) — correction from original instruction
- Right-click → "Pin (keep open)" makes permanent
- No "transient" label in content area
4. **Duplicate tab prevention**
- openTab() checks existing tabs by title+type
- Switches to existing instead of creating duplicate
- Shows toast: "Already open — switched to tab"
5. **Left nav rail: simplified to 6 items**
- Q logo, browser toggle (⌘B), divider, activity bell (with red badge count), settings gear, divider, chat column toggle (bottom)
- Everything else accessed via Nav tab or [+] dropdown
6. **Right chat column (separate from Ask panel)**
- 320px, collapsible via left rail speech bubble toggle
- Independent of Ask Agent panel — different column at app's right edge
- Contains: chat selector dropdown, message history, input bar with send button
- Ask panel opens WITHIN workspace; chat column at app edge
7. **[+] dropdown expanded**
- Create section: New Note, New Chat, New Web Tab, New Incognito Tab
- Open section: Chats, Tasks, Projects, Knowledge Manager, Agents, Settings
- Saved Groups section (bottom, only shows when saved groups exist)
- Opens leftward (right:0) when button is far right to prevent overflow
8. **Chats management page**
- Opens as utility tab from Nav "See all →" or [+] → Open → Chats
- Search bar, filter pills (All/Starred/Active/Archived)
- Conversation list: star toggle, name, preview, timestamp, project badge
- Click conversation → opens as persistent chat tab
---
## B. ASK AGENT PANEL CHANGES
9. **Unified "Ask {agent.name}" entry point**
- Single button in toolbar, no separate "Send to Chat"
- Agent name always dynamic via variable — zero hardcoded "Elnor"
10. **Context card at top of panel**
- Shows tab icon, title, type info (word count for web, "PDF document" for docs, "Tiptap note" for notes)
11. **Include checkboxes**
- "Content + comments", "Active project context", "Session clips", "Pinned pages"
- Each independently toggleable per-send
12. **Attachment button**
- Paperclip icon + "Attach" button + "Drag files here or click" hint
- Below the auto-reference line
13. **Inline agent response**
- After sending, response card appears below send button in same panel
- Shows: agent avatar, name, response text, timestamp
- "Continue in full chat →" link opens chat tab with exchange as context
14. **Quick Actions (web tabs)**
- Save as Artifact, Save as Note, Pin to project
- Only shown for web tab type
---
## C. BROWSER COLUMN DETAILS
15. **Folders is a scope (not an overlay)**
- Dotted-border Folders button toggles activeScope="Folders"
- Opens in the resizable scope detail area (same as Project, Places, etc.)
- Full CRUD: create root folders, subfolders, rename (inline), delete (Yes/No)
- Scrollable, resizable via splitter (default 150px, max 400px)
- Splitter handle: 6px tall, highlights blue on hover
- No "Drag to folders" overlay anymore
- Removed "Folders" from scope chip list (only the dotted button remains)
16. **Scope chips: 5 items**
- Collection, Project, Bucket, Places, Saved Views
- Plus the dotted Folders button (visually distinct, marginLeft:4)
17. **Type chips: 17 items**
- Added Panel and Forum to existing 15
- Panels/forums open in tabs separately from config pages
18. **Places list: single line**
- Title only, 28px height, tighter padding
- Full path on hover (title attribute)
- Right-click → "Open in Finder"
- Only shows "missing" badge when status is missing; no "ok" badge
- Click opens folder file list (scrollable)
19. **Search toggle**
- "This View" / "Everywhere" button in search bar
- Controls search scope
---
## D. NOTES BROWSER
20. **Layout: folders at top, flat list below**
- Folder tree in bounded area (maxHeight, scrollable)
- Divider with "All Notes · {count}" + independent sort dropdown
- Flat sortable list of all notes below
- Two INDEPENDENT sort dropdowns (folder area vs. all-notes list)
21. **Note rows: single line format**
- 30px height, pin icon → title (11.5px regular weight) → comment count → time on right
- No two-line format, no bold titles
22. **Note folder management**
- Rename (inline input, hover → edit icon)
- Delete (Yes/No confirmation, notes kept/unfiled)
- Create subfolder (hover → + icon)
- Draggable folders for reorder
---
## E. WEB / BOOKMARKS BROWSER
23. **Tab renamed: "Bookmarks" → "Web"**
- Globe icon (with proper meridian lines, not circle+line)
24. **Full Chrome-like bookmark management**
- Folders with rename/delete/subfolder (all inline)
- Bookmark items with rename/delete
- Favicon squares: 14px colored rounded squares with domain initial in white
- Search across all folders
- "Recent Pages" section separate from saved bookmarks
- Footer: bookmark count + folder count
25. **Web tab favicons**
- Web page tabs should show favicon (colored square with domain initial)
- Same system as bookmark favicons
- NOT YET IMPLEMENTED in mockup — noted for next version
---
## F. TAB BAR & GROUPS
26. **Tab bar color system (design tokens)**
- Tab bar background: #d5d8dc
- Inactive tabs: #f0f2f4
- Active tab: #FFFFFF (white)
- Selected tabs: #d0d5db
- Incognito active: #4a4a4a, inactive: #555
- Utility tab: 1px solid accentBtn border (30% inactive, 60% active)
27. **Tab group text: dark (c.textPri)**
- Not group color — was unreadable (green on green)
- Group identified by colored dot + colored background pill (opacity 30%)
28. **Saved tab groups in [+] dropdown**
- Removed folder icon button from tab bar
- "Saved Groups" section at bottom of [+] dropdown
- Shows when saved groups exist, click to restore
29. **Tab context menu additions**
- Copy (writes tab title to clipboard)
- Pin (keep open) — for utility tabs
- Rename — for note AND clips tabs (both, not just notes)
30. **Browser toggle button**
- Sidebar panel icon (vertical divider in rectangle)
- Flush left, no background, 26×36px, 3px marginRight
- Same background as tab bar (transparent)
---
## G. CONTENT AREA
31. **Clips = Notes (unified renderer)**
- Same toolbar, same blocks, same module picker
- Only difference: purple accent, auto-populated clip blocks
- Clip blocks have delete (X) button
- Clipping works from BOTH web tabs AND document tabs
- Doc toolbar needs Clip button added
32. **Content fills available width**
- No artificial maxWidth constraints on notes, documents, web
- Content spans browser edge to right panel edge
33. **No project indicator in status bar**
- Status bar shows: session timer, clip count, tab count, downloads, "New Session" link, zoom
- No project badge
34. **Note settings dropdown**
- Auto-save toggle, Spell check toggle, Show word count toggle
- Default agent display, Template selector link
- "All note settings…" for full page
---
## H. SESSION SYSTEM
35. **Session naming convention**
- Pattern: "Clips: {M.D}-{N}" (e.g., "Clips: 4.4-1")
- Period between date parts, dash before sequence number
36. **Session auto-create**
- On Q launch, if no session exists, one is created automatically
- Clips note created in Session Notes folder
- Opens as tab when first clip is made
37. **Session close triggers**
- Quit Q
- Click "New Session" in status bar
- 2 hours of idle (no mouse/keyboard)
- Closing does NOT delete clips note — persists forever
- New session increments sequence number
---
## I. BEHAVIORAL / CROSS-DOC
38. **PDF interception**
- Workspace intercepts PDF opens and routes to document viewer
- Not system default app
39. **Downloads tray**
- Collapsible bottom tray with progress bars and "Open" links
- Shows in status bar as count when collapsed
40. **Reader mode (web)**
- Switches typography (Georgia → sans-serif), narrows width, shows "READER MODE" badge
- Toggle in web toolbar
41. **Block module system (spec sections needed)**
- Task lists: add/toggle/subtask, expand, Done section, @Agent per-task
- Threads: reply, collapse, context quote
- Feeds: presets, custom config (source type, instruction, interval, show-last-N, mode, expiry)
- Notice bars
- 3-step module picker: choose → feed presets (System/Agent/Custom tabs) → custom feed config form
- Feed presets and custom configs need §6.18.2 content registry entries
42. **Font decision**
- Working/mockup font: IBM Plex Sans (Google Fonts)
- Production: Söhne (licensed, Klim Type Foundry) or final selection TBD
- fontWeight:400 for regular text (not 450)
43. **Bubble menu positioning**
- Clamped to content area (position:relative on editorRef)
- Cannot overflow into browser column
44. **Browser search "This View" / "Everywhere" toggle**
- Button in search bar controls scope