Skip to content

fix(web): add pointer cursor to running stop-generation button #900

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
binbandit wants to merge 1 commit into
base: main
Choose a base branch
from
+32 −2
Open

fix(web): add pointer cursor to running stop-generation button #900

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
32 changes: 31 additions & 1 deletion apps/web/src/components/ChatView.browser.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,13 @@ interface ViewportSpec {
attachmentTolerancePx: number;
}

type SnapshotSessionStatus =
OrchestrationReadModel["threads"][number]["session"] extends infer Session
? Session extends { status: infer Status }
? Status
: never
: never;

const DEFAULT_VIEWPORT: ViewportSpec = {
name: "desktop",
width: 960,
Expand Down Expand Up @@ -152,6 +159,7 @@ function createSnapshotForTargetUser(options: {
targetMessageId: MessageId;
targetText: string;
targetAttachmentCount?: number;
sessionStatus?: SnapshotSessionStatus;
}): OrchestrationReadModel {
const messages: Array<OrchestrationReadModel["threads"][number]["messages"][number]> = [];

Expand Down Expand Up @@ -221,7 +229,7 @@ function createSnapshotForTargetUser(options: {
checkpoints: [],
session: {
threadId: THREAD_ID,
status: "ready",
status: options.sessionStatus ?? "ready",
providerName: "codex",
runtimeMode: "full-access",
activeTurnId: null,
Expand Down Expand Up @@ -994,6 +1002,28 @@ describe("ChatView timeline estimator parity (full app)", () => {
}
});

it("shows a pointer cursor for the running stop button", async () => {
const mounted = await mountChatView({
viewport: DEFAULT_VIEWPORT,
snapshot: createSnapshotForTargetUser({
targetMessageId: "msg-user-stop-button-cursor" as MessageId,
targetText: "stop button cursor target",
sessionStatus: "running",
}),
});

try {
const stopButton = await waitForElement(
() => document.querySelector<HTMLButtonElement>('button[aria-label="Stop generation"]'),
"Unable to find stop generation button.",
);

expect(getComputedStyle(stopButton).cursor).toBe("pointer");
} finally {
await mounted.cleanup();
}
});

it("keeps the new thread selected after clicking the new-thread button", async () => {
const mounted = await mountChatView({
viewport: DEFAULT_VIEWPORT,
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/components/ChatView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3981,7 +3981,7 @@ export default function ChatView({ threadId }: ChatViewProps) {
) : phase === "running" ? (
<button
type="button"
className="flex size-8 items-center justify-center rounded-full bg-rose-500/90 text-white transition-all duration-150 hover:bg-rose-500 hover:scale-105 sm:h-8 sm:w-8"
className="flex size-8 cursor-pointer items-center justify-center rounded-full bg-rose-500/90 text-white transition-all duration-150 hover:bg-rose-500 hover:scale-105 sm:h-8 sm:w-8"
onClick={() => void onInterrupt()}
aria-label="Stop generation"
>
Expand Down
Loading