Skip to content

feat(sessions): redesign conversation history with markdown, filters & export#1568

Open
lzhgus wants to merge 3 commits intofarion1231:mainfrom
lzhgus:feat/session-manager-redesign
Open

feat(sessions): redesign conversation history with markdown, filters & export#1568
lzhgus wants to merge 3 commits intofarion1231:mainfrom
lzhgus:feat/session-manager-redesign

Conversation

@lzhgus
Copy link

@lzhgus lzhgus commented Mar 19, 2026

Summary

Redesigns the Session Manager conversation history view for better readability and usability:

  • Markdown rendering — Messages now render with full markdown support (headings, lists, bold, links, tables, code blocks) using react-markdown + remark-gfm
  • Code blocks — Fenced code blocks display with language labels and per-block copy buttons
  • Role categorization — Each message type (User, AI, Tool, System) gets a distinct icon, color, and background
  • Collapsible messages — Long messages can be collapsed/expanded with "Show more"/"Show less"; Tool and System messages auto-collapse by default
  • Message search — Search within conversation messages by text content
  • Role filters — Filter visible messages by role (User, AI, Tool, System) with badge counts
  • Collapse/Expand all — Toggle to collapse or expand all messages at once
  • Export — Copy all messages or export entire conversation as formatted Markdown to clipboard
  • i18n — All new UI strings translated in English, Chinese, and Japanese

Bug fixes included

  • Fix DropdownMenuCheckboxItem / DropdownMenuRadioItem text overlapping with check indicator (pl-2pl-8)
  • Fix message content overflowing behind TOC sidebar
  • Format existing files with Prettier

Before

image

After

image

Raw text dump with line numbers, no markdown rendering, no categorization.

Dependencies added

  • react-markdown ^10.1.0
  • remark-gfm ^4.0.1

Test plan

  • pnpm typecheck passes
  • pnpm format:check passes
  • pnpm test:unit passes (2 pre-existing failures in skills panel, unrelated)
  • Visual test: open Session Manager, select a session, verify markdown renders correctly
  • Visual test: verify code blocks show language label and copy button
  • Test message search filters messages in real-time
  • Test role filter shows/hides messages by type
  • Test collapse/expand all toggle
  • Test "Copy all messages" and "Export as Markdown" from dropdown
  • Test "Show more" / "Show less" on long messages
  • Verify TOC sidebar doesn't overlap message content

🤖 Generated with Claude Code

Zhihao Li and others added 3 commits March 18, 2026 20:14
…, filters, and export

- Add markdown rendering (react-markdown + remark-gfm) with code blocks, tables, links
- Add per-code-block copy button with language label
- Add role-based message categorization with distinct icons (User, AI, Tool, System)
- Add color-coded message backgrounds per role
- Add collapsible messages with Show more/less for long content
- Tool and System messages auto-collapse by default
- Add message search within conversation
- Add role filter dropdown with message counts
- Add collapse/expand all toggle
- Add export dropdown (copy all messages, export as Markdown)
- Add i18n translations for all new features (en, zh, ja)
- Fix DropdownMenuCheckboxItem/RadioItem pl-2 → pl-8 to prevent text overlap with indicator
- Fix message content overflow behind TOC sidebar
- Format existing files with Prettier

Co-Authored-By: Claude Opus 4.6 (1M context) <[email protected]>
- Use `w-0` + `flex-1` on ScrollArea to enforce width constraint in flex layout
- Add `word-break: break-word` and `overflow-wrap: anywhere` to markdown prose
- Add `break-all` on links to prevent long URLs from overflowing
- Add CSS-level overflow protection for pre, a, p, li, blockquote

Co-Authored-By: Claude Opus 4.6 (1M context) <[email protected]>
…apping

Radix ScrollArea's Viewport renders an inner div with `display: table;
min-width: 100%` which prevents text from wrapping — content expands
the table-layout div instead. Override this with `display: block` via
a scoped CSS selector on the messages scroll area.

Co-Authored-By: Claude Opus 4.6 (1M context) <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant