Skip to content

fix(desktop): keep WorkHub chat bubbles on --radius-chat #4919

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
liuxiaocs7 wants to merge 3 commits into
base: main
Choose a base branch
from
+18 −4
Open

fix(desktop): keep WorkHub chat bubbles on --radius-chat #4919

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f2ed4ce
fix(desktop): keep WorkHub chat bubbles on --radius-chat
liuxiaocs7 Sep 6, 2026
579323e
test(desktop): move WorkHub bubble-radius contract to the E2E harness
liuxiaocs7 Sep 6, 2026
531249f
test(desktop): assert WorkHub bubble radius in the story play
liuxiaocs7 Sep 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 2 additions & 4 deletions apps/desktop/src/renderer/workhub-surface.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -398,7 +398,6 @@ export function WorkHubSurface(props: {
<div className="maka-chat-shell">
<ChatMessageList
className="maka-chat-message-list maka-chatContent workhub-message-list"
density="compact"
gap={4}
isStreaming={pending}
>
Expand Down Expand Up @@ -508,7 +507,6 @@ export function WorkHubCoordinationStatus(props: {
<div className="maka-chat-shell">
<ChatMessageList
className="maka-chat-message-list maka-chatContent workhub-message-list"
density="compact"
gap={4}
isStreaming={resolving}
>
Expand Down Expand Up @@ -769,12 +767,12 @@ function WorkHubMessageFrame(props: {
data-state={props.state}
data-link-state={props.linkState}
>
<ChatMessage sender="user" density="compact" className="workhub-message">
<ChatMessage sender="user" className="workhub-message">
<ChatMessageBubble className="maka-chat-message-bubble maka-chat-message-bubble-user workhub-user-bubble">
<p>{props.text}</p>
</ChatMessageBubble>
</ChatMessage>
<ChatMessage sender="assistant" density="compact" className="workhub-message">
<ChatMessage sender="assistant" className="workhub-message">
<ChatMessageBubble
variant="ghost"
width="100%"
Expand Down
16 changes: 16 additions & 0 deletions apps/desktop/stories/workhub.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -134,5 +134,21 @@ export const SubmittedWorkKeepsTargetMetadataInside: Story = {
expect(button.getBoundingClientRect().bottom).toBeGreaterThanOrEqual(
project.getBoundingClientRect().bottom,
);

// #4914: WorkHub's conversation is one surface — the user bubble rounds
// like the composer plate beneath it, both resolving Astryx's
// `--radius-chat`. `density="compact"` on WorkHub's chat primitives had
// pinned the bubble to `--radius-container` (12px) while the composer
// stayed 28px, splitting a transcript and a dock on the same surface by
// more than 2x. Compared against the real composer plate, not a literal,
// so an upstream `--radius-chat` change moves both or fails here.
const bubble = canvasElement.querySelector<HTMLElement>(
'.workhub-projected-turn .workhub-user-bubble',
);
const plate = canvasElement.querySelector('.maka-composer-astryx')?.firstElementChild;
if (!bubble || !plate) throw new Error('WorkHub bubble or composer plate is missing');
const bubbleRadius = getComputedStyle(bubble).borderTopLeftRadius;
expect(bubbleRadius).not.toBe('0px');
expect(bubbleRadius).toBe(getComputedStyle(plate).borderTopLeftRadius);
},
};