# Chat Interface Guide

The admin chat has interactive elements beyond the message input. When the user asks what they can do in the chat, seems unaware of a feature, or is struggling with something an existing UI element solves — reference the relevant element by its visual description and location, not by internal names.

## Interactive Elements

| Element | Where | What it looks like | What it does |
|---------|-------|--------------------|--------------|
| Lightbulb icon | Bottom right of the chat area | Small lightbulb, changes colour: orange (default), blue (all expanded), grey (all collapsed) | Cycles through three visibility modes for thinking and tool detail blocks. Orange shows thinking expanded and tools collapsed. Blue expands everything. Grey collapses everything to show responses only. |
| Hamburger menu | Top right, in the header | Three horizontal lines icon | Opens a menu with a link to the public-facing chat and a log out option. |
| Scroll-to-bottom arrow | Bottom centre of the chat area | Downward chevron that gently bounces, only visible when scrolled up | Scrolls to the most recent message. |
| Paperclip | Left side of the input bar | Paperclip icon beside the text input | Opens a file picker to attach images, PDFs, or text files. Supports up to 5 files, 20 MB each. |
| "Powered by Claude Code" | Bottom right, below the input bar | Claude logo with text | Opens an info panel showing the active Claude model, context usage, and a toggle to switch context mode. |
| Disconnect Claude | Below the input bar | Robot-off icon with "Disconnect Claude" label | Ends the current Claude Code session and returns to the connection screen. |
| Stream log | Below the input bar | Scroll icon with "Stream log" label | Downloads the raw stream log for the current session — useful for debugging or reporting issues. |
| Pause and Stop | Right side of the input bar, during streaming only | Pause icon and square icon, replacing the Send button | Pause temporarily halts the response (resumable). Stop cancels the response entirely. |
| Long press on a message | Any message bubble | Hold down on a message for ~0.5 seconds | Enters selection mode — select multiple messages and copy their content. |

## When to mention these

Reference an element when it directly solves a problem the user is experiencing or asking about. Do not list all elements unprompted — mention only the relevant one in context.

- The user has a long response with many thinking blocks → mention the lightbulb icon and its three modes
- The user asks how to log out or access the public chat → mention the hamburger menu
- The user says they've lost their place in the conversation → mention the scroll-to-bottom arrow
- The user wants to share a file or image → mention the paperclip
- The user asks what model they're using, about context limits, or wants to switch context mode → mention the "Powered by Claude Code" badge
- The user wants to restart their Claude connection → mention Disconnect Claude
- The user needs debug information or wants to report an issue → mention Stream log
- The user asks how to copy messages or parts of the conversation → mention long press to enter selection mode
- The user asks "what can I do?" or "what features does this have?" → summarise the key elements relevant to their current situation