diff --git a/site/src/pages/WorkspacePage/AppStatuses.stories.tsx b/site/src/pages/WorkspacePage/AppStatuses.stories.tsx index 56dff1c93c7c4..90be0f194fef3 100644 --- a/site/src/pages/WorkspacePage/AppStatuses.stories.tsx +++ b/site/src/pages/WorkspacePage/AppStatuses.stories.tsx @@ -1,4 +1,5 @@ import type { Meta, StoryObj } from "@storybook/react"; +import { userEvent, within } from "@storybook/test"; import type { WorkspaceAppStatus } from "api/typesGenerated"; import { MockWorkspace, @@ -82,6 +83,37 @@ export const SingleStatus: Story = { }, }; +export const MultipleStatuses: Story = { + args: { + agent: mockAgent([ + { + ...MockWorkspaceAppStatus, + id: "status-1", + icon: "", + message: "Initial setup complete.", + created_at: createTimestamp(5, 10), // 15:05:10 (after referenceDate) + uri: "", + state: "complete" as const, + }, + { + ...MockWorkspaceAppStatus, + id: "status-2", + icon: "", + message: "Working...", + created_at: createTimestamp(5, 0), // 15:05:00 (after referenceDate) + uri: "", + state: "working" as const, + }, + ]), + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + const submitButton = canvas.getByRole("button"); + await userEvent.click(submitButton); + await canvas.findByText(/working/i); + }, +}; + function mockAgent(statuses: WorkspaceAppStatus[]) { return { ...MockWorkspaceAgent, diff --git a/site/src/pages/WorkspacePage/AppStatuses.tsx b/site/src/pages/WorkspacePage/AppStatuses.tsx index 148484a4992ea..35d4db46c3ac9 100644 --- a/site/src/pages/WorkspacePage/AppStatuses.tsx +++ b/site/src/pages/WorkspacePage/AppStatuses.tsx @@ -156,7 +156,7 @@ export const AppStatuses: FC = ({