Render user messages as markdown#263
Merged
Merged
Conversation
Route the user message bubble through MarkdownPreview so the markdown the prompt box now produces (headings, lists, bold/italic/code, blockquotes) renders instead of showing as literal text. Adds an offset-based prompt-mention pipeline (markdown-prompt-mentions) that substitutes each mention's source span for an inert sentinel before parsing, then renders it back into the canonical pill — so thread, file, and slash-command mentions all keep their pills under markdown (the existing @thread-token path only handled threads). Preserves the muted prefix, the 4096-char cap, and collapse/expand (now a max-height clamp, since markdown blocks don't line-clamp). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The ParentChildSystemMessages story omitted resolveSegmentLinkHref, so the system-message markdown path left its @thread: tokens as literal text instead of pills. Pass the resolver (matching the agent-initiated rows) so the thread mentions render as linked pills. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
# Conflicts: # apps/app/src/components/ui/markdown-preview.tsx
Bump the user message bubble from rounded-md to rounded-2xl so it reads like a chat message bubble. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Cover the markdown rendering path of the user message bubble: heading/bold/list/ code structure, thread + file mention pills, `> ` blockquotes, the rounded bubble shape, and a plain-text message. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Bump the user message bubble's left/right padding (p-2 -> px-3.5 py-2) so the text sits comfortably inside the rounded chat bubble. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Match the common AI-chat user-bubble treatment: narrower content cap (max-w 80% -> 70%), roomier balanced padding (px-4 py-2.5), and a hairline border so the bubble reads as a distinct message against the low-contrast fill. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Use the subtle border-seam token (a lighter divider) instead of border so the bubble edge reads as a hairline rather than an outline. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Softer jump from main's 6px. Make the bubble test radius-agnostic (assert on the fill, not the radius class). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Give the error status decoration a subtle semantic red, but only when it is an emphasized error — the one that actually fails the thread (system/terminal error rows). Transient work-row errors the agent recovers from (a failed command, an errored fetch) and denied/interrupted annotations stay muted. The small mono + opacity-75 keep even the red subtle. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
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
1 participant
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.
What
User message bubbles in the timeline now render markdown — matching the markdown the prompt box recently started producing. Previously a sent message showed
# heading,- list,**bold**as literal characters (assistant messages already rendered markdown; user messages didn't).How
markdown-prompt-mentionspipeline. The existing markdown mention path (markdown-thread-mentions) only recognizes the@thread:<id>token by regex and would silently drop file (@src/foo.ts) and slash-command (/deploy) mentions. The new pipeline replaces each mention's exact source span (by offset, from the editor's authoritativementionsarray) with an inert private-use sentinel before parsing, then renders it back into the sharedPromptMentionPill— so thread, file, and command mentions all keep their pills under markdown. The generated/system-message path keeps the token/regex approach (its@thread:token is template-injected, not authored).MarkdownPreviewgains apromptMentionsprop that activates the offset pipeline (+remark-breaksfor single-newline handling). The existingthreadMentionspath is unchanged.CollapsibleMessageTextrenders viaMarkdownPreview, preserving the muted[bb …]prefix, the 4096-char cap, and collapse/expand — reworked from a source-line clamp to amax-h-[15lh]visual clamp (block markdown doesn't line-clamp cleanly).>quotes now render as native markdown blockquotes.Tests / verification
thread/timeline/User Message Markdown(formatting · mentions · blockquote · long/collapsible).tsc, ESLint, Prettier all clean.🤖 Generated with Claude Code