feat: live spec authoring — spec ticket body as a live plan in the dashboard (release 0.22.0)#49
Merged
Conversation
…shboard
A kind=spec ticket body now works as a live plan document: the agent
authors it from chat while the user watches the detail page update in
real time; approval and status changes stay in chat (board_move).
- MCP write tools: board_set_body (full replace) and
board_update_section (one H1 section, token-efficient default);
both recount DoD checkboxes and are listed in permissions.ask.
- Mermaid: ```mermaid fences render as <pre class="mermaid"> with the
source HTML-escaped (html:False guarantee preserved); vendored
mermaid.min.js (UMD v11) lazy-loads client-side with
securityLevel:'strict' only when a page has a diagram.
- Detail page live-updates over the existing SSE stream via the new
/api/project/{alias}/board/{ticket_id}/detail-html fragment;
mermaid re-renders after the swap, active inline edits defer it.
- spec-flow skill + /spec command rewritten: materialize early, serve
the dashboard and hand over the live URL, section-level updates per
milestone, review gate with verbal approval, then decompose.
Includes an authoring-efficiency guide with mermaid recipes.
https://claude.ai/code/session_01GN4Trdvo2BxUgyJt4P2Gpz
Bump pyproject + uv.lock to 0.22.0 and promote the [Unreleased] CHANGELOG section to a dated 0.22.0 entry covering the live spec authoring feature: board_set_body/board_update_section MCP tools, Mermaid diagram rendering in the dashboard, live detail-page SSE updates, and the rewritten spec-flow skill / spec command. https://claude.ai/code/session_01GN4Trdvo2BxUgyJt4P2Gpz
FelipeCarillo
changed the title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Resumo
Transforma o body de um ticket
kind=specnum documento de planejamento vivo: o agente constrói o plano a partir do chat enquanto o usuário acompanha a página de detalhe do dashboard atualizando em tempo real. Aprovação e mudança de status acontecem pelo chat (board_move); após a aprovação, o plano é decomposto em tickets filhos pelo fluxo spec-flow já existente.A motivação foi criar um "modo plan" superior ao padrão do Claude Code: textual + visual (diagramas Mermaid), persistente (versionado no board, não efêmero da sessão), observável por todo o time no kanban e rastreável da discussão até a implementação.
O que muda
Edição do plano pelo agente (backend)
Board.update_section()emlib/board.py: substitui (ou anexa) uma única seção# H1do body, com helper de escrita comum extraído doset_body(recontagem de checkboxes DoD + timestamps).server/mcp.py, ambaswrite=True, listadas empermissions.ask):board_set_body— replace completo (esqueleto inicial / reestruturação).board_update_section— replace/append de uma seção; a ferramenta padrão do live authoring, econômica em tokens (envia só a seção que mudou).Diagramas Mermaid no dashboard
```mermaidrenderizam como SVG. O servidor emite<pre class="mermaid">com o código HTML-escapado — a garantia anti-XSS dohtml:Falsese estende a esse caminho (coberto por testes).mermaid.min.js(UMD v11) vendorizado, carregado lazy no client (só quando a página tem diagrama), comsecurityLevel:'strict'.Página de detalhe ao vivo
GET /api/project/{alias}/board/{ticket_id}/detail-html.Workflow
holoctl-spec-flowe comando/specreescritos: materializar a spec cedo → subir/detectar ohctl servee entregar o link clicável → atualizar seção a seção a cada marco da discussão → gate dereviewcom aprovação verbal → decompor via boardmaster. Inclui um guia de autoria eficiente (edições por seção, prosa telegráfica, receitas de Mermaid de ≤15 nós).Testes
set_body/update_section), render de fence Mermaid, regressão de XSS (HTML malicioso dentro do fence permanece escapado), endpointdetail-html, e XSS end-to-end via página de detalhe.validate_changelog.pyeuv lock --checkok em 0.22.0.hctl servenum workspace de teste + render real do Mermaid em Chromium headless (2 SVGs na página).https://claude.ai/code/session_01GN4Trdvo2BxUgyJt4P2Gpz