diff --git a/docs/dashboard-guide.md b/docs/dashboard-guide.md index 9daf1c97c9..b82b694fd4 100644 --- a/docs/dashboard-guide.md +++ b/docs/dashboard-guide.md @@ -555,7 +555,7 @@ Chat view provides project-scoped conversations with agents. - On desktop/tablet Direct chat, the thread header shows an estimated token count against the active model's known context window (for example `~12.3k / 200k`). It is hidden on mobile, narrow floating chat, rooms, and unknown-context-window models. -- In narrow Chat containers (including phone-width full Chat, narrow Quick Chat popups, and right-dock Chat), message bubbles use the full content width for improved readability. On tablet-width main Chat containers, assistant/agent, streaming, and failure bubbles keep the wider 88% reading measure, while wide desktop Chat keeps the standard 75% bubble cap. +- In narrow Chat containers (including phone-width full Chat, narrow Quick Chat popups, and right-dock Chat), message bubbles use the full content width for improved readability. On tablet-width main Chat containers, assistant/agent, streaming, and failure bubbles keep the wider 92% reading measure, while wide desktop Chat keeps the standard 75% bubble cap. - Full Chat tool-call summaries now use a denser mobile layout: grouped and single-call collapsed rows keep icon + label + status on one line (Quick Chat-style scanability) while expanded details remain unchanged. - Assistant question tool calls now render as a shared in-chat response card instead of a generic tool-call disclosure. The card recognizes provider-native question tools and Fusion's `fn_ask_question`, supports select, multi-select, text, and yes/no prompts, sends the formatted answer back into the same direct or room thread, and renders historical answered questions read-only. diff --git a/packages/dashboard/app/components/ChatView.css b/packages/dashboard/app/components/ChatView.css index a2f3668805..75a5e9cc10 100644 --- a/packages/dashboard/app/components/ChatView.css +++ b/packages/dashboard/app/components/ChatView.css @@ -1042,12 +1042,15 @@ The thread-wide Markdown/plain render toggle (`.chat-thread-header-render-toggle /* FNXC:ChatView 2026-06-23-11:40: Tablet Chat View has enough message-pane width for assistant prose, markdown, tool output, failure details, and attachments, so agent-side bubbles need a wider reading measure than the shared desktop/user cap. Use the ChatView container width instead of the viewport so floating Quick Chat and other narrow hosts keep their bounded bubble layout. + +FNXC:ChatView 2026-07-15-00:00: +FN-8028 widens the tablet agent-side cap from 88% to 92% for a slightly wider reading measure while keeping it container-keyed, so Quick Chat and the right dock remain bounded by their narrow-host rule. */ @container chat-view (min-width: 48.0625rem) and (max-width: 64rem) { .chat-message--assistant, .chat-message--streaming, .chat-message--failure { - max-width: 88%; + max-width: 92%; } } diff --git a/packages/dashboard/app/components/__tests__/ChatView.core-contracts.test.tsx b/packages/dashboard/app/components/__tests__/ChatView.core-contracts.test.tsx index 79ded13292..f18ea4819c 100644 --- a/packages/dashboard/app/components/__tests__/ChatView.core-contracts.test.tsx +++ b/packages/dashboard/app/components/__tests__/ChatView.core-contracts.test.tsx @@ -453,7 +453,7 @@ describe("ChatView CSS — responsive bubble width", () => { expect(userRule?.[1]).toContain("align-self: flex-end"); expect(userRule?.[1]).not.toContain("max-width"); expect(tabletRule?.[1]).toMatch( - /\.chat-message--assistant,\s*\.chat-message--streaming,\s*\.chat-message--failure\s*\{[^}]*max-width:\s*88%/, + /\.chat-message--assistant,\s*\.chat-message--streaming,\s*\.chat-message--failure\s*\{[^}]*max-width:\s*92%/, ); expect(tabletRule?.[1]).not.toMatch(/\.chat-message--user\s*\{[^}]*max-width/); expect(css).toMatch(/@media\s*\(max-width:\s*768px\)[\s\S]*?\.chat-message\s*\{[^}]*max-width:\s*100%/); @@ -469,7 +469,7 @@ describe("ChatView CSS — responsive bubble width", () => { expect(baseMessageRule?.[1]).toContain("max-width: 75%"); expect(narrowRule?.[1]).toMatch(/\.chat-message\s*\{[^}]*max-width:\s*100%/); expect(tabletRule?.[1]).toMatch( - /\.chat-message--assistant,\s*\.chat-message--streaming,\s*\.chat-message--failure\s*\{[^}]*max-width:\s*88%/, + /\.chat-message--assistant,\s*\.chat-message--streaming,\s*\.chat-message--failure\s*\{[^}]*max-width:\s*92%/, ); }); });