fix(task-chat): put the agent-authored description on the page surface

PAP-501 (#11263) moved agent prose onto the page surface: no card fill,
no rounding, full width. TaskChatBubble applies that to agent messages,
and TaskChatBubble.test.tsx asserts the agent branch carries neither
`bg-(--bubble-agent)` nor `rounded-2xl`.

TaskChatDescriptionBubble never followed. An agent-opened task still
rendered its description in a `--bubble-agent` card, so the first message
in a thread sat in a gray bubble while every later agent message sat on
the page. index.css says as much already: the lab variants exist to
"restore the shared card geometry that production no longer applies to
agent prose".

Apply the same branch here. The human side keeps its accent bubble.

This also removes the surface that made the code block look wrong. The
block reads as the only tinted panel in an agent message now, rather than
one gray rectangle inside another.

Update the test, which asserted the old card.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
scotttongandClaude Opus 5 committed 2026-08-17 22:37:04 -07:00
1 parent 48adddb1f8
commit 4a73cb7f70
2 files changed
+18 -4

No files matched your search

@@ -95,8 +95,16 @@ describe("TaskChatDescriptionBubble (PAP-375)", () => {
expect(bubble?.className).toContain("items-start");
expect(bubble?.querySelector('[data-testid="task-chat-agent-avatar"]')).not.toBeNull();
expect(bubble?.textContent).toContain("CEO");
expect(bubble?.querySelector(".bg-\\(--bubble-agent\\)")).not.toBeNull();
// PAP-501: agent prose sits on the page surface. The description is agent
// prose when an agent opened the task, so it carries no card fill, no
// rounding and no width cap — matching TaskChatBubble's agent branch.
expect(bubble?.querySelector(".bg-\\(--bubble-agent\\)")).toBeNull();
expect(bubble?.querySelector(".bg-\\(--liveness-blue\\)")).toBeNull();
const agentBody = bubble?.querySelector(".bg-transparent");
expect(agentBody).not.toBeNull();
expect(agentBody?.className).toContain("w-full");
expect(agentBody?.className).not.toContain("rounded-2xl");
expect(agentBody?.className).not.toContain("max-w-(--pct-85)");
});
it("renders the live description — a new value shows without remount", () => {
@@ -135,11 +135,17 @@ export function TaskChatDescriptionBubble({ brief }: TaskChatDescriptionBubblePr
)}
>
<div
// PAP-501 put agent prose on the page surface: no card fill, no
// rounding, full width. TaskChatBubble already does this for agent
// messages. The description is agent prose too when an agent opened
// the task, so it follows the same rule rather than keeping a
// --bubble-agent card that no other agent text still uses. The human
// side keeps its accent bubble.
className={cn(
"max-w-(--pct-85) break-words px-3.5 py-2 text-sm",
"break-words py-2 text-sm",
isHuman
? "rounded-2xl rounded-br-sm bg-(--liveness-blue) text-white"
: "rounded-2xl rounded-bl-sm bg-(--bubble-agent) text-foreground",
? "max-w-(--pct-85) rounded-2xl rounded-br-sm bg-(--liveness-blue) px-3.5 text-white"
: "w-full bg-transparent px-1 text-foreground",
)}
>
<FoldCurtain