Long assistant messages (>3000 chars) are now collapsed to 400px with a
gradient fade-out and a 'Show more' button. Clicking it reveals the full
message with a 'Show less' button to re-collapse. Streaming messages are
never collapsed. Fully i18n'd (8 languages).
- Fix blacklist reconciliation logic that was removing blacklisted keys
for sessions still on the gateway (inverted filter condition)
- Move message action buttons (copy, bookmark, metadata, retry) above
the message bubble (-top-3) to prevent overlapping text content
Closes#73, #74
Type '/' to see available OpenClaw commands (/status, /reasoning,
/verbose, /model, /compact, /reset, /help) with descriptions.
Navigate with arrow keys, select with Tab/Enter.
Supports EN/FR i18n.
- Add IndexedDB message cache to retain pre-compaction history locally
- Show compaction separator with amber styling when messages are compacted
- Archived messages render at 60% opacity above the separator
- Display agent name (from gateway identity) in header instead of 'PinchChat' when available
- Fallback to 'PinchChat' when no agent name is configured
- Add i18n keys for compaction separator (EN/FR)
Closes#72, #69
- Add bookmark button on message hover (amber star icon)
- Bookmarked messages show a small star indicator in the timestamp row
- Floating bookmarks panel to list and jump to bookmarked messages
- Bookmarks persisted in localStorage per session
- i18n support (EN/FR)
Add a persistent wrap/nowrap toggle button in the code block header bar,
consistent with the existing tool call content viewer. Persisted in
localStorage. Default is nowrap (existing behavior).
Add toggle in chat input to switch between Enter-to-send (default)
and Ctrl+Enter-to-send modes. Preference persists in localStorage.
Keyboard shortcuts modal reflects the current setting.
When scrolled up and new messages arrive, the scroll-to-bottom button
now shows a count badge (e.g. '3', '99+') instead of just bouncing.
This gives users a clear sense of how many messages they missed.
Clickable example prompts appear when a session has no messages,
giving users quick-start ideas. 2x2 grid on desktop, stacked on mobile.
Fully i18n'd (EN/FR).
- Remove font-style:italic from .ht-italic (different glyph widths cause desync)
- Remove font-weight:600 from .ht-heading (bolder glyphs are wider)
- Remove background/border-radius from code token spans
- Remove text-decoration from .ht-link
- Token spans now ONLY use color — zero text geometry changes
- Use inherit for font-size/line-height in shared .ht-backdrop/.ht-textarea
- Add update check hook: polls GitHub releases, shows indicator in sidebar
- #63: 'New messages' label only shows when actual new messages arrive while scrolled up; plain arrow button shown otherwise
- #64: Fix cursor desync in HighlightedTextarea by matching backdrop border width to textarea
- #65: Move floating buttons inside scroll container with sticky positioning to prevent overlap with growing textarea
- #66: Graceful fallback to Bot icon when agent avatar image fails to load
- Show line numbers for code blocks with more than 3 lines
- Toggle button (# icon + line count) in the language header bar
- Preference persisted in localStorage
- Line numbers are non-selectable (won't copy with code)
- Hidden for short snippets to reduce visual noise
Consecutive messages from the same role within 2 minutes are visually
grouped: subsequent messages hide the avatar (keeping alignment) and
use tighter vertical spacing. Date separators and role changes break
groups. This matches modern chat UX patterns (Discord, Telegram).
Track how long each assistant response took to generate and display
it subtly next to the timestamp (e.g. '· 12.3s'). The timing is
measured from the first streaming delta to the final state, and
preserved across the history reload that follows stream completion.
Only visible for messages generated during the current session.
- Set document.documentElement.lang on initial load and locale change
- Ensures screen readers and browser features respect the active language
- Removes duplicate aria-label on MessageSearch input
- Replace raw text timestamps with <time> HTML elements
- Add dateTime attribute (ISO 8601) for accessibility and machine readability
- Add title attribute showing full date+time on hover (weekday, date, time with seconds)
- Localized tooltip using the user's language preference
- Helps users see exact timestamps for older messages shown as abbreviated times
Move react-markdown, remark-gfm, remark-breaks, and rehype-highlight
imports from eager to dynamic via a LazyMarkdown wrapper component.
The ~336KB markdown bundle is now loaded on-demand after initial paint
instead of blocking the critical rendering path.
- Create LazyMarkdown component with Suspense fallback
- Pre-load plugins in parallel on module init
- Replace all ReactMarkdown usage in ChatMessage with LazyMarkdown
- Hide sidebar, header, chat input, and scroll button when printing
- Reset backgrounds to white, text to black for readability
- Code blocks get light background with borders
- Tool calls styled for print (compact, bordered)
- External links show their URL in parentheses
- Chat scroll area becomes fully visible (no overflow)
- Messages avoid page-break-inside for clean pagination
- Remove shadows and backdrop filters in print
- Replace div with <main> for primary chat pane (screen reader landmark)
- Replace div with <section> for split pane
- Add skip-to-content link for keyboard navigation (Tab → jump to chat input)
- Add aria-expanded and aria-label to tool call badge buttons
- Add id='chat-input' to textarea for skip link target
- Add i18n keys for new ARIA labels (EN + FR)
- Wrap ChatMessageComponent with React.memo to skip re-renders when props unchanged
- Hoist remarkPlugins and rehypePlugins arrays to module scope to avoid
creating new array references on every render (prevents unnecessary
ReactMarkdown re-processing)
- Use proper PluggableList type from unified instead of any
- ThemeSwitcher: aria-expanded, aria-haspopup, aria-pressed on theme/accent buttons, Escape to close, dialog role
- ThinkingBlock: aria-expanded on toggle, region role on content
- ThinkingIndicator: role=status, aria-label, decorative icon aria-hidden
- ErrorBoundary: role=alert on error state
- SessionIcon: aria-hidden on decorative SVG brand icons
- Expose resolvedTheme in ThemeContext for theme-aware rendering
- Tool call badges: darker text colors and higher bg opacity in light theme
- User message bubbles: increased bg opacity and border strength in light theme
- Progress bars and send button already use accent CSS variables (no change needed)
Closes feedback #60
- User messages appear instantly with 'sending' state (dimmed, clock icon)
- Transitions to 'sent' (checkmark) when server acknowledges
- Shows error state (alert icon, retry visible) if send fails
- Applied to both primary and secondary sessions
Replace highlight.js/lib/common (36 languages) with a curated subset
of 16 languages relevant for coding-assistant chat UIs. Both ToolCall
(direct hljs) and ChatMessage (rehype-highlight) now share the same
custom bundle from src/lib/highlight.ts.
Languages included: bash, css, diff, dockerfile, go, ini, javascript,
json, markdown, python, rust, shell, sql, typescript, xml, yaml.
Markdown chunk: 477KB → 336KB (-30%, -45KB gzipped)
- Show a pulsing placeholder while images load
- Display a graceful error state with ImageOff icon when images fail to load
- Prevents broken image icons from cluttering the chat
Markdown links pointing to external URLs (http/https) now open in a
new tab with target=_blank and rel='noopener noreferrer' for security.
Internal/relative links are unaffected.
