Repository navigation
feat(session-ui): render Mermaid diagrams - #39818
EugeneChan00 wants to merge 2 commits into
Conversation
Mermaid fenced code blocks now render as charts by default in the chat markdown view (desktop and web), while the code block's copy button keeps copying the original mermaid source. - Split settled mermaid fences into standalone code blocks so both the streaming and settled render paths route through one diagram handler. - Render diagrams from a lazily imported, serialized mermaid instance and fall back to the source while streaming, incomplete, or on parse errors. - Track the app color scheme via a reactive signal on data-color-scheme so diagrams re-render when the theme flips.
- Gate the settled-path mermaid split behind a fence regex so messages without diagrams stay lexer-free. - Collapse the mermaid/shiki resource branches into one block construction. - Track only the last started render (source, scheme, request) per block; failed parses no longer re-render on identical effect re-runs. - Drop dead rejection handling from the serialized render queue.
|
The following comment was made by an LLM, it may be inaccurate: Based on my search results, I found one potentially related PR: Related PR:
Why it's related: This PR also adds Mermaid diagram support for markdown, though it targets the However, the current PR (#39818) appears to be focused specifically on the session-ui component and is restoring work from #38175 with original authorship preserved, which suggests it's a distinct effort from the earlier app-level implementation. |
|
This branch has been upgraded to V2. We're no longer taking PRs for V1. If you think this is still relevant, please port it over and open it for V2. — from 𝕺𝖕𝖊𝖓𝕮𝖔𝖉𝖊 |
Issue for this PR
Closes #39816
Linear surface: AES-29
Type of change
What does this PR do?
Renders completed Mermaid fences as strict, lazily loaded diagrams while retaining raw source for streaming, failure fallback, and copy. Theme changes rerender safely and stale asynchronous renders are ignored.
This restores the focused portion of #38175 and preserves its original commit authorship.
How did you verify your code works?
Ran the session-ui typecheck and focused Mermaid/stream tests (28 passing), plus the workspace typecheck (30 packages). In Storybook, verified the three-node diagram, surrounding prose, and the copy control changing from
CopytoCopied.Screenshots / recordings
Validated in the visible Browser against a real OpenCode web session and backend. The included
Components/Markdown/Mermaidstory remains as a focused reproduction surface.Checklist