Fetch agent identity via agent.identity.get WS method after connect.
Display avatar in message bubbles (replacing Bot icon) and in the
header (replacing the PinchChat logo when an avatar is configured).
Falls back to default icons when no avatar is set.
The MetadataViewer popup was rendered inside the message bubble which has
overflow-hidden, causing the popup to be invisible. Fix by using
createPortal to render the popup directly on document.body with fixed
positioning. Also adds click-outside-to-close behavior.
Closes feedback #46
Small info button appears on hover of each message bubble.
Click to expand a panel showing raw message metadata (id, role,
timestamp, channel, sender info, etc.) from the gateway.
Useful for debugging and understanding message routing.
Collapsed by default, doesn't clutter the UI.
Closes feedback item #39
Replace violet tint with cyan/teal tones to match the existing cyan accent
theme. User messages now use from-cyan-900/20 background gradient and
cyan-400/15 border, with cyan-200 user icon. Subtler and more cohesive
with the dark theme while remaining clearly distinct from assistant messages.
Fixes feedback #44
Deleted sessions would reappear after page refresh because the
gateway sessions.list response still included them. Now maintains
a localStorage blacklist of deleted session keys that filters them
out on every load, regardless of gateway-side deletion support.
Add overflow-x: hidden and word-break styles to textarea to prevent
ugly horizontal scrollbar on Windows. Also hide the horizontal webkit
scrollbar track entirely.
Add ::-webkit-scrollbar rules matching the dark theme. Textarea gets
an even thinner 4px scrollbar. Fixes ugly default scrollbar on macOS.
Closes feedback #36.
Shows the agentId (e.g. 'main') with a bot icon in the header subtitle,
making it clear which agent is handling the current conversation.
Useful for multi-agent setups.
Shows the model (e.g. claude-opus-4-6) as a subtle chip next to the
session label in the header. Hovering reveals agent ID if available.
Model and agentId are now extracted from sessions.list response.
- Chat.tsx: replace mutable variable in render IIFE with useMemo+reduce
to satisfy react-hooks/immutability rule
- ConnectionBanner.tsx: move setState calls into a useCallback to avoid
synchronous setState in effect body (react-hooks/set-state-in-effect)
- useGateway.ts: suppress set-state-in-effect for legitimate mount init
Replaces the screenshot placeholder with a live animated demo showing:
- Sidebar with fake sessions and token usage bars
- User typing animation with cursor
- Thinking indicator with animated dots
- Colored tool call badges (web_search, exec)
- Expandable tool results with parameters
- Formatted assistant response with markdown
- Auto-looping animation
All pure CSS/JS, no dependencies. Matches the app's dark theme and color scheme.
Closes feedback item #12
Reorder and rewrite feature descriptions to highlight what actually
differentiates PinchChat: tool call visualization, GPT-like interface,
multi-session navigation. Remove generic features (markdown, file upload,
dark theme) that don't sell the product. Pragmatic tone, no fluff.
- Add image block type for base64 and URL images
- Parse image/image_url blocks from gateway history
- Render images inline in chat messages (rounded, dark-themed)
- Click-to-zoom lightbox with Escape to close
- Markdown images also use the lightbox component
- Detect base64 images in tool results (e.g. Read tool on image files)
- Support png, jpg, gif, webp formats
- Use logo.png as favicon (replaces emoji SVG)
- Show logo in header next to title
- Show larger logo on login screen
- Add OG image meta tag
- Add centered logo in README
- Closes feedback item #8
