docs: add webui gap analysis vs mockups

Gap analysis documents delta between current implementation
and mockup designs across all pages. Includes priority ranking
based on epic phases.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Author: nextlevelshit

docs/scope/webui-gap-analysis.md

@@ -0,0 +1,208 @@
+# WebUI Gap Analysis — Mockups vs Implementation
+
+**Date:** 2026-05-03
+**Baseline:** Epic #1624 alpha branch, `data-theme="dark"` fix committed (9b5b8d6f)
+**Mockup source:** `docs/scope/mockups/`
+
+---
+
+## Migration Status (from epic #1624)
+
+| Page | Status | Notes |
+|------|--------|-------|
+| /work | migrated | w-nav + w-container + bindings list |
+| /work/:forge/:repo/:num | migrated | "Run" disabled until #2.4 wiring |
+| /runs | migrated | w-nav + w-page-header + filter badges |
+| /pipelines | migrated | w-nav + w-page-header + filter badges |
+| /proposals | migrated | status filter pills |
+| /proposals/:id | partial | No approve/reject, no signal sidebar |
+| /issues | migrated | w-list |
+| /prs | migrated | w-list |
+| /contracts | migrated | w-list |
+| /personas | migrated | w-list |
+| /skills | migrated | w-list |
+| /compose | migrated | w-list |
+| /analytics | migrated | w-list |
+| /retros | migrated | w-list |
+| /health | migrated | w-nav + w-page-header |
+| /onboard | migrated | w-nav + w-container |
+| /admin | migrated | sidebar layout |
+
+**Design system:** COMPLETE — all pages use `w-nav`, `w-container`, `w-page-header`, `badge`, `w-btn`
+**Dark mode:** FIXED — `data-theme="dark"` on all 18 page templates
+
+---
+
+## Gap Detail
+
+### 1. Work Board (`/work`) — Missing filterbar + actions
+
+**Mockup (02-work-board.html):**
+- `<div class="filterbar">` with 4 `<select>` elements (forge, kind, state, label) + search input
+- "Refresh" + "New work" buttons in page-header
+- Work item list rows with: icon, title+badge, meta (forge, author, tags), kind badge, status badge, action button
+- Pagination: "6 of 23 items shown · load more"
+
+**Actual (`/work`):**
+- No filterbar
+- No "Refresh" or "New work" buttons
+- Shows bindings table, not work items
+- No pagination
+
+**Gap:** filterbar, action buttons, work item list (bindings list ≠ work items)
+
+---
+
+### 2. Work Item Detail (`/work/:forge/:repo/:num`) — Disabled dispatch + missing binding picker
+
+**Mockup (03-work-item.html):**
+- Breadcrumb: Work › forge/repo › issue #N
+- Issue body in `.card`
+- Binding picker radio list (impl-issue, research, scope with cost/time estimates)
+- `<details>` with custom pipeline/adapter/model/budget/detached/notes options
+- "Run impl-issue" + "Dry-run" buttons
+- Recent runs list
+- Aside: Item dl, Suggested binding card, Live cost forecast card
+
+**Actual:**
+- "Run on this issue" button disabled (shows "disabled — wires up in #2.4")
+- No binding picker UI
+- No cost forecast card
+- No recent runs section
+- Hint: "Could not fetch live details"
+
+**Gap:** Dispatch wiring (#2.4), binding picker, cost forecast, recent runs
+
+---
+
+### 3. Evolution Proposal Detail (`/proposals/:id`) — No action UI
+
+**Mockup (04-evolution-proposal.html):**
+- Breadcrumb: Proposals › #ID
+- Status badge (awaiting approval) + propose metadata in page-header
+- Approve & activate + Reject + Settings buttons
+- Trigger signal explanation hint
+- Tab bar: Diff | Signal log | Validation | Replay
+- Diff block with syntax highlighting
+- Replay forecast signal-list
+- Aside: trigger signals grid, version dl, generated by dl, related proposals
+
+**Actual (`/proposals/detail.html`):**
+- Page title + back link
+- Status badge (proposed/approved/rejected)
+- No approve/reject buttons
+- No signal sidebar (judge score, retry rate, top failure, avg cost)
+- No trigger signals display
+- No tabs
+- No diff view
+- No replay forecast
+
+**Gap:** Full proposal action UI — per epic, this is Phase 3.4 work (`/proposals` approve/reject + CLI)
+
+---
+
+### 4. Landing / Bridge View — Redirects to /work
+
+**Mockup (00-landing.html):**
+- Fleet at a glance: in-flight runs, live activity, judge trend
+- Multi-model comparison preview
+- Recent landings
+- Rhythm section
+
+**Actual (`/`):**
+- HTTP redirect to `/work`
+
+**Gap:** Bridge view not implemented. This is the "post-onboard default landing" — depends on Phase 2.3 work.
+
+---
+
+### 5. Public Landing (`public-landing.html`)
+
+**Mockup:** Full marketing page with hero, diagram cards, trust bar, code chip
+
+**Actual:** Not implemented, not routed
+
+**Gap:** Out of scope for epic #1624 (marketing page)
+
+---
+
+### 6. Nav Extraction — Inline nav everywhere
+
+**Epic #1624 says:** `templates/partials/nav_main.html` exists but not used by standalone pages
+**Actual:** Every standalone page has inline `<nav class="w-nav">...</nav>`
+
+**Gap:** Extract to partial. Requires `ActivePage` field in page data structs.
+
+---
+
+### 7. Schedules Nav Link — Missing
+
+**Mockup nav:** Work | Schedules | Proposals (count badge) | Runs | Admin
+**Actual nav:** Work | Runs | Pipelines | Proposals | Issues | PRs | Onboard | Health
+
+**Gap:** Schedules link absent (scheduling feature not yet built — Phase 0.6)
+
+---
+
+### 8. Proposals Count Badge — Missing from nav
+
+**Mockup nav:** `Proposals <span class="badge badge-yellow">2</span>`
+**Actual nav:** Plain `Proposals` link, no count badge
+
+**Gap:** Badge needs dynamic count from page data
+
+---
+
+### 9. Onboarding Session (`/onboard`) — Different structure
+
+**Mockup (01-onboarding-session.html):**
+- Chat-style interface with message bubbles and inline gates
+- "Wave scaffolds itself to your project" description
+- Streaming Claude-Code session concept
+
+**Actual:**
+- Different UI structure (step-based, not chat-style)
+- WebOnboardSession SSE-based
+
+**Gap:** Onboarding UI redesign — Phase 1.2 work
+
+---
+
+### 10. Work Board — Filter Controls Missing
+
+**Mockup (02-work-board.html) filterbar:**
+- All forges | gitea: code-crispies | github: re-cinq/mp
+- All kinds | Issues only | PRs only | Scheduled tasks
+- Open | All | Closed
+- Any label | bug | epic | auto-impl
+
+**Actual:** No filterbar on /work
+
+**Gap:** Filterbar with forge/kind/state/label selectors
+
+---
+
+## Priority (based on epic phases)
+
+| Priority | Gap | Phase |
+|----------|-----|-------|
+| P1 | Nav extraction | remaining in epic |
+| P1 | Proposals detail — approve/reject UI | Phase 3.4 |
+| P2 | Work board — filterbar + actions | Phase 2 |
+| P2 | Work item detail — dispatch wiring | Phase 2.4 |
+| P3 | Bridge view landing | Phase 2.3 |
+| P3 | Onboarding chat UI | Phase 1.2 |
+| P4 | Schedules nav link | Phase 0.6 |
+| P4 | Public landing | separate |
+
+---
+
+## Verified Working
+
+- `data-theme="dark"` on all 18 page templates ✓
+- `.pipeline-card { display: flex }` in style.css ✓
+- w-nav class + w-nav-brand + w-nav-links structure ✓
+- w-container, w-page-header, w-page-title, w-page-sub ✓
+- badge + w-btn classes ✓
+- All pages HTTP 200 ✓
+- No emojis — SVG icons only ✓