From 10305fab7a30e601f5ea662ca6eb7fc44ca7e3cd Mon Sep 17 00:00:00 2001 From: G r e y Date: Thu, 26 May 2022 17:13:06 +0000 Subject: [PATCH 1/3] chore: organize ws stats, schedule stories Resolves: #1681 Summary: - Moves WorkspaceSchedule out of WorkspaceStats - Adds WorkspaceScheduleForm directory - Adds meaningful stories for WorkspaceStats Impact: Improves breadth of our chromatic visual regression tests since the examples for WorkspaceStats were non-representative of the component --- .../WorkspaceSchedule.stories.tsx | 68 +++++++++++++++++-- .../WorkspaceScheduleForm.stories.tsx | 0 .../WorkspaceScheduleForm.test.ts | 0 .../WorkspaceScheduleForm.tsx | 0 .../WorkspaceStats/WorkspaceStats.stories.tsx | 47 +++---------- .../WorkspaceSchedulePage.tsx | 2 +- 6 files changed, 73 insertions(+), 44 deletions(-) rename site/src/components/{WorkspaceStats => WorkspaceScheduleForm}/WorkspaceScheduleForm.stories.tsx (100%) rename site/src/components/{WorkspaceStats => WorkspaceScheduleForm}/WorkspaceScheduleForm.test.ts (100%) rename site/src/components/{WorkspaceStats => WorkspaceScheduleForm}/WorkspaceScheduleForm.tsx (100%) diff --git a/site/src/components/WorkspaceSchedule/WorkspaceSchedule.stories.tsx b/site/src/components/WorkspaceSchedule/WorkspaceSchedule.stories.tsx index 407810bf264a1..84ef4af2378e3 100644 --- a/site/src/components/WorkspaceSchedule/WorkspaceSchedule.stories.tsx +++ b/site/src/components/WorkspaceSchedule/WorkspaceSchedule.stories.tsx @@ -1,6 +1,7 @@ import { Story } from "@storybook/react" +import dayjs from "dayjs" import React from "react" -import { MockWorkspace } from "../../testHelpers/renderHelpers" +import * as Mocks from "../../testHelpers/entities" import { WorkspaceSchedule, WorkspaceScheduleProps } from "./WorkspaceSchedule" export default { @@ -11,7 +12,66 @@ export default { const Template: Story = (args) => -export const Example = Template.bind({}) -Example.args = { - workspace: MockWorkspace, +export const NoTTL = Template.bind({}) +NoTTL.args = { + workspace: { + ...Mocks.MockWorkspace, + ttl: undefined, + }, +} + +export const ShutdownSoon = Template.bind({}) +ShutdownSoon.args = { + workspace: { + ...Mocks.MockWorkspace, + + latest_build: { + ...Mocks.MockWorkspaceBuild, + transition: "start", + updated_at: dayjs().subtract(1, "hour").toString(), // 1 hour ago + }, + ttl: 2 * 60 * 60 * 1000 * 1_000_000, // 2 hours + }, +} + +export const ShutdownLong = Template.bind({}) +ShutdownLong.args = { + workspace: { + ...Mocks.MockWorkspace, + + latest_build: { + ...Mocks.MockWorkspaceBuild, + transition: "start", + updated_at: dayjs().toString(), + }, + ttl: 7 * 24 * 60 * 60 * 1000 * 1_000_000, // 7 days + }, +} + +export const WorkspaceOffShort = Template.bind({}) +WorkspaceOffShort.args = { + workspace: { + ...Mocks.MockWorkspace, + + latest_build: { + ...Mocks.MockWorkspaceBuild, + transition: "stop", + updated_at: dayjs().subtract(2, "days").toString(), + }, + ttl: 2 * 60 * 60 * 1000 * 1_000_000, // 2 hours + }, +} + +export const WorkspaceOffLong = Template.bind({}) +WorkspaceOffLong.args = { + workspace: { + ...Mocks.MockWorkspace, + + latest_build: { + ...Mocks.MockWorkspaceBuild, + transition: "stop", + updated_at: dayjs().subtract(2, "days").toString(), + }, + ttl: 2 * 365 * 24 * 60 * 60 * 1000 * 1_000_000, // 2 years + }, } diff --git a/site/src/components/WorkspaceStats/WorkspaceScheduleForm.stories.tsx b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.stories.tsx similarity index 100% rename from site/src/components/WorkspaceStats/WorkspaceScheduleForm.stories.tsx rename to site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.stories.tsx diff --git a/site/src/components/WorkspaceStats/WorkspaceScheduleForm.test.ts b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.test.ts similarity index 100% rename from site/src/components/WorkspaceStats/WorkspaceScheduleForm.test.ts rename to site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.test.ts diff --git a/site/src/components/WorkspaceStats/WorkspaceScheduleForm.tsx b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx similarity index 100% rename from site/src/components/WorkspaceStats/WorkspaceScheduleForm.tsx rename to site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx diff --git a/site/src/components/WorkspaceStats/WorkspaceStats.stories.tsx b/site/src/components/WorkspaceStats/WorkspaceStats.stories.tsx index 03dcdf6047231..37e7dd4855a1d 100644 --- a/site/src/components/WorkspaceStats/WorkspaceStats.stories.tsx +++ b/site/src/components/WorkspaceStats/WorkspaceStats.stories.tsx @@ -1,5 +1,4 @@ import { Story } from "@storybook/react" -import dayjs from "dayjs" import React from "react" import * as Mocks from "../../testHelpers/renderHelpers" import { WorkspaceStats, WorkspaceStatsProps } from "../WorkspaceStats/WorkspaceStats" @@ -11,66 +10,36 @@ export default { const Template: Story = (args) => -export const NoTTL = Template.bind({}) -NoTTL.args = { +export const Start = Template.bind({}) +Start.args = { workspace: { ...Mocks.MockWorkspace, - ttl: undefined, - }, -} - -export const ShutdownSoon = Template.bind({}) -ShutdownSoon.args = { - workspace: { - ...Mocks.MockWorkspace, - - latest_build: { - ...Mocks.MockWorkspaceBuild, - transition: "start", - updated_at: dayjs().subtract(1, "hour").toString(), // 1 hour ago - }, - ttl: 2 * 60 * 60 * 1000 * 1_000_000, // 2 hours - }, -} - -export const ShutdownLong = Template.bind({}) -ShutdownLong.args = { - workspace: { - ...Mocks.MockWorkspace, - latest_build: { ...Mocks.MockWorkspaceBuild, transition: "start", - updated_at: dayjs().toString(), }, - ttl: 7 * 24 * 60 * 60 * 1000 * 1_000_000, // 7 days }, } -export const WorkspaceOffShort = Template.bind({}) -WorkspaceOffShort.args = { +export const Stop = Template.bind({}) +Stop.args = { workspace: { ...Mocks.MockWorkspace, - latest_build: { ...Mocks.MockWorkspaceBuild, transition: "stop", - updated_at: dayjs().subtract(2, "days").toString(), }, - ttl: 2 * 60 * 60 * 1000 * 1_000_000, // 2 hours }, } -export const WorkspaceOffLong = Template.bind({}) -WorkspaceOffLong.args = { +export const Outdated = Template.bind({}) +Outdated.args = { workspace: { ...Mocks.MockWorkspace, - latest_build: { ...Mocks.MockWorkspaceBuild, - transition: "stop", - updated_at: dayjs().subtract(2, "days").toString(), + transition: "start", }, - ttl: 2 * 365 * 24 * 60 * 60 * 1000 * 1_000_000, // 2 years + outdated: true, }, } diff --git a/site/src/pages/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx b/site/src/pages/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx index a686daf4daf00..21ec0e71cdfb2 100644 --- a/site/src/pages/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx +++ b/site/src/pages/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx @@ -10,7 +10,7 @@ import { FullScreenLoader } from "../../components/Loader/FullScreenLoader" import { WorkspaceScheduleForm, WorkspaceScheduleFormValues, -} from "../../components/WorkspaceStats/WorkspaceScheduleForm" +} from "../../components/WorkspaceScheduleForm/WorkspaceScheduleForm" import { firstOrItem } from "../../util/array" import { dowToWeeklyFlag, extractTimezone, stripTimezone } from "../../util/schedule" import { workspaceSchedule } from "../../xServices/workspaceSchedule/workspaceScheduleXService" From 8fe1d46e72d172ecd5087892d25689d31de27297 Mon Sep 17 00:00:00 2001 From: G r e y Date: Thu, 26 May 2022 17:35:47 +0000 Subject: [PATCH 2/3] fixup! chore: organize ws stats, schedule stories --- .../pages/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/src/pages/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx b/site/src/pages/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx index 798f6a7b62532..3b91ca54ae7ff 100644 --- a/site/src/pages/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx +++ b/site/src/pages/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx @@ -1,5 +1,5 @@ import * as TypesGen from "../../api/typesGenerated" -import { WorkspaceScheduleFormValues } from "../../components/WorkspaceStats/WorkspaceScheduleForm" +import { WorkspaceScheduleFormValues } from "../../components/WorkspaceScheduleForm/WorkspaceScheduleForm" import * as Mocks from "../../testHelpers/entities" import { formValuesToAutoStartRequest, formValuesToTTLRequest, workspaceToInitialValues } from "./WorkspaceSchedulePage" From 4f2ad131e0d5314746ef5bdca840fa2475c688c6 Mon Sep 17 00:00:00 2001 From: G r e y Date: Thu, 26 May 2022 20:01:09 +0000 Subject: [PATCH 3/3] simplify WorkspaceStats story --- .../WorkspaceStats/WorkspaceStats.stories.tsx | 35 ++----------------- 1 file changed, 3 insertions(+), 32 deletions(-) diff --git a/site/src/components/WorkspaceStats/WorkspaceStats.stories.tsx b/site/src/components/WorkspaceStats/WorkspaceStats.stories.tsx index 37e7dd4855a1d..68bfe20a9de27 100644 --- a/site/src/components/WorkspaceStats/WorkspaceStats.stories.tsx +++ b/site/src/components/WorkspaceStats/WorkspaceStats.stories.tsx @@ -10,36 +10,7 @@ export default { const Template: Story = (args) => -export const Start = Template.bind({}) -Start.args = { - workspace: { - ...Mocks.MockWorkspace, - latest_build: { - ...Mocks.MockWorkspaceBuild, - transition: "start", - }, - }, -} - -export const Stop = Template.bind({}) -Stop.args = { - workspace: { - ...Mocks.MockWorkspace, - latest_build: { - ...Mocks.MockWorkspaceBuild, - transition: "stop", - }, - }, -} - -export const Outdated = Template.bind({}) -Outdated.args = { - workspace: { - ...Mocks.MockWorkspace, - latest_build: { - ...Mocks.MockWorkspaceBuild, - transition: "start", - }, - outdated: true, - }, +export const Example = Template.bind({}) +Example.args = { + workspace: Mocks.MockWorkspace, }