feat(web): polish master chat overlay with model selector, params, empty state, and keyboard shortcuts
All checks were successful
ci/woodpecker/push/web Pipeline was successful

- Add model selector chip/dropdown in ChatInput with 4 models (llama3.2, claude-3.5-sonnet, gpt-4o, deepseek-r1)
- Add temperature slider (0.0–2.0) and max tokens input (100–32000) via settings popover
- Persist model, temperature, and max tokens in localStorage across sessions
- Wire model/temperature/maxTokens state up through Chat.tsx to useChat hook
- Add ChatEmptyState component with greeting and 4 clickable suggested prompts
- Clicking a suggestion pre-fills the ChatInput textarea via externalValue prop
- Add Cmd/Ctrl+N and Cmd/Ctrl+L keyboard shortcuts to start new conversation
- Add "New conversation" button in ChatOverlay header with Cmd+N tooltip
- Show ChatEmptyState when conversation has only the welcome message
- Write 63 tests covering model selector, params config, empty state, and keyboard shortcuts

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-25 21:13:27 -06:00
parent 417c6ab49c
commit 066272e6b1
9 changed files with 1020 additions and 13 deletions

View File

@@ -164,6 +164,27 @@ export function ChatOverlay(): React.JSX.Element {
{/* Header Controls */}
<div className="flex items-center gap-1">
{/* New Conversation Button */}
<button
onClick={() => {
chatRef.current?.startNewConversation(null);
}}
className="rounded p-1.5 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2"
aria-label="New conversation"
title="New conversation (Cmd+N)"
>
<svg
className="h-4 w-4"
style={{ color: "rgb(var(--text-secondary))" }}
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
strokeWidth={2}
>
<path d="M12 4v16m8-8H4" />
</svg>
</button>
{/* Minimize Button */}
<button
onClick={minimize}