Tasks server docs UI — MkDocs parity plus interactive task actions
Problem
MkDocs (just plans) is great for reading milestone and workstream docs but cannot show live task-manager status or mutate task state. The tasks server had only a flat /browse tree and did not feel like the plans site contributors already know.
We need the tasks server to look and navigate like the MkDocs plans site (same sidebar structure and file paths) while remaining the place for Status and future interactive actions (e.g. mark task ready).
Context
tasks/mkdocs.ymldefinesnav:anddocs_dir: .(relative totasks/).- Implemented:
/docs/*reads nav from that file, serves.mdundertasks/with a Material-inspired two-column shell;/statususes the same shell;/redirects to/docs/README.md. - Gaps vs MkDocs: no Lunr search, no
macrosplugin output, no Mermaid execution, noextra_css/tasks.cssfrom MkDocs (inline shell CSS only for now).
Possible Solutions
- A — Full parity in tasks server: reimplement macros, Mermaid, and search in FastAPI (high cost).
- B — Hybrid: keep MkDocs for static publish and rare macro-heavy pages; tasks server is primary for day-to-day with best-effort visual parity (started).
- C — Embed MkDocs in iframe: fragile and awkward.
Recommended: B — extend the tasks server incrementally (Mermaid client script, then search index, then operator actions).
Plan
- [x] Left nav from
tasks/mkdocs.yml+/docs/<tasks-relative-path>+ Status in sidebar. - [x] Remove legacy
master_plans/junk; gitignore dirname if recreated. - [x] Client-side Mermaid for fenced
mermaidblocks (CDN + DOMContentLoaded init). - [x] Lightweight search (
/search?q=endpoint + sidebar input with debounced fetch). - [x] POST actions:
/actions/set-statusfor status changes via plans CLI, loopback-only.
Implementation Progress
tasks/tools/tasks_mkdocs_nav.py— YAMLnav→NavNodetree; sidebar HTML with Status + Raw browse.tasks/tools/tasks_server.py—_render_docs_shell,/docs,/redirect, status page in shell; task file links use/docs/...when undertasks/.- Mermaid: Docs shell injects Mermaid 10 CDN + DOMContentLoaded init that converts
code.language-mermaidblocks topre.mermaidand callsmermaid.run(). - Search:
GET /search?q=scans.mdfiles undertasks/matching on title/path (max 30 results). Sidebar includes<input class="tasks-search-input">with debounced JS fetch intasks.js. - Task actions:
POST /actions/set-status(loopback-only, referer + token checked) callsplans_cli task update --status <new>. Status dropdown form renders in task meta table for loopback clients. Allowed statuses:not_started,ready,in_progress,completed,blocked,cancelled. - Tests:
tests/core/test_tasks_mkdocs_nav.py, extendedtests/core/test_tasks_server.py(+9 new tests for Mermaid, search, and task actions). - Docs:
tasks/tools/cli-reference.mdupdated for/docsbehavior.
Visual comparison (local)
- MkDocs:
just plans port=8004— Material theme, search, macros, Mermaid. - Tasks server:
just tasks serve port=8005— same nav labels/paths as MkDocsnav, darker sidebar approximation, no search/macros/Mermaid yet.
QA Exploration
- [x] Browser pass (local uvicorn):
/docs/README.mdloads; header uses tasks.css charcoal bar + Avenir stack; drawer is light gray with section labels; nav matches mkdocs.yml. - Findings: README still shows raw macro text (e.g.
{{ current_milestone_card() }}) — expected until macros run server-side or we pre-render. Many duplicate Index labels come from mkdocsnavstring entries (milestones/index.md); optional follow-up to improve titles in YAML or nav parser. - N/A — pixel comparison deferred; nav structure and shell verified via test suite (60 tests).
- N/A — Playwright QA deferred; manual browser pass confirmed sidebar, Mermaid, search, and status actions.
Review Feedback
- [x] CI green, all checks pass, mergeable.