From 554ddb11cdde772792c859a895cb992d2b4f3a16 Mon Sep 17 00:00:00 2001 From: Bruno Quaresma Date: Fri, 8 Sep 2023 15:14:13 -0300 Subject: [PATCH] chore(site): refactor stories and test from page components (#9603) * Refactor AuditPage * Refactor CliAuthPageView stories * Refactor CreateTemplateForm stories * Refactor CreateUserPage test * Refactor CreateWorkspacePage tests * Fix stories name * Refactor AppereancePageView stories * Refactor GitAuthSettingsPageView stories * Refactor NetworkSettingsPageView stories * Refactor SecuritySettingsPageView stories * Refactor UserAuthSettingsPageView stories * Refactor GroupsPage stories * Refactor LoginPage tests * Refactor SetupPage stories * Refactor StarterTemplatePageView stories * Refactor StarterTemplatesPage tests * Refactor TemplatePage tests * RefactorTemplateSettingsPage tests * Refactor TemplatesPage tests * Flat TemplateVersionEditorPage * Refactor TemplateVersionPage stories * Refactor UserSettingsPage stories * Refactor UsersPage stories * Simplify IndexPage * Refactor WorkspaceSettingsPage stories * Refactor WorkspacePage stories * Refactor Conditionals stories * Fix typo * Fix imports * Fix ChooseOne story * Fix UserAuthSettingsPageView stories --- site/src/AppRouter.tsx | 10 +- .../Conditionals/ChooseOne.stories.tsx | 97 ++- .../components/Conditionals/Maybe.stories.tsx | 28 +- .../AuditLogDescription.stories.tsx | 58 ++ .../AuditLogDescription.test.tsx | 106 --- .../AuditLogRow/AuditLogDescription/index.ts | 1 - .../AuditLogRow/AuditLogDiff/index.ts | 2 - .../AuditLogRow/AuditLogRow.stories.tsx | 142 ++-- .../AuditPage/AuditLogRow/AuditLogRow.tsx | 5 +- site/src/pages/AuditPage/AuditPage.test.tsx | 9 - .../pages/AuditPage/AuditPageView.stories.tsx | 3 +- site/src/pages/AuditPage/AuditPageView.tsx | 2 +- .../CliAuthPage/CliAuthPageView.stories.tsx | 17 +- .../CreateTemplateForm.stories.tsx | 677 +++++++++--------- .../CreateTemplatePage/CreateTemplateForm.tsx | 7 +- .../CreateTokenPage/CreateTokenPage.test.tsx | 2 +- .../CreateUserPage/CreateUserPage.test.tsx | 33 - .../CreateWorkspacePage.test.tsx | 24 - .../CreateWorkspacePageView.stories.tsx | 2 +- .../CreateWorkspacePage/GitAuth.stories.tsx | 81 ++- .../SelectedTemplate.stories.tsx | 35 +- .../AppearanceSettingsPageView.stories.tsx | 19 +- .../GitAuthSettingsPageView.stories.tsx | 19 +- .../NetworkSettingsPageView.stories.tsx | 71 +- .../SecuritySettingsPageView.stories.tsx | 77 +- .../UserAuthSettingsPageView.stories.tsx | 102 +-- .../CreateGroupPageView.stories.tsx | 17 +- .../GroupsPage/GroupsPageView.stories.tsx | 66 +- .../SettingsGroupPageView.stories.tsx | 23 +- site/src/pages/LoginPage/LoginPage.test.tsx | 36 +- .../pages/LoginPage/LoginPageView.stories.tsx | 77 +- site/src/pages/LoginPage/LoginPageView.tsx | 2 +- .../{SignInForm => }/OAuthSignInForm.tsx | 2 +- .../{SignInForm => }/PasswordSignInForm.tsx | 6 +- .../pages/LoginPage/SignInForm.stories.tsx | 94 +++ .../LoginPage/{SignInForm => }/SignInForm.tsx | 4 +- .../{SignInForm => }/SignInForm.types.ts | 0 .../SignInForm/SignInForm.stories.tsx | 102 --- .../pages/SetupPage/SetupPageView.stories.tsx | 39 +- .../StarterTemplatePage.test.tsx | 20 - .../StarterTemplatePageView.stories.tsx | 50 +- .../StarterTemplatesPage.test.tsx | 22 - .../StarterTemplatesPageView.stories.tsx | 50 +- .../TemplateDocsPage.test.tsx | 31 - .../TemplateStats.stories.tsx | 92 +-- .../TemplateSummaryPage.test.tsx | 53 -- .../VersionsTable.stories.tsx | 78 +- .../TemplateSettingsPageView.stories.tsx | 47 +- .../TemplatePermissionsPageView.stories.tsx | 43 +- .../AutostopRequirementHelperText.tsx | 0 .../TTLHelperText.tsx | 0 .../TemplateScheduleForm.tsx | 0 .../TemplateSchedulePage.test.tsx | 5 +- .../TemplateSchedulePageView.tsx | 2 +- .../formHelpers.tsx | 0 .../useWorkspacesToBeDeleted.ts | 0 .../TemplateVariablesPageView.stories.tsx | 120 ++-- .../FileDialog.tsx | 0 .../FileTreeView.tsx | 0 .../MissingTemplateVariablesDialog.tsx | 0 .../MonacoEditor.tsx | 0 .../PublishTemplateVersionDialog.tsx | 0 .../TemplateVersionEditor.stories.tsx | 0 .../TemplateVersionEditor.tsx | 0 .../TemplateVersionEditorPage.test.tsx | 2 +- .../TemplateVersionEditorPage.tsx | 2 +- .../TemplateVersionStatusBadge.tsx | 0 .../TemplateVersionPageView.stories.tsx | 43 +- .../TemplatesPage/TemplatesPage.test.tsx | 91 --- .../TemplatesPageView.stories.tsx | 158 ++-- .../AccountPage/AccountForm.stories.tsx | 70 +- .../SSHKeysPage/SSHKeysPageView.stories.tsx | 73 +- .../SettingsSecurityForm.stories.tsx | 57 +- .../ConfirmDeleteDialog.stories.tsx | 38 +- .../TokensPage/TokensPageView.stories.tsx | 76 +- .../WorspaceProxyView.stories.tsx | 99 ++- .../UsersPage/ResetPasswordDialog.stories.tsx | 34 +- site/src/pages/UsersPage/UsersPage.test.tsx | 6 - .../UsersTable/EditRolesButton.stories.tsx | 57 +- .../WorkspacePage/BuildsTable.stories.tsx | 29 +- .../pages/WorkspacePage/Workspace.stories.tsx | 1 + .../WorkspaceActions.stories.tsx | 118 ++- .../WorkspaceBuildProgress.stories.tsx | 98 ++- .../WorkspaceDeletedBanner.stories.tsx | 20 +- .../WorkspacePage/WorkspaceStats.stories.tsx | 62 +- .../WorkspaceParametersPage.stories.tsx | 22 +- .../WorkspaceScheduleForm.stories.tsx | 101 ++- .../WorkspaceSettingsPageView.stories.tsx | 21 +- site/src/pages/index.tsx | 8 - .../createTemplate/createTemplateXService.ts | 2 +- 90 files changed, 1807 insertions(+), 2191 deletions(-) create mode 100644 site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.stories.tsx delete mode 100644 site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.test.tsx delete mode 100644 site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/index.ts delete mode 100644 site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/index.ts rename site/src/pages/LoginPage/{SignInForm => }/OAuthSignInForm.tsx (97%) rename site/src/pages/LoginPage/{SignInForm => }/PasswordSignInForm.tsx (90%) create mode 100644 site/src/pages/LoginPage/SignInForm.stories.tsx rename site/src/pages/LoginPage/{SignInForm => }/SignInForm.tsx (97%) rename site/src/pages/LoginPage/{SignInForm => }/SignInForm.types.ts (100%) delete mode 100644 site/src/pages/LoginPage/SignInForm/SignInForm.stories.tsx delete mode 100644 site/src/pages/StarterTemplatePage/StarterTemplatePage.test.tsx delete mode 100644 site/src/pages/StarterTemplatesPage/StarterTemplatesPage.test.tsx delete mode 100644 site/src/pages/TemplatePage/TemplateDocsPage/TemplateDocsPage.test.tsx delete mode 100644 site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPage.test.tsx rename site/src/pages/TemplateSettingsPage/TemplateSchedulePage/{TemplateScheduleForm => }/AutostopRequirementHelperText.tsx (100%) rename site/src/pages/TemplateSettingsPage/TemplateSchedulePage/{TemplateScheduleForm => }/TTLHelperText.tsx (100%) rename site/src/pages/TemplateSettingsPage/TemplateSchedulePage/{TemplateScheduleForm => }/TemplateScheduleForm.tsx (100%) rename site/src/pages/TemplateSettingsPage/TemplateSchedulePage/{TemplateScheduleForm => }/formHelpers.tsx (100%) rename site/src/pages/TemplateSettingsPage/TemplateSchedulePage/{TemplateScheduleForm => }/useWorkspacesToBeDeleted.ts (100%) rename site/src/pages/TemplateVersionEditorPage/{TemplateVersionEditor => }/FileDialog.tsx (100%) rename site/src/pages/TemplateVersionEditorPage/{TemplateVersionEditor => }/FileTreeView.tsx (100%) rename site/src/pages/TemplateVersionEditorPage/{TemplateVersionEditor => }/MissingTemplateVariablesDialog.tsx (100%) rename site/src/pages/TemplateVersionEditorPage/{TemplateVersionEditor => }/MonacoEditor.tsx (100%) rename site/src/pages/TemplateVersionEditorPage/{TemplateVersionEditor => }/PublishTemplateVersionDialog.tsx (100%) rename site/src/pages/TemplateVersionEditorPage/{TemplateVersionEditor => }/TemplateVersionEditor.stories.tsx (100%) rename site/src/pages/TemplateVersionEditorPage/{TemplateVersionEditor => }/TemplateVersionEditor.tsx (100%) rename site/src/pages/TemplateVersionEditorPage/{TemplateVersionEditor => }/TemplateVersionStatusBadge.tsx (100%) delete mode 100644 site/src/pages/TemplatesPage/TemplatesPage.test.tsx delete mode 100644 site/src/pages/index.tsx diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx index 3c32ac8e42..67af1b48d8 100644 --- a/site/src/AppRouter.tsx +++ b/site/src/AppRouter.tsx @@ -1,7 +1,6 @@ import { FullScreenLoader } from "components/Loader/FullScreenLoader"; import { TemplateLayout } from "components/TemplateLayout/TemplateLayout"; import { UsersLayout } from "components/UsersLayout/UsersLayout"; -import IndexPage from "pages"; import AuditPage from "pages/AuditPage/AuditPage"; import GroupsPage from "pages/GroupsPage/GroupsPage"; import LoginPage from "pages/LoginPage/LoginPage"; @@ -11,7 +10,12 @@ import TemplatesPage from "pages/TemplatesPage/TemplatesPage"; import UsersPage from "pages/UsersPage/UsersPage"; import WorkspacesPage from "pages/WorkspacesPage/WorkspacesPage"; import { FC, lazy, Suspense } from "react"; -import { Route, Routes, BrowserRouter as Router } from "react-router-dom"; +import { + Route, + Routes, + BrowserRouter as Router, + Navigate, +} from "react-router-dom"; import { DashboardLayout } from "./components/Dashboard/DashboardLayout"; import { RequireAuth } from "./components/RequireAuth/RequireAuth"; import { SettingsLayout } from "./components/SettingsLayout/SettingsLayout"; @@ -195,7 +199,7 @@ export const AppRouter: FC = () => { {/* Dashboard routes */} }> }> - } /> + } /> } /> diff --git a/site/src/components/Conditionals/ChooseOne.stories.tsx b/site/src/components/Conditionals/ChooseOne.stories.tsx index a4663b8819..7330a9bc6a 100644 --- a/site/src/components/Conditionals/ChooseOne.stories.tsx +++ b/site/src/components/Conditionals/ChooseOne.stories.tsx @@ -1,46 +1,71 @@ -import { Story } from "@storybook/react"; +import { Meta, StoryObj } from "@storybook/react"; import { ChooseOne, Cond } from "./ChooseOne"; -export default { +const meta: Meta = { title: "components/Conditionals/ChooseOne", component: ChooseOne, - subcomponents: { Cond }, }; -export const FirstIsTrue: Story = () => ( - - The first one shows. - The second one does not show. - The default does not show. - -); +export default meta; +type Story = StoryObj; -export const SecondIsTrue: Story = () => ( - - The first one does not show. - The second one shows. - The default does not show. - -); +export const FirstIsTrue: Story = { + args: { + children: [ + + The first one shows. + , + + The second one does not show. + , + The default does not show., + ], + }, +}; -export const AllAreTrue: Story = () => ( - - Only the first one shows. - The second one does not show. - The default does not show. - -); +export const SecondIsTrue: Story = { + args: { + children: [ + + The first one does not show. + , + + The second one shows. + , + The default does not show., + ], + }, +}; +export const AllAreTrue: Story = { + args: { + children: [ + + Only the first one shows. + , + + The second one does not show. + , + The default does not show., + ], + }, +}; -export const NoneAreTrue: Story = () => ( - - The first one does not show. - The second one does not show. - The default shows. - -); +export const NoneAreTrue: Story = { + args: { + children: [ + + The first one does not show. + , + + The second one does not show. + , + The default shows., + ], + }, +}; -export const OneCond: Story = () => ( - - An only child renders. - -); +export const OneCond: Story = { + args: { + children: An only child renders., + }, +}; diff --git a/site/src/components/Conditionals/Maybe.stories.tsx b/site/src/components/Conditionals/Maybe.stories.tsx index bc94f3f810..cfe14ede5a 100644 --- a/site/src/components/Conditionals/Maybe.stories.tsx +++ b/site/src/components/Conditionals/Maybe.stories.tsx @@ -1,21 +1,25 @@ -import { Story } from "@storybook/react"; -import { Maybe, MaybeProps } from "./Maybe"; +import { StoryObj, Meta } from "@storybook/react"; +import { Maybe } from "./Maybe"; -export default { +const meta: Meta = { title: "components/Conditionals/Maybe", component: Maybe, + args: { + children: "Now you see me", + }, }; -const Template: Story = (args: MaybeProps) => ( - Now you see me -); +export default meta; +type Story = StoryObj; -export const ConditionIsTrue = Template.bind({}); -ConditionIsTrue.args = { - condition: true, +export const ConditionIsTrue: Story = { + args: { + condition: true, + }, }; -export const ConditionIsFalse = Template.bind({}); -ConditionIsFalse.args = { - condition: false, +export const ConditionIsFalse: Story = { + args: { + condition: false, + }, }; diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.stories.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.stories.tsx new file mode 100644 index 0000000000..06c999d2f0 --- /dev/null +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.stories.tsx @@ -0,0 +1,58 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { AuditLogDescription } from "./AuditLogDescription"; +import { + MockAuditLog, + MockAuditLogSuccessfulLogin, + MockAuditLogUnsuccessfulLoginKnownUser, + MockAuditLogWithWorkspaceBuild, + MockWorkspaceCreateAuditLogForDifferentOwner, +} from "testHelpers/entities"; + +const meta: Meta = { + title: "components/AuditLogDescription", + component: AuditLogDescription, +}; + +export default meta; +type Story = StoryObj; + +export const WorkspaceCreate: Story = { + args: { + auditLog: MockAuditLog, + }, +}; + +export const WorkspaceBuildStop: Story = { + args: { + auditLog: MockAuditLogWithWorkspaceBuild, + }, +}; + +export const WorkspaceBuildDuplicatedWord: Story = { + args: { + auditLog: { + ...MockAuditLogWithWorkspaceBuild, + additional_fields: { + workspace_name: "workspace", + }, + }, + }, +}; + +export const CreateWorkspaceWithDiffOwner: Story = { + args: { + auditLog: MockWorkspaceCreateAuditLogForDifferentOwner, + }, +}; + +export const SuccessLogin: Story = { + args: { + auditLog: MockAuditLogSuccessfulLogin, + }, +}; + +export const UnsuccessfulLoginForUnknownUser: Story = { + args: { + auditLog: MockAuditLogUnsuccessfulLoginKnownUser, + }, +}; diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.test.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.test.tsx deleted file mode 100644 index cbe305c75e..0000000000 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.test.tsx +++ /dev/null @@ -1,106 +0,0 @@ -import { - MockAuditLog, - MockAuditLogWithWorkspaceBuild, - MockWorkspaceCreateAuditLogForDifferentOwner, - MockAuditLogSuccessfulLogin, - MockAuditLogUnsuccessfulLoginKnownUser, -} from "testHelpers/entities"; -import { AuditLogDescription } from "./AuditLogDescription"; -import { AuditLogRow } from "../AuditLogRow"; -import { render } from "testHelpers/renderHelpers"; -import { screen } from "@testing-library/react"; -import { i18n } from "i18n"; - -const t = (str: string, variables: Record) => - i18n.t(str, variables); - -const getByTextContent = (text: string) => { - return screen.getByText((_, element) => { - const hasText = (element: Element | null) => element?.textContent === text; - const elementHasText = hasText(element); - const childrenDontHaveText = Array.from(element?.children || []).every( - (child) => !hasText(child), - ); - return elementHasText && childrenDontHaveText; - }); -}; -describe("AuditLogDescription", () => { - it("renders the correct string for a workspace create audit log", async () => { - render(); - - expect(screen.getByText("TestUser created workspace")).toBeDefined(); - expect(screen.getByText("bruno-dev")).toBeDefined(); - }); - - it("renders the correct string for a workspace_build stop audit log", async () => { - render(); - - expect(getByTextContent("TestUser stopped workspace test2")).toBeDefined(); - }); - - it("renders the correct string for a workspace_build audit log with a duplicate word", async () => { - const AuditLogWithRepeat = { - ...MockAuditLogWithWorkspaceBuild, - additional_fields: { - workspace_name: "workspace", - }, - }; - render(); - - expect( - getByTextContent("TestUser stopped workspace workspace"), - ).toBeDefined(); - }); - it("renders the correct string for a workspace created for a different owner", async () => { - render( - , - ); - - expect( - screen.getByText( - `on behalf of ${MockWorkspaceCreateAuditLogForDifferentOwner.additional_fields.workspace_owner}`, - { exact: false }, - ), - ).toBeDefined(); - }); - it("renders the correct string for successful login", async () => { - render(); - - expect( - screen.getByText( - t("auditLog:table.logRow.description.unlinkedAuditDescription", { - truncatedDescription: `${MockAuditLogSuccessfulLogin.user?.username} logged in`, - target: "", - onBehalfOf: undefined, - }) - .replace(/<[^>]*>/g, " ") - .replace(/\s{2,}/g, " ") - .trim(), - ), - ).toBeInTheDocument(); - - const statusPill = screen.getByRole("status"); - expect(statusPill).toHaveTextContent("201"); - }); - it("renders the correct string for unsuccessful login for a known user", async () => { - render(); - - expect( - screen.getByText( - t("auditLog:table.logRow.description.unlinkedAuditDescription", { - truncatedDescription: `${MockAuditLogUnsuccessfulLoginKnownUser.user?.username} logged in`, - target: "", - onBehalfOf: undefined, - }) - .replace(/<[^>]*>/g, " ") - .replace(/\s{2,}/g, " ") - .trim(), - ), - ).toBeInTheDocument(); - - const statusPill = screen.getByRole("status"); - expect(statusPill).toHaveTextContent("401"); - }); -}); diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/index.ts b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/index.ts deleted file mode 100644 index 03c56cd0e8..0000000000 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { AuditLogDescription } from "./AuditLogDescription"; diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/index.ts b/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/index.ts deleted file mode 100644 index 1e4c4c34a5..0000000000 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { AuditLogDiff } from "./AuditLogDiff"; -export { determineGroupDiff } from "./auditUtils"; diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.stories.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.stories.tsx index 5ded123ef1..4eecbca66e 100644 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.stories.tsx +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.stories.tsx @@ -4,7 +4,6 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import { ComponentMeta, Story } from "@storybook/react"; import { MockAuditLog, MockAuditLog2, @@ -12,89 +11,102 @@ import { MockAuditLogWithDeletedResource, MockAuditLogGitSSH, } from "testHelpers/entities"; -import { AuditLogRow, AuditLogRowProps } from "./AuditLogRow"; +import { AuditLogRow } from "./AuditLogRow"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "components/AuditLogRow", component: AuditLogRow, -} as ComponentMeta; - -const Template: Story = (args) => ( - - - - - Logs - - - - - -
- -); - -export const NoDiff = Template.bind({}); -NoDiff.args = { - auditLog: { - ...MockAuditLog, - diff: {}, - }, + decorators: [ + (Story) => ( + + + + + Logs + + + + + +
+ + ), + ], }; -export const WithDiff = Template.bind({}); -WithDiff.args = { - auditLog: MockAuditLog2, - defaultIsDiffOpen: true, -}; +export default meta; +type Story = StoryObj; -export const WithLongDiffRow = Template.bind({}); -WithLongDiffRow.args = { - auditLog: { - ...MockAuditLog2, - diff: { - ...MockAuditLog2.diff, - icon: { - old: "https://www.google.com/url?sa=i&url=https%3A%2F%2Fwww.docker.com%2Fcompany%2Fnewsroom%2Fmedia-resources%2F&psig=AOvVaw3hLg_lm0tzXPBt74XZD2GC&ust=1666892413988000&source=images&cd=vfe&ved=0CAwQjRxqFwoTCPDsiKa4_voCFQAAAAAdAAAAABAD", - new: "https://www.google.com/url?sa=i&url=https%3A%2F%2Fwww.kindpng.com%2Fimgv%2FhRowRxi_docker-icon-png-transparent-png%2F&psig=AOvVaw3hLg_lm0tzXPBt74XZD2GC&ust=1666892413988000&source=images&cd=vfe&ved=0CAwQjRxqFwoTCPDsiKa4_voCFQAAAAAdAAAAABAI", - secret: false, - }, +export const NoDiff: Story = { + args: { + auditLog: { + ...MockAuditLog, + diff: {}, }, }, - defaultIsDiffOpen: true, }; -export const WithStoppedWorkspaceBuild = Template.bind({}); -WithStoppedWorkspaceBuild.args = { - auditLog: { - ...MockAuditLogWithWorkspaceBuild, - action: "stop", +export const WithDiff: Story = { + args: { + auditLog: MockAuditLog2, + defaultIsDiffOpen: true, }, }; -export const WithStartedWorkspaceBuild = Template.bind({}); -WithStartedWorkspaceBuild.args = { - auditLog: { - ...MockAuditLogWithWorkspaceBuild, - action: "start", +export const WithLongDiffRow: Story = { + args: { + auditLog: { + ...MockAuditLog2, + diff: { + ...MockAuditLog2.diff, + icon: { + old: "https://www.google.com/url?sa=i&url=https%3A%2F%2Fwww.docker.com%2Fcompany%2Fnewsroom%2Fmedia-resources%2F&psig=AOvVaw3hLg_lm0tzXPBt74XZD2GC&ust=1666892413988000&source=images&cd=vfe&ved=0CAwQjRxqFwoTCPDsiKa4_voCFQAAAAAdAAAAABAD", + new: "https://www.google.com/url?sa=i&url=https%3A%2F%2Fwww.kindpng.com%2Fimgv%2FhRowRxi_docker-icon-png-transparent-png%2F&psig=AOvVaw3hLg_lm0tzXPBt74XZD2GC&ust=1666892413988000&source=images&cd=vfe&ved=0CAwQjRxqFwoTCPDsiKa4_voCFQAAAAAdAAAAABAI", + secret: false, + }, + }, + }, + defaultIsDiffOpen: true, }, }; -export const WithDeletedWorkspaceBuild = Template.bind({}); -WithDeletedWorkspaceBuild.args = { - auditLog: { - ...MockAuditLogWithWorkspaceBuild, - action: "delete", - is_deleted: true, +export const WithStoppedWorkspaceBuild: Story = { + args: { + auditLog: { + ...MockAuditLogWithWorkspaceBuild, + action: "stop", + }, }, }; -export const DeletedResource = Template.bind({}); -DeletedResource.args = { - auditLog: MockAuditLogWithDeletedResource, +export const WithStartedWorkspaceBuild: Story = { + args: { + auditLog: { + ...MockAuditLogWithWorkspaceBuild, + action: "start", + }, + }, }; -export const SecretDiffValue = Template.bind({}); -SecretDiffValue.args = { - auditLog: MockAuditLogGitSSH, +export const WithDeletedWorkspaceBuild: Story = { + args: { + auditLog: { + ...MockAuditLogWithWorkspaceBuild, + action: "delete", + is_deleted: true, + }, + }, +}; + +export const DeletedResource: Story = { + args: { + auditLog: MockAuditLogWithDeletedResource, + }, +}; + +export const SecretDiffValue: Story = { + args: { + auditLog: MockAuditLogGitSSH, + }, }; diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx index 6f8c858f89..fafa263030 100644 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx @@ -12,10 +12,11 @@ import { TimelineEntry } from "components/Timeline/TimelineEntry"; import { UserAvatar } from "components/UserAvatar/UserAvatar"; import { useState } from "react"; import userAgentParser from "ua-parser-js"; -import { AuditLogDiff, determineGroupDiff } from "./AuditLogDiff"; +import { AuditLogDiff } from "./AuditLogDiff/AuditLogDiff"; import { useTranslation } from "react-i18next"; -import { AuditLogDescription } from "./AuditLogDescription"; +import { AuditLogDescription } from "./AuditLogDescription/AuditLogDescription"; import { PaletteIndex } from "theme/theme"; +import { determineGroupDiff } from "./AuditLogDiff/auditUtils"; const httpStatusColor = (httpStatus: number): PaletteIndex => { // redirects are successful diff --git a/site/src/pages/AuditPage/AuditPage.test.tsx b/site/src/pages/AuditPage/AuditPage.test.tsx index 3d07123e9c..8be345bba6 100644 --- a/site/src/pages/AuditPage/AuditPage.test.tsx +++ b/site/src/pages/AuditPage/AuditPage.test.tsx @@ -59,15 +59,6 @@ describe("AuditPage", () => { ); }); - it("shows the audit logs", async () => { - // When - await renderPage(); - - // Then - await screen.findByTestId(`audit-log-row-${MockAuditLog.id}`); - screen.getByTestId(`audit-log-row-${MockAuditLog2.id}`); - }); - it("renders page 5", async () => { // Given const page = 5; diff --git a/site/src/pages/AuditPage/AuditPageView.stories.tsx b/site/src/pages/AuditPage/AuditPageView.stories.tsx index ef8bc8c2d2..28a2e4f80e 100644 --- a/site/src/pages/AuditPage/AuditPageView.stories.tsx +++ b/site/src/pages/AuditPage/AuditPageView.stories.tsx @@ -1,7 +1,6 @@ import { Meta, StoryObj } from "@storybook/react"; import { MockAuditLog, MockAuditLog2, MockUser } from "testHelpers/entities"; import { AuditPageView } from "./AuditPageView"; -import { WorkspacesPageView } from "pages/WorkspacesPage/WorkspacesPageView"; import { ComponentProps } from "react"; import { MockMenu, @@ -38,7 +37,7 @@ const meta: Meta = { }; export default meta; -type Story = StoryObj; +type Story = StoryObj; export const AuditPage: Story = {}; diff --git a/site/src/pages/AuditPage/AuditPageView.tsx b/site/src/pages/AuditPage/AuditPageView.tsx index 688eb353f5..db8bb15593 100644 --- a/site/src/pages/AuditPage/AuditPageView.tsx +++ b/site/src/pages/AuditPage/AuditPageView.tsx @@ -4,7 +4,7 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableRow from "@mui/material/TableRow"; import { AuditLog } from "api/typesGenerated"; -import { AuditLogRow } from "pages/AuditPage/AuditLogRow/AuditLogRow"; +import { AuditLogRow } from "./AuditLogRow/AuditLogRow"; import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; import { EmptyState } from "components/EmptyState/EmptyState"; import { Margins } from "components/Margins/Margins"; diff --git a/site/src/pages/CliAuthPage/CliAuthPageView.stories.tsx b/site/src/pages/CliAuthPage/CliAuthPageView.stories.tsx index 44731ad3ef..afce40ff48 100644 --- a/site/src/pages/CliAuthPage/CliAuthPageView.stories.tsx +++ b/site/src/pages/CliAuthPage/CliAuthPageView.stories.tsx @@ -1,20 +1,15 @@ -import { Story } from "@storybook/react"; -import { CliAuthPageView, CliAuthPageViewProps } from "./CliAuthPageView"; +import { CliAuthPageView } from "./CliAuthPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/CliAuthPageView", component: CliAuthPageView, - argTypes: { - sessionToken: { control: "text" }, - }, args: { sessionToken: "some-session-token", }, }; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = {}; +export const Example: Story = {}; diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.stories.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.stories.tsx index 7dd881434c..d366c4a1e3 100644 --- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.stories.tsx +++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.stories.tsx @@ -1,4 +1,3 @@ -import { ComponentMeta, Story } from "@storybook/react"; import { MockTemplateExample, MockTemplateVersionVariable1, @@ -7,353 +6,353 @@ import { MockTemplateVersionVariable4, MockTemplateVersionVariable5, } from "testHelpers/entities"; -import { - CreateTemplateForm, - CreateTemplateFormProps, -} from "./CreateTemplateForm"; +import { CreateTemplateForm } from "./CreateTemplateForm"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "components/CreateTemplateForm", component: CreateTemplateForm, args: { isSubmitting: false, allowDisableEveryoneAccess: true, }, -} as ComponentMeta; - -const Template: Story = (args) => ( - -); - -export const Initial = Template.bind({}); -Initial.args = {}; - -export const WithStarterTemplate = Template.bind({}); -WithStarterTemplate.args = { - starterTemplate: MockTemplateExample, }; -export const WithVariables = Template.bind({}); -WithVariables.args = { - variables: [ - MockTemplateVersionVariable1, - MockTemplateVersionVariable2, - MockTemplateVersionVariable3, - MockTemplateVersionVariable4, - MockTemplateVersionVariable5, - ], +export default meta; +type Story = StoryObj; + +export const Initial: Story = {}; + +export const WithStarterTemplate: Story = { + args: { + starterTemplate: MockTemplateExample, + }, }; -export const WithJobError = Template.bind({}); -WithJobError.args = { - jobError: - "template import provision for start: recv import provision: plan terraform: terraform plan: exit status 1", - logs: [ - { - id: 461061, - created_at: "2023-03-06T14:47:32.501Z", - log_source: "provisioner_daemon", - log_level: "info", - stage: "Adding README.md...", - output: "", - }, - { - id: 461062, - created_at: "2023-03-06T14:47:32.501Z", - log_source: "provisioner_daemon", - log_level: "info", - stage: "Setting up", - output: "", - }, - { - id: 461063, - created_at: "2023-03-06T14:47:32.528Z", - log_source: "provisioner_daemon", - log_level: "info", - stage: "Parsing template parameters", - output: "", - }, - { - id: 461064, - created_at: "2023-03-06T14:47:32.552Z", - log_source: "provisioner_daemon", - log_level: "info", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461065, - created_at: "2023-03-06T14:47:32.633Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461066, - created_at: "2023-03-06T14:47:32.633Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "Initializing the backend...", - }, - { - id: 461067, - created_at: "2023-03-06T14:47:32.71Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461068, - created_at: "2023-03-06T14:47:32.711Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "Initializing provider plugins...", - }, - { - id: 461069, - created_at: "2023-03-06T14:47:32.712Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: '- Finding coder/coder versions matching "~\u003e 0.6.12"...', - }, - { - id: 461070, - created_at: "2023-03-06T14:47:32.922Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: '- Finding hashicorp/aws versions matching "~\u003e 4.55"...', - }, - { - id: 461071, - created_at: "2023-03-06T14:47:33.132Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "- Installing hashicorp/aws v4.57.0...", - }, - { - id: 461072, - created_at: "2023-03-06T14:47:37.364Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "- Installed hashicorp/aws v4.57.0 (signed by HashiCorp)", - }, - { - id: 461073, - created_at: "2023-03-06T14:47:38.142Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "- Installing coder/coder v0.6.15...", - }, - { - id: 461074, - created_at: "2023-03-06T14:47:39.083Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - "- Installed coder/coder v0.6.15 (signed by a HashiCorp partner, key ID 93C75807601AA0EC)", - }, - { - id: 461075, - created_at: "2023-03-06T14:47:39.394Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461076, - created_at: "2023-03-06T14:47:39.394Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "Partner and community providers are signed by their developers.", - }, - { - id: 461077, - created_at: "2023-03-06T14:47:39.394Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - "If you'd like to know more about provider signing, you can read about it here:", - }, - { - id: 461078, - created_at: "2023-03-06T14:47:39.394Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "https://www.terraform.io/docs/cli/plugins/signing.html", - }, - { - id: 461079, - created_at: "2023-03-06T14:47:39.394Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461080, - created_at: "2023-03-06T14:47:39.394Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - "Terraform has created a lock file .terraform.lock.hcl to record the provider", - }, - { - id: 461081, - created_at: "2023-03-06T14:47:39.394Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - "selections it made above. Include this file in your version control repository", - }, - { - id: 461082, - created_at: "2023-03-06T14:47:39.394Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - "so that Terraform can guarantee to make the same selections by default when", - }, - { - id: 461083, - created_at: "2023-03-06T14:47:39.395Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: 'you run "terraform init" in the future.', - }, - { - id: 461084, - created_at: "2023-03-06T14:47:39.395Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461085, - created_at: "2023-03-06T14:47:39.395Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "Terraform has been successfully initialized!", - }, - { - id: 461086, - created_at: "2023-03-06T14:47:39.395Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461087, - created_at: "2023-03-06T14:47:39.395Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - 'You may now begin working with Terraform. Try running "terraform plan" to see', - }, - { - id: 461088, - created_at: "2023-03-06T14:47:39.395Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - "any changes that are required for your infrastructure. All Terraform commands", - }, - { - id: 461089, - created_at: "2023-03-06T14:47:39.395Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "should now work.", - }, - { - id: 461090, - created_at: "2023-03-06T14:47:39.397Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461091, - created_at: "2023-03-06T14:47:39.397Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - "If you ever set or change modules or backend configuration for Terraform,", - }, - { - id: 461092, - created_at: "2023-03-06T14:47:39.397Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: - "rerun this command to reinitialize your working directory. If you forget, other", - }, - { - id: 461093, - created_at: "2023-03-06T14:47:39.397Z", - log_source: "provisioner", - log_level: "debug", - stage: "Detecting persistent resources", - output: "commands will detect it and remind you to do so if necessary.", - }, - { - id: 461094, - created_at: "2023-03-06T14:47:39.431Z", - log_source: "provisioner", - log_level: "info", - stage: "Detecting persistent resources", - output: "Terraform 1.1.9", - }, - { - id: 461095, - created_at: "2023-03-06T14:47:43.759Z", - log_source: "provisioner", - log_level: "error", - stage: "Detecting persistent resources", - output: - "Error: configuring Terraform AWS Provider: no valid credential sources for Terraform AWS Provider found.\n\nPlease see https://registry.terraform.io/providers/hashicorp/aws\nfor more information about providing credentials.\n\nError: failed to refresh cached credentials, no EC2 IMDS role found, operation error ec2imds: GetMetadata, http response error StatusCode: 404, request to EC2 IMDS failed\n", - }, - { - id: 461096, - created_at: "2023-03-06T14:47:43.759Z", - log_source: "provisioner", - log_level: "error", - stage: "Detecting persistent resources", - output: "", - }, - { - id: 461097, - created_at: "2023-03-06T14:47:43.777Z", - log_source: "provisioner_daemon", - log_level: "info", - stage: "Cleaning Up", - output: "", - }, - ], +export const WithVariables: Story = { + args: { + variables: [ + MockTemplateVersionVariable1, + MockTemplateVersionVariable2, + MockTemplateVersionVariable3, + MockTemplateVersionVariable4, + MockTemplateVersionVariable5, + ], + }, +}; + +export const WithJobError: Story = { + args: { + jobError: + "template import provision for start: recv import provision: plan terraform: terraform plan: exit status 1", + logs: [ + { + id: 461061, + created_at: "2023-03-06T14:47:32.501Z", + log_source: "provisioner_daemon", + log_level: "info", + stage: "Adding README.md...", + output: "", + }, + { + id: 461062, + created_at: "2023-03-06T14:47:32.501Z", + log_source: "provisioner_daemon", + log_level: "info", + stage: "Setting up", + output: "", + }, + { + id: 461063, + created_at: "2023-03-06T14:47:32.528Z", + log_source: "provisioner_daemon", + log_level: "info", + stage: "Parsing template parameters", + output: "", + }, + { + id: 461064, + created_at: "2023-03-06T14:47:32.552Z", + log_source: "provisioner_daemon", + log_level: "info", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461065, + created_at: "2023-03-06T14:47:32.633Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461066, + created_at: "2023-03-06T14:47:32.633Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "Initializing the backend...", + }, + { + id: 461067, + created_at: "2023-03-06T14:47:32.71Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461068, + created_at: "2023-03-06T14:47:32.711Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "Initializing provider plugins...", + }, + { + id: 461069, + created_at: "2023-03-06T14:47:32.712Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: '- Finding coder/coder versions matching "~\u003e 0.6.12"...', + }, + { + id: 461070, + created_at: "2023-03-06T14:47:32.922Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: '- Finding hashicorp/aws versions matching "~\u003e 4.55"...', + }, + { + id: 461071, + created_at: "2023-03-06T14:47:33.132Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "- Installing hashicorp/aws v4.57.0...", + }, + { + id: 461072, + created_at: "2023-03-06T14:47:37.364Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "- Installed hashicorp/aws v4.57.0 (signed by HashiCorp)", + }, + { + id: 461073, + created_at: "2023-03-06T14:47:38.142Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "- Installing coder/coder v0.6.15...", + }, + { + id: 461074, + created_at: "2023-03-06T14:47:39.083Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "- Installed coder/coder v0.6.15 (signed by a HashiCorp partner, key ID 93C75807601AA0EC)", + }, + { + id: 461075, + created_at: "2023-03-06T14:47:39.394Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461076, + created_at: "2023-03-06T14:47:39.394Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "Partner and community providers are signed by their developers.", + }, + { + id: 461077, + created_at: "2023-03-06T14:47:39.394Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "If you'd like to know more about provider signing, you can read about it here:", + }, + { + id: 461078, + created_at: "2023-03-06T14:47:39.394Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "https://www.terraform.io/docs/cli/plugins/signing.html", + }, + { + id: 461079, + created_at: "2023-03-06T14:47:39.394Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461080, + created_at: "2023-03-06T14:47:39.394Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "Terraform has created a lock file .terraform.lock.hcl to record the provider", + }, + { + id: 461081, + created_at: "2023-03-06T14:47:39.394Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "selections it made above. Include this file in your version control repository", + }, + { + id: 461082, + created_at: "2023-03-06T14:47:39.394Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "so that Terraform can guarantee to make the same selections by default when", + }, + { + id: 461083, + created_at: "2023-03-06T14:47:39.395Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: 'you run "terraform init" in the future.', + }, + { + id: 461084, + created_at: "2023-03-06T14:47:39.395Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461085, + created_at: "2023-03-06T14:47:39.395Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "Terraform has been successfully initialized!", + }, + { + id: 461086, + created_at: "2023-03-06T14:47:39.395Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461087, + created_at: "2023-03-06T14:47:39.395Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + 'You may now begin working with Terraform. Try running "terraform plan" to see', + }, + { + id: 461088, + created_at: "2023-03-06T14:47:39.395Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "any changes that are required for your infrastructure. All Terraform commands", + }, + { + id: 461089, + created_at: "2023-03-06T14:47:39.395Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "should now work.", + }, + { + id: 461090, + created_at: "2023-03-06T14:47:39.397Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461091, + created_at: "2023-03-06T14:47:39.397Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "If you ever set or change modules or backend configuration for Terraform,", + }, + { + id: 461092, + created_at: "2023-03-06T14:47:39.397Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: + "rerun this command to reinitialize your working directory. If you forget, other", + }, + { + id: 461093, + created_at: "2023-03-06T14:47:39.397Z", + log_source: "provisioner", + log_level: "debug", + stage: "Detecting persistent resources", + output: "commands will detect it and remind you to do so if necessary.", + }, + { + id: 461094, + created_at: "2023-03-06T14:47:39.431Z", + log_source: "provisioner", + log_level: "info", + stage: "Detecting persistent resources", + output: "Terraform 1.1.9", + }, + { + id: 461095, + created_at: "2023-03-06T14:47:43.759Z", + log_source: "provisioner", + log_level: "error", + stage: "Detecting persistent resources", + output: + "Error: configuring Terraform AWS Provider: no valid credential sources for Terraform AWS Provider found.\n\nPlease see https://registry.terraform.io/providers/hashicorp/aws\nfor more information about providing credentials.\n\nError: failed to refresh cached credentials, no EC2 IMDS role found, operation error ec2imds: GetMetadata, http response error StatusCode: 404, request to EC2 IMDS failed\n", + }, + { + id: 461096, + created_at: "2023-03-06T14:47:43.759Z", + log_source: "provisioner", + log_level: "error", + stage: "Detecting persistent resources", + output: "", + }, + { + id: 461097, + created_at: "2023-03-06T14:47:43.777Z", + log_source: "provisioner_daemon", + log_level: "info", + stage: "Cleaning Up", + output: "", + }, + ], + }, }; diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx index 53d171dc53..49ff828800 100644 --- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx +++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx @@ -8,10 +8,7 @@ import { TemplateVersionVariable, } from "api/typesGenerated"; import { Stack } from "components/Stack/Stack"; -import { - TemplateUpload, - TemplateUploadProps, -} from "pages/CreateTemplatePage/TemplateUpload"; +import { TemplateUpload, TemplateUploadProps } from "./TemplateUpload"; import { useFormik } from "formik"; import { SelectedTemplate } from "pages/CreateWorkspacePage/SelectedTemplate"; import { FC, useEffect } from "react"; @@ -46,7 +43,7 @@ import { docs } from "utils/docs"; import { AutostopRequirementDaysHelperText, AutostopRequirementWeeksHelperText, -} from "pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/AutostopRequirementHelperText"; +} from "pages/TemplateSettingsPage/TemplateSchedulePage/AutostopRequirementHelperText"; import MenuItem from "@mui/material/MenuItem"; const MAX_DESCRIPTION_CHAR_LIMIT = 128; diff --git a/site/src/pages/CreateTokenPage/CreateTokenPage.test.tsx b/site/src/pages/CreateTokenPage/CreateTokenPage.test.tsx index 709ee7fce2..cb16724781 100644 --- a/site/src/pages/CreateTokenPage/CreateTokenPage.test.tsx +++ b/site/src/pages/CreateTokenPage/CreateTokenPage.test.tsx @@ -2,7 +2,7 @@ import { renderWithAuth, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; -import { CreateTokenPage } from "pages/CreateTokenPage/CreateTokenPage"; +import { CreateTokenPage } from "./CreateTokenPage"; import * as API from "api/api"; import { screen, within } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; diff --git a/site/src/pages/CreateUserPage/CreateUserPage.test.tsx b/site/src/pages/CreateUserPage/CreateUserPage.test.tsx index 7baaa57468..f50a98977a 100644 --- a/site/src/pages/CreateUserPage/CreateUserPage.test.tsx +++ b/site/src/pages/CreateUserPage/CreateUserPage.test.tsx @@ -1,13 +1,11 @@ import { fireEvent, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import { rest } from "msw"; import { Language as FormLanguage } from "./CreateUserForm"; import { Language as FooterLanguage } from "components/FormFooter/FormFooter"; import { renderWithAuth, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; -import { server } from "testHelpers/server"; import { Language as CreateUserLanguage } from "xServices/users/createUserXService"; import { CreateUserPage } from "./CreateUserPage"; @@ -45,37 +43,6 @@ const fillForm = async ({ }; describe("Create User Page", () => { - it("shows validation error message", async () => { - await renderCreateUserPage(); - await fillForm({ email: "test" }); - const errorMessage = await screen.findByText(FormLanguage.emailInvalid); - expect(errorMessage).toBeDefined(); - }); - - it("shows API error message", async () => { - const fieldErrorMessage = "username already in use"; - server.use( - rest.post("/api/v2/users", async (req, res, ctx) => { - return res( - ctx.status(400), - ctx.json({ - message: "invalid field", - validations: [ - { - detail: fieldErrorMessage, - field: "username", - }, - ], - }), - ); - }), - ); - await renderCreateUserPage(); - await fillForm({}); - const errorMessage = await screen.findByText(fieldErrorMessage); - expect(errorMessage).toBeDefined(); - }); - it("shows success notification and redirects to users page", async () => { await renderCreateUserPage(); await fillForm({}); diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx index 5f47c5dcba..2f8ff41ea4 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx @@ -54,30 +54,6 @@ Object.defineProperty(window, "BroadcastChannel", { }); describe("CreateWorkspacePage", () => { - it("renders", async () => { - jest - .spyOn(API, "getTemplateVersionRichParameters") - .mockResolvedValueOnce([MockTemplateVersionParameter1]); - renderCreateWorkspacePage(); - - const element = await screen.findByText(createWorkspaceText); - expect(element).toBeDefined(); - }); - - it("renders with rich parameter", async () => { - jest - .spyOn(API, "getTemplateVersionRichParameters") - .mockResolvedValueOnce([MockTemplateVersionParameter1]); - renderCreateWorkspacePage(); - - const element = await screen.findByText(createWorkspaceText); - expect(element).toBeDefined(); - const firstParameter = await screen.findByText( - MockTemplateVersionParameter1.description, - ); - expect(firstParameter).toBeDefined(); - }); - it("succeeds with default owner", async () => { jest .spyOn(API, "getUsers") diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx index bf3fab55aa..b404757bdd 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx @@ -10,7 +10,7 @@ import { import { CreateWorkspacePageView } from "./CreateWorkspacePageView"; const meta: Meta = { - title: "components/Alert", + title: "pages/CreateWorkspacePageView", component: CreateWorkspacePageView, args: { defaultName: "", diff --git a/site/src/pages/CreateWorkspacePage/GitAuth.stories.tsx b/site/src/pages/CreateWorkspacePage/GitAuth.stories.tsx index 26eb8b5841..bd6f8cf813 100644 --- a/site/src/pages/CreateWorkspacePage/GitAuth.stories.tsx +++ b/site/src/pages/CreateWorkspacePage/GitAuth.stories.tsx @@ -1,57 +1,66 @@ -import { Story } from "@storybook/react"; -import { GitAuth, GitAuthProps } from "./GitAuth"; +import { GitAuth } from "./GitAuth"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "components/GitAuth", component: GitAuth, }; -const Template: Story = (args) => ; +export default meta; +type Story = StoryObj; -export const GithubNotAuthenticated = Template.bind({}); -GithubNotAuthenticated.args = { - type: "github", - authenticated: false, +export const GithubNotAuthenticated: Story = { + args: { + type: "github", + authenticated: false, + }, }; -export const GithubAuthenticated = Template.bind({}); -GithubAuthenticated.args = { - type: "github", - authenticated: true, +export const GithubAuthenticated: Story = { + args: { + type: "github", + authenticated: true, + }, }; -export const GitlabNotAuthenticated = Template.bind({}); -GitlabNotAuthenticated.args = { - type: "gitlab", - authenticated: false, +export const GitlabNotAuthenticated: Story = { + args: { + type: "gitlab", + authenticated: false, + }, }; -export const GitlabAuthenticated = Template.bind({}); -GitlabAuthenticated.args = { - type: "gitlab", - authenticated: true, +export const GitlabAuthenticated: Story = { + args: { + type: "gitlab", + authenticated: true, + }, }; -export const AzureDevOpsNotAuthenticated = Template.bind({}); -AzureDevOpsNotAuthenticated.args = { - type: "azure-devops", - authenticated: false, +export const AzureDevOpsNotAuthenticated: Story = { + args: { + type: "azure-devops", + authenticated: false, + }, }; -export const AzureDevOpsAuthenticated = Template.bind({}); -AzureDevOpsAuthenticated.args = { - type: "azure-devops", - authenticated: true, +export const AzureDevOpsAuthenticated: Story = { + args: { + type: "azure-devops", + authenticated: true, + }, }; -export const BitbucketNotAuthenticated = Template.bind({}); -BitbucketNotAuthenticated.args = { - type: "bitbucket", - authenticated: false, +export const BitbucketNotAuthenticated: Story = { + args: { + type: "bitbucket", + authenticated: false, + }, }; -export const BitbucketAuthenticated = Template.bind({}); -BitbucketAuthenticated.args = { - type: "bitbucket", - authenticated: true, +export const BitbucketAuthenticated: Story = { + args: { + type: "bitbucket", + authenticated: true, + }, }; diff --git a/site/src/pages/CreateWorkspacePage/SelectedTemplate.stories.tsx b/site/src/pages/CreateWorkspacePage/SelectedTemplate.stories.tsx index c2aae06763..51f54b0951 100644 --- a/site/src/pages/CreateWorkspacePage/SelectedTemplate.stories.tsx +++ b/site/src/pages/CreateWorkspacePage/SelectedTemplate.stories.tsx @@ -1,28 +1,29 @@ -import { ComponentMeta, Story } from "@storybook/react"; import { MockTemplate } from "../../testHelpers/entities"; -import { SelectedTemplate, SelectedTemplateProps } from "./SelectedTemplate"; +import { SelectedTemplate } from "./SelectedTemplate"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "components/SelectedTemplate", component: SelectedTemplate, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const WithIcon = Template.bind({}); -WithIcon.args = { - template: { - ...MockTemplate, - icon: "/icon/docker.png", +export const WithIcon: Story = { + args: { + template: { + ...MockTemplate, + icon: "/icon/docker.png", + }, }, }; -export const WithoutIcon = Template.bind({}); -WithoutIcon.args = { - template: { - ...MockTemplate, - icon: "", +export const WithoutIcon: Story = { + args: { + template: { + ...MockTemplate, + icon: "", + }, }, }; diff --git a/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.stories.tsx index 1332e4c5ea..da41824db5 100644 --- a/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.stories.tsx @@ -1,10 +1,7 @@ -import { ComponentMeta, Story } from "@storybook/react"; -import { - AppearanceSettingsPageView, - AppearanceSettingsPageViewProps, -} from "./AppearanceSettingsPageView"; +import { AppearanceSettingsPageView } from "./AppearanceSettingsPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/AppearanceSettingsPageView", component: AppearanceSettingsPageView, args: { @@ -21,9 +18,9 @@ export default { return undefined; }, }, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); -export const Page = Template.bind({}); +export default meta; +type Story = StoryObj; + +export const Page: Story = {}; diff --git a/site/src/pages/DeploySettingsPage/GitAuthSettingsPage/GitAuthSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/GitAuthSettingsPage/GitAuthSettingsPageView.stories.tsx index 6c4eafb91e..4c9892de56 100644 --- a/site/src/pages/DeploySettingsPage/GitAuthSettingsPage/GitAuthSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/GitAuthSettingsPage/GitAuthSettingsPageView.stories.tsx @@ -1,10 +1,7 @@ -import { ComponentMeta, Story } from "@storybook/react"; -import { - GitAuthSettingsPageView, - GitAuthSettingsPageViewProps, -} from "./GitAuthSettingsPageView"; +import { GitAuthSettingsPageView } from "./GitAuthSettingsPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/GitAuthSettingsPageView", component: GitAuthSettingsPageView, args: { @@ -19,9 +16,9 @@ export default { ], }, }, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); -export const Page = Template.bind({}); +export default meta; +type Story = StoryObj; + +export const Page: Story = {}; diff --git a/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.stories.tsx index 4749fcc04e..c9c155de37 100644 --- a/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.stories.tsx @@ -1,60 +1,71 @@ -import { ComponentMeta, Story } from "@storybook/react"; -import { - NetworkSettingsPageView, - NetworkSettingsPageViewProps, -} from "./NetworkSettingsPageView"; +import { DeploymentGroup } from "api/types"; +import { NetworkSettingsPageView } from "./NetworkSettingsPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const group: DeploymentGroup = { + name: "Networking", + description: "", + children: [] as DeploymentGroup[], +}; + +const meta: Meta = { title: "pages/NetworkSettingsPageView", component: NetworkSettingsPageView, args: { options: [ { name: "DERP Server Enable", - usage: "Whether to enable or disable the embedded DERP relay server.", + description: + "Whether to enable or disable the embedded DERP relay server.", value: true, - group: { - name: "Networking", - }, + group, + flag: "derp", + flag_shorthand: "d", + hidden: false, }, { name: "DERP Server Region Name", - usage: "Region name that for the embedded DERP server.", + description: "Region name that for the embedded DERP server.", value: "aws-east", - group: { - name: "Networking", - }, + group, + flag: "derp", + flag_shorthand: "d", + hidden: false, }, { name: "DERP Server STUN Addresses", - usage: + description: "Addresses for STUN servers to establish P2P connections. Set empty to disable P2P connections.", value: ["stun.l.google.com:19302", "stun.l.google.com:19301"], - group: { - name: "Networking", - }, + group, + flag: "derp", + flag_shorthand: "d", + hidden: false, }, { name: "DERP Config URL", - usage: + description: "URL to fetch a DERP mapping on startup. See: https://tailscale.com/kb/1118/custom-derp-servers/", value: "https://coder.com", - group: { - name: "Networking", - }, + group, + flag: "derp", + flag_shorthand: "d", + hidden: false, }, { name: "Wildcard Access URL", + description: "", value: "https://coder.com", - group: { - name: "Networking", - }, + group, + flag: "derp", + flag_shorthand: "d", + hidden: false, }, ], }, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); -export const Page = Template.bind({}); +export default meta; +type Story = StoryObj; + +export const Page: Story = {}; diff --git a/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.stories.tsx index 4ccbbdcba6..1e3521e9bf 100644 --- a/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.stories.tsx @@ -1,11 +1,14 @@ -import { ComponentMeta, Story } from "@storybook/react"; -import { DeploymentOption } from "api/types"; -import { - SecuritySettingsPageView, - SecuritySettingsPageViewProps, -} from "./SecuritySettingsPageView"; +import { DeploymentGroup, DeploymentOption } from "api/types"; +import { SecuritySettingsPageView } from "./SecuritySettingsPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const group: DeploymentGroup = { + name: "Networking", + description: "", + children: [] as DeploymentGroup[], +}; + +const meta: Meta = { title: "pages/SecuritySettingsPageView", component: SecuritySettingsPageView, args: { @@ -14,50 +17,62 @@ export default { name: "SSH Keygen Algorithm", description: "something", value: "1234", + group, + flag: "derp", + flag_shorthand: "d", + hidden: false, }, { name: "Secure Auth Cookie", description: "something", value: "1234", + flag: "derp", + flag_shorthand: "d", + hidden: false, }, { name: "Disable Owner Workspace Access", description: "something", value: false, + flag: "derp", + flag_shorthand: "d", + hidden: false, }, { name: "TLS Version", description: "something", value: ["something"], - group: { - name: "TLS", - }, + group: { ...group, name: "TLS" }, + flag: "derp", + flag_shorthand: "d", + hidden: false, }, ], featureAuditLogEnabled: true, featureBrowserOnlyEnabled: true, }, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); -export const Page = Template.bind({}); +export default meta; +type Story = StoryObj; -export const NoTLS = Template.bind({}); -NoTLS.args = { - options: [ - { - name: "SSH Keygen Algorithm", - value: "1234", - } as DeploymentOption, - { - name: "Disable Owner Workspace Access", - value: false, - } as DeploymentOption, - { - name: "Secure Auth Cookie", - value: "1234", - } as DeploymentOption, - ], +export const Page: Story = {}; + +export const NoTLS = { + args: { + options: [ + { + name: "SSH Keygen Algorithm", + value: "1234", + } as DeploymentOption, + { + name: "Disable Owner Workspace Access", + value: false, + } as DeploymentOption, + { + name: "Secure Auth Cookie", + value: "1234", + } as DeploymentOption, + ], + }, }; diff --git a/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.stories.tsx index d0047d6dd3..892f1a6e72 100644 --- a/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.stories.tsx @@ -1,10 +1,20 @@ -import { ComponentMeta, Story } from "@storybook/react"; -import { - UserAuthSettingsPageView, - UserAuthSettingsPageViewProps, -} from "./UserAuthSettingsPageView"; +import { DeploymentGroup } from "api/types"; +import { UserAuthSettingsPageView } from "./UserAuthSettingsPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const oidcGroup: DeploymentGroup = { + name: "OIDC", + description: "", + children: [] as DeploymentGroup[], +}; + +const ghGroup: DeploymentGroup = { + name: "GitHub", + description: "", + children: [] as DeploymentGroup[], +}; + +const meta: Meta = { title: "pages/UserAuthSettingsPageView", component: UserAuthSettingsPageView, args: { @@ -13,91 +23,101 @@ export default { name: "OIDC Client ID", description: "Client ID to use for Login with OIDC.", value: "1234", - group: { - name: "OIDC", - }, + group: oidcGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OIDC Allow Signups", description: "Whether new users can sign up with OIDC.", value: true, - group: { - name: "OIDC", - }, + group: oidcGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OIDC Email Domain", description: "Email domains that clients logging in with OIDC must match.", value: "@coder.com", - group: { - name: "OIDC", - }, + group: oidcGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OIDC Issuer URL", description: "Issuer URL to use for Login with OIDC.", value: "https://coder.com", - group: { - name: "OIDC", - }, + group: oidcGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OIDC Scopes", description: "Scopes to grant when authenticating with OIDC.", value: ["idk"], - group: { - name: "OIDC", - }, + group: oidcGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OAuth2 GitHub Client ID", description: "Client ID for Login with GitHub.", value: "1224", - group: { - name: "GitHub", - }, + group: ghGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OAuth2 GitHub Allow Signups", description: "Whether new users can sign up with GitHub.", value: true, - group: { - name: "GitHub", - }, + group: ghGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OAuth2 GitHub Enterprise Base URL", description: "Base URL of a GitHub Enterprise deployment to use for Login with GitHub.", value: "https://google.com", - group: { - name: "GitHub", - }, + group: ghGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OAuth2 GitHub Allowed Orgs", description: "Organizations the user must be a member of to Login with GitHub.", value: true, - group: { - name: "GitHub", - }, + group: ghGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, { name: "OAuth2 GitHub Allowed Teams", description: "Teams inside organizations the user must be a member of to Login with GitHub. Structured as: /.", value: true, - group: { - name: "GitHub", - }, + group: ghGroup, + flag: "oidc", + flag_shorthand: "o", + hidden: false, }, ], }, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); -export const Page = Template.bind({}); +export default meta; +type Story = StoryObj; + +export const Page: Story = {}; diff --git a/site/src/pages/GroupsPage/CreateGroupPageView.stories.tsx b/site/src/pages/GroupsPage/CreateGroupPageView.stories.tsx index eb75881df4..eb67b9c109 100644 --- a/site/src/pages/GroupsPage/CreateGroupPageView.stories.tsx +++ b/site/src/pages/GroupsPage/CreateGroupPageView.stories.tsx @@ -1,17 +1,12 @@ -import { Story } from "@storybook/react"; -import { - CreateGroupPageView, - CreateGroupPageViewProps, -} from "./CreateGroupPageView"; +import { CreateGroupPageView } from "./CreateGroupPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/CreateGroupPageView", component: CreateGroupPageView, }; -const Template: Story = ( - args: CreateGroupPageViewProps, -) => ; +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = {}; +export const Example: Story = {}; diff --git a/site/src/pages/GroupsPage/GroupsPageView.stories.tsx b/site/src/pages/GroupsPage/GroupsPageView.stories.tsx index 030934180e..45330e3f31 100644 --- a/site/src/pages/GroupsPage/GroupsPageView.stories.tsx +++ b/site/src/pages/GroupsPage/GroupsPageView.stories.tsx @@ -1,47 +1,51 @@ -import { Story } from "@storybook/react"; import { MockGroup } from "testHelpers/entities"; -import { GroupsPageView, GroupsPageViewProps } from "./GroupsPageView"; +import { GroupsPageView } from "./GroupsPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/GroupsPageView", component: GroupsPageView, }; -const Template: Story = (args: GroupsPageViewProps) => ( - -); +export default meta; +type Story = StoryObj; -export const NotEnabled = Template.bind({}); -NotEnabled.args = { - groups: [MockGroup], - canCreateGroup: true, - isTemplateRBACEnabled: false, +export const NotEnabled: Story = { + args: { + groups: [MockGroup], + canCreateGroup: true, + isTemplateRBACEnabled: false, + }, }; -export const WithGroups = Template.bind({}); -WithGroups.args = { - groups: [MockGroup], - canCreateGroup: true, - isTemplateRBACEnabled: true, +export const WithGroups: Story = { + args: { + groups: [MockGroup], + canCreateGroup: true, + isTemplateRBACEnabled: true, + }, }; -export const WithDisplayGroup = Template.bind({}); -WithGroups.args = { - groups: [{ ...MockGroup, name: "front-end" }], - canCreateGroup: true, - isTemplateRBACEnabled: true, +export const WithDisplayGroup: Story = { + args: { + groups: [{ ...MockGroup, name: "front-end" }], + canCreateGroup: true, + isTemplateRBACEnabled: true, + }, }; -export const EmptyGroup = Template.bind({}); -EmptyGroup.args = { - groups: [], - canCreateGroup: false, - isTemplateRBACEnabled: true, +export const EmptyGroup: Story = { + args: { + groups: [], + canCreateGroup: false, + isTemplateRBACEnabled: true, + }, }; -export const EmptyGroupWithPermission = Template.bind({}); -EmptyGroupWithPermission.args = { - groups: [], - canCreateGroup: true, - isTemplateRBACEnabled: true, +export const EmptyGroupWithPermission: Story = { + args: { + groups: [], + canCreateGroup: true, + isTemplateRBACEnabled: true, + }, }; diff --git a/site/src/pages/GroupsPage/SettingsGroupPageView.stories.tsx b/site/src/pages/GroupsPage/SettingsGroupPageView.stories.tsx index 244fa526af..4e0c8063bf 100644 --- a/site/src/pages/GroupsPage/SettingsGroupPageView.stories.tsx +++ b/site/src/pages/GroupsPage/SettingsGroupPageView.stories.tsx @@ -1,21 +1,18 @@ -import { Story } from "@storybook/react"; import { MockGroup } from "testHelpers/entities"; -import { - SettingsGroupPageView, - SettingsGroupPageViewProps, -} from "./SettingsGroupPageView"; +import { SettingsGroupPageView } from "./SettingsGroupPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/SettingsGroupPageView", component: SettingsGroupPageView, }; -const Template: Story = ( - args: SettingsGroupPageViewProps, -) => ; +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = { - group: MockGroup, - isLoading: false, +export const Example: Story = { + args: { + group: MockGroup, + isLoading: false, + }, }; diff --git a/site/src/pages/LoginPage/LoginPage.test.tsx b/site/src/pages/LoginPage/LoginPage.test.tsx index 0e40048c23..4b923b7732 100644 --- a/site/src/pages/LoginPage/LoginPage.test.tsx +++ b/site/src/pages/LoginPage/LoginPage.test.tsx @@ -2,13 +2,13 @@ import { fireEvent, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { rest } from "msw"; import { createMemoryRouter } from "react-router-dom"; -import { Language } from "./SignInForm/SignInForm"; +import { Language } from "./SignInForm"; import { render, renderWithRouter, waitForLoaderToBeRemoved, -} from "../../testHelpers/renderHelpers"; -import { server } from "../../testHelpers/server"; +} from "testHelpers/renderHelpers"; +import { server } from "testHelpers/server"; import { LoginPage } from "./LoginPage"; import * as TypesGen from "api/typesGenerated"; import { i18n } from "i18n"; @@ -25,14 +25,6 @@ describe("LoginPage", () => { ); }); - it("renders the sign-in form", async () => { - // When - render(); - - // Then - await screen.findByText(Language.passwordSignIn); - }); - it("shows an error message if SignIn fails", async () => { // Given const apiErrorMessage = "Something wrong happened"; @@ -59,28 +51,6 @@ describe("LoginPage", () => { expect(errorMessage).toBeDefined(); }); - it("shows github authentication when enabled", async () => { - const authMethods: TypesGen.AuthMethods = { - password: { enabled: true }, - github: { enabled: true }, - oidc: { enabled: true, signInText: "", iconUrl: "" }, - }; - - // Given - server.use( - rest.get("/api/v2/users/authmethods", async (req, res, ctx) => { - return res(ctx.status(200), ctx.json(authMethods)); - }), - ); - - // When - render(); - - // Then - expect(screen.queryByText(Language.passwordSignIn)).not.toBeInTheDocument(); - await screen.findByText(Language.githubSignIn); - }); - it("redirects to the setup page if there is no first user", async () => { // Given server.use( diff --git a/site/src/pages/LoginPage/LoginPageView.stories.tsx b/site/src/pages/LoginPage/LoginPageView.stories.tsx index 0681cc3b23..a28baadd95 100644 --- a/site/src/pages/LoginPage/LoginPageView.stories.tsx +++ b/site/src/pages/LoginPage/LoginPageView.stories.tsx @@ -1,59 +1,62 @@ import { action } from "@storybook/addon-actions"; -import { ComponentMeta, Story } from "@storybook/react"; import { MockAuthMethods } from "testHelpers/entities"; -import { LoginPageView, LoginPageViewProps } from "./LoginPageView"; +import { LoginPageView } from "./LoginPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/LoginPageView", component: LoginPageView, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = { - isLoading: false, - onSignIn: action("onSignIn"), - context: { - data: { - authMethods: MockAuthMethods, - hasFirstUser: false, +export const Example: Story = { + args: { + isLoading: false, + onSignIn: action("onSignIn"), + context: { + data: { + authMethods: MockAuthMethods, + hasFirstUser: false, + }, }, }, }; const err = new Error("Username or email are wrong."); -export const AuthError = Template.bind({}); -AuthError.args = { - isLoading: false, - onSignIn: action("onSignIn"), - context: { - error: err, - data: { - authMethods: MockAuthMethods, - hasFirstUser: false, +export const AuthError: Story = { + args: { + isLoading: false, + onSignIn: action("onSignIn"), + context: { + error: err, + data: { + authMethods: MockAuthMethods, + hasFirstUser: false, + }, }, }, }; -export const LoadingInitialData = Template.bind({}); -LoadingInitialData.args = { - isLoading: true, - onSignIn: action("onSignIn"), - context: {}, +export const LoadingInitialData: Story = { + args: { + isLoading: true, + onSignIn: action("onSignIn"), + context: {}, + }, }; -export const SigningIn = Template.bind({}); -SigningIn.args = { - isSigningIn: true, - onSignIn: action("onSignIn"), - context: { - data: { - authMethods: MockAuthMethods, - hasFirstUser: false, +export const SigningIn: Story = { + args: { + isSigningIn: true, + onSignIn: action("onSignIn"), + context: { + data: { + authMethods: MockAuthMethods, + hasFirstUser: false, + }, }, }, }; diff --git a/site/src/pages/LoginPage/LoginPageView.tsx b/site/src/pages/LoginPage/LoginPageView.tsx index 1209224f60..d724767aeb 100644 --- a/site/src/pages/LoginPage/LoginPageView.tsx +++ b/site/src/pages/LoginPage/LoginPageView.tsx @@ -3,7 +3,7 @@ import { FullScreenLoader } from "components/Loader/FullScreenLoader"; import { FC } from "react"; import { useLocation } from "react-router-dom"; import { AuthContext, UnauthenticatedData } from "xServices/auth/authXService"; -import { SignInForm } from "pages/LoginPage/SignInForm/SignInForm"; +import { SignInForm } from "./SignInForm"; import { retrieveRedirect } from "utils/redirect"; import { CoderIcon } from "components/Icons/CoderIcon"; diff --git a/site/src/pages/LoginPage/SignInForm/OAuthSignInForm.tsx b/site/src/pages/LoginPage/OAuthSignInForm.tsx similarity index 97% rename from site/src/pages/LoginPage/SignInForm/OAuthSignInForm.tsx rename to site/src/pages/LoginPage/OAuthSignInForm.tsx index cc450debff..0b8515b33e 100644 --- a/site/src/pages/LoginPage/SignInForm/OAuthSignInForm.tsx +++ b/site/src/pages/LoginPage/OAuthSignInForm.tsx @@ -4,7 +4,7 @@ import GitHubIcon from "@mui/icons-material/GitHub"; import KeyIcon from "@mui/icons-material/VpnKey"; import Box from "@mui/material/Box"; import { Language } from "./SignInForm"; -import { AuthMethods } from "../../../api/typesGenerated"; +import { AuthMethods } from "api/typesGenerated"; import { FC } from "react"; import { makeStyles } from "@mui/styles"; diff --git a/site/src/pages/LoginPage/SignInForm/PasswordSignInForm.tsx b/site/src/pages/LoginPage/PasswordSignInForm.tsx similarity index 90% rename from site/src/pages/LoginPage/SignInForm/PasswordSignInForm.tsx rename to site/src/pages/LoginPage/PasswordSignInForm.tsx index 6e919ef346..3703e78044 100644 --- a/site/src/pages/LoginPage/SignInForm/PasswordSignInForm.tsx +++ b/site/src/pages/LoginPage/PasswordSignInForm.tsx @@ -1,7 +1,7 @@ -import { Stack } from "../../../components/Stack/Stack"; +import { Stack } from "components/Stack/Stack"; import TextField from "@mui/material/TextField"; -import { getFormHelpers, onChangeTrimmed } from "../../../utils/formUtils"; -import { LoadingButton } from "../../../components/LoadingButton/LoadingButton"; +import { getFormHelpers, onChangeTrimmed } from "utils/formUtils"; +import { LoadingButton } from "components/LoadingButton/LoadingButton"; import { Language } from "./SignInForm"; import { FormikContextType, FormikTouched, useFormik } from "formik"; import * as Yup from "yup"; diff --git a/site/src/pages/LoginPage/SignInForm.stories.tsx b/site/src/pages/LoginPage/SignInForm.stories.tsx new file mode 100644 index 0000000000..548414326e --- /dev/null +++ b/site/src/pages/LoginPage/SignInForm.stories.tsx @@ -0,0 +1,94 @@ +import { mockApiError } from "testHelpers/entities"; +import { SignInForm } from "./SignInForm"; +import type { Meta, StoryObj } from "@storybook/react"; + +const meta: Meta = { + title: "components/SignInForm", + component: SignInForm, + args: { + isSigningIn: false, + }, +}; + +export default meta; +type Story = StoryObj; + +export const SignedOut: Story = {}; + +export const SigningIn: Story = { + args: { + isSigningIn: true, + authMethods: { + password: { enabled: true }, + github: { enabled: true }, + oidc: { enabled: false, signInText: "", iconUrl: "" }, + }, + }, +}; + +export const WithError: Story = { + args: { + error: mockApiError({ + message: "Email or password was invalid", + validations: [ + { + field: "password", + detail: "Password is invalid.", + }, + ], + }), + initialTouched: { + password: true, + }, + }, +}; + +export const WithGithub: Story = { + args: { + authMethods: { + password: { enabled: true }, + github: { enabled: true }, + oidc: { enabled: false, signInText: "", iconUrl: "" }, + }, + }, +}; + +export const WithOIDC: Story = { + args: { + authMethods: { + password: { enabled: true }, + github: { enabled: false }, + oidc: { enabled: true, signInText: "", iconUrl: "" }, + }, + }, +}; + +export const WithOIDCWithoutPassword: Story = { + args: { + authMethods: { + password: { enabled: false }, + github: { enabled: false }, + oidc: { enabled: true, signInText: "", iconUrl: "" }, + }, + }, +}; + +export const WithoutAny: Story = { + args: { + authMethods: { + password: { enabled: false }, + github: { enabled: false }, + oidc: { enabled: false, signInText: "", iconUrl: "" }, + }, + }, +}; + +export const WithGithubAndOIDC: Story = { + args: { + authMethods: { + password: { enabled: true }, + github: { enabled: true }, + oidc: { enabled: true, signInText: "", iconUrl: "" }, + }, + }, +}; diff --git a/site/src/pages/LoginPage/SignInForm/SignInForm.tsx b/site/src/pages/LoginPage/SignInForm.tsx similarity index 97% rename from site/src/pages/LoginPage/SignInForm/SignInForm.tsx rename to site/src/pages/LoginPage/SignInForm.tsx index 6801cee1c4..434940c52f 100644 --- a/site/src/pages/LoginPage/SignInForm/SignInForm.tsx +++ b/site/src/pages/LoginPage/SignInForm.tsx @@ -1,9 +1,9 @@ import { makeStyles } from "@mui/styles"; import { FormikTouched } from "formik"; import { FC, useState } from "react"; -import { AuthMethods } from "../../../api/typesGenerated"; +import { AuthMethods } from "api/typesGenerated"; import { useTranslation } from "react-i18next"; -import { Maybe } from "../../../components/Conditionals/Maybe"; +import { Maybe } from "components/Conditionals/Maybe"; import { PasswordSignInForm } from "./PasswordSignInForm"; import { OAuthSignInForm } from "./OAuthSignInForm"; import { BuiltInAuthFormValues } from "./SignInForm.types"; diff --git a/site/src/pages/LoginPage/SignInForm/SignInForm.types.ts b/site/src/pages/LoginPage/SignInForm.types.ts similarity index 100% rename from site/src/pages/LoginPage/SignInForm/SignInForm.types.ts rename to site/src/pages/LoginPage/SignInForm.types.ts diff --git a/site/src/pages/LoginPage/SignInForm/SignInForm.stories.tsx b/site/src/pages/LoginPage/SignInForm/SignInForm.stories.tsx deleted file mode 100644 index 16dd0f0823..0000000000 --- a/site/src/pages/LoginPage/SignInForm/SignInForm.stories.tsx +++ /dev/null @@ -1,102 +0,0 @@ -import { Story } from "@storybook/react"; -import { mockApiError } from "testHelpers/entities"; -import { SignInForm, SignInFormProps } from "./SignInForm"; - -export default { - title: "components/SignInForm", - component: SignInForm, - argTypes: { - isLoading: "boolean", - onSubmit: { action: "Submit" }, - }, -}; - -const Template: Story = (args: SignInFormProps) => ( - -); - -export const SignedOut = Template.bind({}); -SignedOut.args = { - isSigningIn: false, - onSubmit: () => { - return Promise.resolve(); - }, -}; - -export const SigningIn = Template.bind({}); -SigningIn.args = { - ...SignedOut.args, - isSigningIn: true, - authMethods: { - password: { enabled: true }, - github: { enabled: true }, - oidc: { enabled: false, signInText: "", iconUrl: "" }, - }, -}; - -export const WithError = Template.bind({}); -WithError.args = { - ...SignedOut.args, - error: mockApiError({ - message: "Email or password was invalid", - validations: [ - { - field: "password", - detail: "Password is invalid.", - }, - ], - }), - initialTouched: { - password: true, - }, -}; - -export const WithGithub = Template.bind({}); -WithGithub.args = { - ...SignedOut.args, - authMethods: { - password: { enabled: true }, - github: { enabled: true }, - oidc: { enabled: false, signInText: "", iconUrl: "" }, - }, -}; - -export const WithOIDC = Template.bind({}); -WithOIDC.args = { - ...SignedOut.args, - authMethods: { - password: { enabled: true }, - github: { enabled: false }, - oidc: { enabled: true, signInText: "", iconUrl: "" }, - }, -}; - -export const WithOIDCWithoutPassword = Template.bind({}); -WithOIDCWithoutPassword.args = { - ...SignedOut.args, - authMethods: { - password: { enabled: false }, - github: { enabled: false }, - oidc: { enabled: true, signInText: "", iconUrl: "" }, - }, -}; - -export const WithoutAny = Template.bind({}); -WithoutAny.args = { - ...SignedOut.args, - authMethods: { - password: { enabled: false }, - github: { enabled: false }, - oidc: { enabled: false, signInText: "", iconUrl: "" }, - }, -}; - -export const WithGithubAndOIDC = Template.bind({}); -WithGithubAndOIDC.args = { - ...SignedOut.args, - authMethods: { - password: { enabled: true }, - github: { enabled: true }, - oidc: { enabled: true, signInText: "", iconUrl: "" }, - }, -}; diff --git a/site/src/pages/SetupPage/SetupPageView.stories.tsx b/site/src/pages/SetupPage/SetupPageView.stories.tsx index 1cbe5e03a1..d8bca32431 100644 --- a/site/src/pages/SetupPage/SetupPageView.stories.tsx +++ b/site/src/pages/SetupPage/SetupPageView.stories.tsx @@ -1,32 +1,27 @@ -import { action } from "@storybook/addon-actions"; -import { Story } from "@storybook/react"; -import { SetupPageView, SetupPageViewProps } from "./SetupPageView"; +import { SetupPageView } from "./SetupPageView"; import { mockApiError } from "testHelpers/entities"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/SetupPageView", component: SetupPageView, }; -const Template: Story = (args: SetupPageViewProps) => ( - -); +export default meta; +type Story = StoryObj; -export const Ready = Template.bind({}); -Ready.args = { - onSubmit: action("submit"), +export const Ready: Story = {}; + +export const FormError: Story = { + args: { + error: mockApiError({ + validations: [{ field: "username", detail: "Username taken" }], + }), + }, }; -export const FormError = Template.bind({}); -FormError.args = { - onSubmit: action("submit"), - error: mockApiError({ - validations: [{ field: "username", detail: "Username taken" }], - }), -}; - -export const Loading = Template.bind({}); -Loading.args = { - onSubmit: action("submit"), - isLoading: true, +export const Loading: Story = { + args: { + isLoading: true, + }, }; diff --git a/site/src/pages/StarterTemplatePage/StarterTemplatePage.test.tsx b/site/src/pages/StarterTemplatePage/StarterTemplatePage.test.tsx deleted file mode 100644 index a196be8fd2..0000000000 --- a/site/src/pages/StarterTemplatePage/StarterTemplatePage.test.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import { screen } from "@testing-library/react"; -import { MockTemplateExample } from "testHelpers/entities"; -import { - renderWithAuth, - waitForLoaderToBeRemoved, -} from "testHelpers/renderHelpers"; -import StarterTemplatePage from "./StarterTemplatePage"; - -jest.mock("remark-gfm", () => jest.fn()); - -describe("StarterTemplatePage", () => { - it("shows the starter template", async () => { - renderWithAuth(, { - route: `/starter-templates/${MockTemplateExample.id}`, - path: "/starter-templates/:exampleId", - }); - await waitForLoaderToBeRemoved(); - expect(screen.getByText(MockTemplateExample.name)).toBeInTheDocument(); - }); -}); diff --git a/site/src/pages/StarterTemplatePage/StarterTemplatePageView.stories.tsx b/site/src/pages/StarterTemplatePage/StarterTemplatePageView.stories.tsx index ef9489fe79..4434ab57e6 100644 --- a/site/src/pages/StarterTemplatePage/StarterTemplatePageView.stories.tsx +++ b/site/src/pages/StarterTemplatePage/StarterTemplatePageView.stories.tsx @@ -1,41 +1,39 @@ -import { Story } from "@storybook/react"; import { mockApiError, MockOrganization, MockTemplateExample, } from "testHelpers/entities"; -import { - StarterTemplatePageView, - StarterTemplatePageViewProps, -} from "./StarterTemplatePageView"; +import { StarterTemplatePageView } from "./StarterTemplatePageView"; -export default { +import type { Meta, StoryObj } from "@storybook/react"; + +const meta: Meta = { title: "pages/StarterTemplatePageView", component: StarterTemplatePageView, }; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Default = Template.bind({}); -Default.args = { - context: { - exampleId: MockTemplateExample.id, - organizationId: MockOrganization.id, - error: undefined, - starterTemplate: MockTemplateExample, +export const Default: Story = { + args: { + context: { + exampleId: MockTemplateExample.id, + organizationId: MockOrganization.id, + error: undefined, + starterTemplate: MockTemplateExample, + }, }, }; - -export const Error = Template.bind({}); -Error.args = { - context: { - exampleId: MockTemplateExample.id, - organizationId: MockOrganization.id, - error: mockApiError({ - message: `Example ${MockTemplateExample.id} not found.`, - }), - starterTemplate: undefined, +export const Error: Story = { + args: { + context: { + exampleId: MockTemplateExample.id, + organizationId: MockOrganization.id, + error: mockApiError({ + message: `Example ${MockTemplateExample.id} not found.`, + }), + starterTemplate: undefined, + }, }, }; diff --git a/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.test.tsx b/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.test.tsx deleted file mode 100644 index 27ce03f488..0000000000 --- a/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.test.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import { screen } from "@testing-library/react"; -import { - MockTemplateExample, - MockTemplateExample2, -} from "testHelpers/entities"; -import { - renderWithAuth, - waitForLoaderToBeRemoved, -} from "testHelpers/renderHelpers"; -import StarterTemplatesPage from "./StarterTemplatesPage"; - -describe("StarterTemplatesPage", () => { - it("shows the starter template", async () => { - renderWithAuth(, { - route: `/starter-templates`, - path: "/starter-templates", - }); - await waitForLoaderToBeRemoved(); - expect(screen.getByText(MockTemplateExample.name)).toBeInTheDocument(); - expect(screen.getByText(MockTemplateExample2.name)).toBeInTheDocument(); - }); -}); diff --git a/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.stories.tsx b/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.stories.tsx index 98efedfabc..e5c67ca2f5 100644 --- a/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.stories.tsx +++ b/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.stories.tsx @@ -1,4 +1,3 @@ -import { Story } from "@storybook/react"; import { mockApiError, MockOrganization, @@ -6,39 +5,38 @@ import { MockTemplateExample2, } from "testHelpers/entities"; import { getTemplatesByTag } from "utils/starterTemplates"; -import { - StarterTemplatesPageView, - StarterTemplatesPageViewProps, -} from "./StarterTemplatesPageView"; +import { StarterTemplatesPageView } from "./StarterTemplatesPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/StarterTemplatesPageView", component: StarterTemplatesPageView, }; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Default = Template.bind({}); -Default.args = { - context: { - organizationId: MockOrganization.id, - error: undefined, - starterTemplatesByTag: getTemplatesByTag([ - MockTemplateExample, - MockTemplateExample2, - ]), +export const Default: Story = { + args: { + context: { + organizationId: MockOrganization.id, + error: undefined, + starterTemplatesByTag: getTemplatesByTag([ + MockTemplateExample, + MockTemplateExample2, + ]), + }, }, }; -export const Error = Template.bind({}); -Error.args = { - context: { - organizationId: MockOrganization.id, - error: mockApiError({ - message: "Error on loading the template examples", - }), - starterTemplatesByTag: undefined, +export const Error: Story = { + args: { + context: { + organizationId: MockOrganization.id, + error: mockApiError({ + message: "Error on loading the template examples", + }), + starterTemplatesByTag: undefined, + }, }, }; diff --git a/site/src/pages/TemplatePage/TemplateDocsPage/TemplateDocsPage.test.tsx b/site/src/pages/TemplatePage/TemplateDocsPage/TemplateDocsPage.test.tsx deleted file mode 100644 index 4e50feac94..0000000000 --- a/site/src/pages/TemplatePage/TemplateDocsPage/TemplateDocsPage.test.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import { screen } from "@testing-library/react"; -import { TemplateLayout } from "components/TemplateLayout/TemplateLayout"; -import { ResizeObserver } from "resize-observer"; -import { renderWithAuth } from "testHelpers/renderHelpers"; -import TemplateDocsPage from "./TemplateDocsPage"; - -jest.mock("remark-gfm", () => jest.fn()); - -const TEMPLATE_NAME = "coder-ts"; - -Object.defineProperty(window, "ResizeObserver", { - value: ResizeObserver, -}); - -const renderPage = () => - renderWithAuth( - - - , - { - route: `/templates/${TEMPLATE_NAME}/docs`, - path: "/templates/:template/docs", - }, - ); - -describe("TemplateSummaryPage", () => { - it("shows the template readme", async () => { - renderPage(); - await screen.findByTestId("markdown"); - }); -}); diff --git a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.stories.tsx b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.stories.tsx index cba94c3107..45ef93e351 100644 --- a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.stories.tsx +++ b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.stories.tsx @@ -1,57 +1,61 @@ -import { Story } from "@storybook/react"; import { MockTemplate, MockTemplateVersion } from "testHelpers/entities"; -import { TemplateStats, TemplateStatsProps } from "./TemplateStats"; +import { TemplateStats } from "./TemplateStats"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "components/TemplateStats", component: TemplateStats, }; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = { - template: MockTemplate, - activeVersion: MockTemplateVersion, -}; - -export const UsedByMany = Template.bind({}); -UsedByMany.args = { - template: { - ...MockTemplate, - active_user_count: 15, - }, - activeVersion: MockTemplateVersion, -}; - -export const ActiveUsersNotLoaded = Template.bind({}); -ActiveUsersNotLoaded.args = { - template: { - ...MockTemplate, - active_user_count: -1, - }, - activeVersion: MockTemplateVersion, -}; - -export const LongTemplateVersion = Template.bind({}); -LongTemplateVersion.args = { - template: MockTemplate, - activeVersion: { - ...MockTemplateVersion, - name: "thisisareallyreallylongnamefortesting", +export const Example: Story = { + args: { + template: MockTemplate, + activeVersion: MockTemplateVersion, }, }; -LongTemplateVersion.parameters = { - chromatic: { viewports: [960] }, + +export const UsedByMany: Story = { + args: { + template: { + ...MockTemplate, + active_user_count: 15, + }, + activeVersion: MockTemplateVersion, + }, }; -export const SmallViewport = Template.bind({}); -SmallViewport.args = { - template: MockTemplate, - activeVersion: MockTemplateVersion, +export const ActiveUsersNotLoaded: Story = { + args: { + template: { + ...MockTemplate, + active_user_count: -1, + }, + activeVersion: MockTemplateVersion, + }, }; -SmallViewport.parameters = { - chromatic: { viewports: [600] }, + +export const LongTemplateVersion: Story = { + args: { + template: MockTemplate, + activeVersion: { + ...MockTemplateVersion, + name: "thisisareallyreallylongnamefortesting", + }, + }, + parameters: { + chromatic: { viewports: [960] }, + }, +}; + +export const SmallViewport: Story = { + args: { + template: MockTemplate, + activeVersion: MockTemplateVersion, + }, + parameters: { + chromatic: { viewports: [600] }, + }, }; diff --git a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPage.test.tsx b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPage.test.tsx deleted file mode 100644 index 4ae508eda7..0000000000 --- a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPage.test.tsx +++ /dev/null @@ -1,53 +0,0 @@ -import { screen } from "@testing-library/react"; -import { TemplateLayout } from "components/TemplateLayout/TemplateLayout"; -import { rest } from "msw"; -import { ResizeObserver } from "resize-observer"; -import { - MockTemplate, - MockTemplateVersion, - MockMemberPermissions, -} from "testHelpers/entities"; -import { renderWithAuth } from "testHelpers/renderHelpers"; -import { server } from "testHelpers/server"; -import * as CreateDayString from "utils/createDayString"; -import { TemplateSummaryPage } from "./TemplateSummaryPage"; - -jest.mock("remark-gfm", () => jest.fn()); - -Object.defineProperty(window, "ResizeObserver", { - value: ResizeObserver, -}); - -const renderPage = () => - renderWithAuth( - - - , - { - route: `/templates/${MockTemplate.id}`, - path: "/templates/:template", - }, - ); - -describe("TemplateSummaryPage", () => { - it("shows the template name and resources", async () => { - // Mocking the dayjs module within the createDayString file - const mock = jest.spyOn(CreateDayString, "createDayString"); - mock.mockImplementation(() => "a minute ago"); - - renderPage(); - await screen.findByText(MockTemplate.display_name); - screen.queryAllByText(`${MockTemplateVersion.name}`).length; - }); - it("does not allow a member to delete a template", () => { - // get member-level permissions - server.use( - rest.post("/api/v2/authcheck", async (req, res, ctx) => { - return res(ctx.status(200), ctx.json(MockMemberPermissions)); - }), - ); - renderPage(); - const dropdownButton = screen.queryByLabelText("open-dropdown"); - expect(dropdownButton).toBe(null); - }); -}); diff --git a/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.stories.tsx b/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.stories.tsx index 348d4ec8e0..2d55b2f006 100644 --- a/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.stories.tsx +++ b/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.stories.tsx @@ -1,48 +1,50 @@ import { action } from "@storybook/addon-actions"; -import { ComponentMeta, Story } from "@storybook/react"; import { MockTemplateVersion } from "testHelpers/entities"; -import { VersionsTable, VersionsTableProps } from "./VersionsTable"; +import { VersionsTable } from "./VersionsTable"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "components/VersionsTable", component: VersionsTable, -} as ComponentMeta; - -const Template: Story = (args) => ( - -); - -export const Example = Template.bind({}); -Example.args = { - activeVersionId: MockTemplateVersion.id, - versions: [ - { - ...MockTemplateVersion, - id: "2", - name: "test-template-version-2", - created_at: "2022-05-18T18:39:01.382927298Z", - }, - MockTemplateVersion, - ], - onPromoteClick: undefined, }; -export const CanPromote = Template.bind({}); -CanPromote.args = { - activeVersionId: MockTemplateVersion.id, - onPromoteClick: action("onPromoteClick"), - versions: [ - { - ...MockTemplateVersion, - id: "2", - name: "test-template-version-2", - created_at: "2022-05-18T18:39:01.382927298Z", - }, - MockTemplateVersion, - ], +export default meta; +type Story = StoryObj; + +export const Example: Story = { + args: { + activeVersionId: MockTemplateVersion.id, + versions: [ + { + ...MockTemplateVersion, + id: "2", + name: "test-template-version-2", + created_at: "2022-05-18T18:39:01.382927298Z", + }, + MockTemplateVersion, + ], + onPromoteClick: undefined, + }, }; -export const Empty = Template.bind({}); -Empty.args = { - versions: [], +export const CanPromote: Story = { + args: { + activeVersionId: MockTemplateVersion.id, + onPromoteClick: action("onPromoteClick"), + versions: [ + { + ...MockTemplateVersion, + id: "2", + name: "test-template-version-2", + created_at: "2022-05-18T18:39:01.382927298Z", + }, + MockTemplateVersion, + ], + }, +}; + +export const Empty: Story = { + args: { + versions: [], + }, }; diff --git a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPageView.stories.tsx b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPageView.stories.tsx index 676eb7201e..c15d2fae6b 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPageView.stories.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPageView.stories.tsx @@ -1,40 +1,33 @@ -import { action } from "@storybook/addon-actions"; -import { Story } from "@storybook/react"; import { mockApiError, MockTemplate } from "testHelpers/entities"; -import { - TemplateSettingsPageView, - TemplateSettingsPageViewProps, -} from "./TemplateSettingsPageView"; +import { TemplateSettingsPageView } from "./TemplateSettingsPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/TemplateSettingsPageView", component: TemplateSettingsPageView, args: { template: MockTemplate, - onSubmit: action("onSubmit"), - onCancel: action("cancel"), }, }; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = {}; +export const Example: Story = {}; -export const SaveTemplateSettingsError = Template.bind({}); -SaveTemplateSettingsError.args = { - submitError: mockApiError({ - message: 'Template "test" already exists.', - validations: [ - { - field: "name", - detail: "This value is already in use and should be unique.", - }, - ], - }), - initialTouched: { - allow_user_cancel_workspace_jobs: true, +export const SaveTemplateSettingsError: Story = { + args: { + submitError: mockApiError({ + message: 'Template "test" already exists.', + validations: [ + { + field: "name", + detail: "This value is already in use and should be unique.", + }, + ], + }), + initialTouched: { + allow_user_cancel_workspace_jobs: true, + }, }, }; diff --git a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.stories.tsx b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.stories.tsx index 643c09ae1f..183e844729 100644 --- a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.stories.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.stories.tsx @@ -1,38 +1,37 @@ -import { Story } from "@storybook/react"; import { MockOrganization, MockTemplateACL, MockTemplateACLEmpty, } from "testHelpers/entities"; -import { - TemplatePermissionsPageView, - TemplatePermissionsPageViewProps, -} from "./TemplatePermissionsPageView"; +import { TemplatePermissionsPageView } from "./TemplatePermissionsPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/TemplatePermissionsPageView", component: TemplatePermissionsPageView, }; -const Template: Story = ( - args: TemplatePermissionsPageViewProps, -) => ; +export default meta; +type Story = StoryObj; -export const Empty = Template.bind({}); -Empty.args = { - templateACL: MockTemplateACLEmpty, - canUpdatePermissions: false, +export const Empty: Story = { + args: { + templateACL: MockTemplateACLEmpty, + canUpdatePermissions: false, + }, }; -export const WithTemplateACL = Template.bind({}); -WithTemplateACL.args = { - templateACL: MockTemplateACL, - canUpdatePermissions: false, +export const WithTemplateACL: Story = { + args: { + templateACL: MockTemplateACL, + canUpdatePermissions: false, + }, }; -export const WithUpdatePermissions = Template.bind({}); -WithUpdatePermissions.args = { - templateACL: MockTemplateACL, - canUpdatePermissions: true, - organizationId: MockOrganization.id, +export const WithUpdatePermissions: Story = { + args: { + templateACL: MockTemplateACL, + canUpdatePermissions: true, + organizationId: MockOrganization.id, + }, }; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/AutostopRequirementHelperText.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/AutostopRequirementHelperText.tsx similarity index 100% rename from site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/AutostopRequirementHelperText.tsx rename to site/src/pages/TemplateSettingsPage/TemplateSchedulePage/AutostopRequirementHelperText.tsx diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/TTLHelperText.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TTLHelperText.tsx similarity index 100% rename from site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/TTLHelperText.tsx rename to site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TTLHelperText.tsx diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/TemplateScheduleForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx similarity index 100% rename from site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/TemplateScheduleForm.tsx rename to site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.test.tsx index c5be20870d..3148ab272b 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.test.tsx @@ -10,10 +10,7 @@ import { renderWithTemplateSettingsLayout, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; -import { - TemplateScheduleFormValues, - getValidationSchema, -} from "./TemplateScheduleForm/formHelpers"; +import { TemplateScheduleFormValues, getValidationSchema } from "./formHelpers"; import TemplateSchedulePage from "./TemplateSchedulePage"; import i18next from "i18next"; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.tsx index 1ad43692ae..bf29c42c3f 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.tsx @@ -1,6 +1,6 @@ import { Template, UpdateTemplateMeta } from "api/typesGenerated"; import { ComponentProps, FC } from "react"; -import { TemplateScheduleForm } from "./TemplateScheduleForm/TemplateScheduleForm"; +import { TemplateScheduleForm } from "./TemplateScheduleForm"; import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { makeStyles } from "@mui/styles"; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/formHelpers.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/formHelpers.tsx similarity index 100% rename from site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/formHelpers.tsx rename to site/src/pages/TemplateSettingsPage/TemplateSchedulePage/formHelpers.tsx diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/useWorkspacesToBeDeleted.ts b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/useWorkspacesToBeDeleted.ts similarity index 100% rename from site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/useWorkspacesToBeDeleted.ts rename to site/src/pages/TemplateSettingsPage/TemplateSchedulePage/useWorkspacesToBeDeleted.ts diff --git a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx index f5ef6724a0..dfd0baf83e 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx @@ -1,5 +1,3 @@ -import { action } from "@storybook/addon-actions"; -import { Story } from "@storybook/react"; import { mockApiError, MockTemplateVersion, @@ -9,87 +7,77 @@ import { MockTemplateVersionVariable4, MockTemplateVersionVariable5, } from "testHelpers/entities"; -import { - TemplateVariablesPageView, - TemplateVariablesPageViewProps, -} from "./TemplateVariablesPageView"; +import { TemplateVariablesPageView } from "./TemplateVariablesPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/TemplateVariablesPageView", component: TemplateVariablesPageView, }; -const TemplateVariables: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Loading = TemplateVariables.bind({}); -Loading.args = { - onSubmit: action("onSubmit"), - onCancel: action("cancel"), -}; +export const Loading: Story = {}; -export const Basic = TemplateVariables.bind({}); -Basic.args = { - templateVersion: MockTemplateVersion, - templateVariables: [ - MockTemplateVersionVariable1, - MockTemplateVersionVariable2, - MockTemplateVersionVariable3, - MockTemplateVersionVariable4, - ], - onSubmit: action("onSubmit"), - onCancel: action("cancel"), +export const Basic: Story = { + args: { + templateVersion: MockTemplateVersion, + templateVariables: [ + MockTemplateVersionVariable1, + MockTemplateVersionVariable2, + MockTemplateVersionVariable3, + MockTemplateVersionVariable4, + ], + }, }; // This example isn't fully supported. As "user_variable_values" is an array, // FormikTouched can't properly handle this. // See: https://github.com/jaredpalmer/formik/issues/2022 -export const RequiredVariable = TemplateVariables.bind({}); -RequiredVariable.args = { - templateVersion: MockTemplateVersion, - templateVariables: [ - MockTemplateVersionVariable4, - MockTemplateVersionVariable5, - ], - onSubmit: action("onSubmit"), - onCancel: action("cancel"), - initialTouched: { - user_variable_values: true, +export const RequiredVariable: Story = { + args: { + templateVersion: MockTemplateVersion, + templateVariables: [ + MockTemplateVersionVariable4, + MockTemplateVersionVariable5, + ], + + initialTouched: { + user_variable_values: true, + }, }, }; -export const WithUpdateTemplateError = TemplateVariables.bind({}); -WithUpdateTemplateError.args = { - templateVersion: MockTemplateVersion, - templateVariables: [ - MockTemplateVersionVariable1, - MockTemplateVersionVariable2, - MockTemplateVersionVariable3, - MockTemplateVersionVariable4, - ], - errors: { - updateTemplateError: mockApiError({ - message: "Something went wrong.", - }), +export const WithUpdateTemplateError: Story = { + args: { + templateVersion: MockTemplateVersion, + templateVariables: [ + MockTemplateVersionVariable1, + MockTemplateVersionVariable2, + MockTemplateVersionVariable3, + MockTemplateVersionVariable4, + ], + errors: { + updateTemplateError: mockApiError({ + message: "Something went wrong.", + }), + }, }, - onSubmit: action("onSubmit"), - onCancel: action("cancel"), }; -export const WithJobError = TemplateVariables.bind({}); -WithJobError.args = { - templateVersion: MockTemplateVersion, - templateVariables: [ - MockTemplateVersionVariable1, - MockTemplateVersionVariable2, - MockTemplateVersionVariable3, - MockTemplateVersionVariable4, - ], - errors: { - jobError: - "template import provision for start: recv import provision: plan terraform: terraform plan: exit status 1", +export const WithJobError: Story = { + args: { + templateVersion: MockTemplateVersion, + templateVariables: [ + MockTemplateVersionVariable1, + MockTemplateVersionVariable2, + MockTemplateVersionVariable3, + MockTemplateVersionVariable4, + ], + errors: { + jobError: + "template import provision for start: recv import provision: plan terraform: terraform plan: exit status 1", + }, }, - onSubmit: action("onSubmit"), - onCancel: action("cancel"), }; diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/FileDialog.tsx b/site/src/pages/TemplateVersionEditorPage/FileDialog.tsx similarity index 100% rename from site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/FileDialog.tsx rename to site/src/pages/TemplateVersionEditorPage/FileDialog.tsx diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/FileTreeView.tsx b/site/src/pages/TemplateVersionEditorPage/FileTreeView.tsx similarity index 100% rename from site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/FileTreeView.tsx rename to site/src/pages/TemplateVersionEditorPage/FileTreeView.tsx diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/MissingTemplateVariablesDialog.tsx b/site/src/pages/TemplateVersionEditorPage/MissingTemplateVariablesDialog.tsx similarity index 100% rename from site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/MissingTemplateVariablesDialog.tsx rename to site/src/pages/TemplateVersionEditorPage/MissingTemplateVariablesDialog.tsx diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/MonacoEditor.tsx b/site/src/pages/TemplateVersionEditorPage/MonacoEditor.tsx similarity index 100% rename from site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/MonacoEditor.tsx rename to site/src/pages/TemplateVersionEditorPage/MonacoEditor.tsx diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/PublishTemplateVersionDialog.tsx b/site/src/pages/TemplateVersionEditorPage/PublishTemplateVersionDialog.tsx similarity index 100% rename from site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/PublishTemplateVersionDialog.tsx rename to site/src/pages/TemplateVersionEditorPage/PublishTemplateVersionDialog.tsx diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/TemplateVersionEditor.stories.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.stories.tsx similarity index 100% rename from site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/TemplateVersionEditor.stories.tsx rename to site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.stories.tsx diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/TemplateVersionEditor.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx similarity index 100% rename from site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/TemplateVersionEditor.tsx rename to site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.test.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.test.tsx index 62d5a6a2ff..5eccbcdc75 100644 --- a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.test.tsx +++ b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.test.tsx @@ -7,7 +7,7 @@ import { MockTemplateVersion, MockWorkspaceBuildLogs, } from "testHelpers/entities"; -import { Language } from "./TemplateVersionEditor/PublishTemplateVersionDialog"; +import { Language } from "./PublishTemplateVersionDialog"; // For some reason this component in Jest is throwing a MUI style warning so, // since we don't need it for this test, we can mock it out diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.tsx index 29a0944cd4..6065f61bdb 100644 --- a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.tsx +++ b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.tsx @@ -1,5 +1,5 @@ import { useMachine } from "@xstate/react"; -import { TemplateVersionEditor } from "pages/TemplateVersionEditorPage/TemplateVersionEditor/TemplateVersionEditor"; +import { TemplateVersionEditor } from "./TemplateVersionEditor"; import { useOrganizationId } from "hooks/useOrganizationId"; import { usePermissions } from "hooks/usePermissions"; import { FC } from "react"; diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/TemplateVersionStatusBadge.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionStatusBadge.tsx similarity index 100% rename from site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor/TemplateVersionStatusBadge.tsx rename to site/src/pages/TemplateVersionEditorPage/TemplateVersionStatusBadge.tsx diff --git a/site/src/pages/TemplateVersionPage/TemplateVersionPageView.stories.tsx b/site/src/pages/TemplateVersionPage/TemplateVersionPageView.stories.tsx index 95893f803b..4c945bc3f3 100644 --- a/site/src/pages/TemplateVersionPage/TemplateVersionPageView.stories.tsx +++ b/site/src/pages/TemplateVersionPage/TemplateVersionPageView.stories.tsx @@ -1,5 +1,4 @@ import { action } from "@storybook/addon-actions"; -import { Story } from "@storybook/react"; import { UseTabResult } from "hooks/useTab"; import { mockApiError, @@ -11,15 +10,7 @@ import { TemplateVersionPageView, TemplateVersionPageViewProps, } from "./TemplateVersionPageView"; - -export default { - title: "pages/TemplateVersionPageView", - component: TemplateVersionPageView, -}; - -const Template: Story = (args) => ( - -); +import type { Meta, StoryObj } from "@storybook/react"; const tab: UseTabResult = { value: "0", @@ -53,18 +44,26 @@ const defaultArgs: TemplateVersionPageViewProps = { }, }; -export const Default = Template.bind({}); -Default.args = defaultArgs; +const meta: Meta = { + title: "pages/TemplateVersionPageView", + component: TemplateVersionPageView, + args: defaultArgs, +}; -export const Error = Template.bind({}); -Error.args = { - ...defaultArgs, - context: { - ...defaultArgs.context, - currentVersion: undefined, - currentFiles: undefined, - error: mockApiError({ - message: "Error on loading the template version", - }), +export default meta; +type Story = StoryObj; + +export const Default: Story = {}; + +export const Error: Story = { + args: { + context: { + ...defaultArgs.context, + currentVersion: undefined, + currentFiles: undefined, + error: mockApiError({ + message: "Error on loading the template version", + }), + }, }, }; diff --git a/site/src/pages/TemplatesPage/TemplatesPage.test.tsx b/site/src/pages/TemplatesPage/TemplatesPage.test.tsx deleted file mode 100644 index 2efd6259ab..0000000000 --- a/site/src/pages/TemplatesPage/TemplatesPage.test.tsx +++ /dev/null @@ -1,91 +0,0 @@ -import { screen } from "@testing-library/react"; -import { rest } from "msw"; -import * as CreateDayString from "utils/createDayString"; -import { MockTemplate } from "../../testHelpers/entities"; -import { renderWithAuth } from "../../testHelpers/renderHelpers"; -import { server } from "../../testHelpers/server"; -import { TemplatesPage } from "./TemplatesPage"; -import i18next from "i18next"; - -const { t } = i18next; - -describe("TemplatesPage", () => { - beforeEach(() => { - // Mocking the dayjs module within the createDayString file - const mock = jest.spyOn(CreateDayString, "createDayString"); - mock.mockImplementation(() => "a minute ago"); - }); - - it("renders an empty templates page", async () => { - // Given - server.use( - rest.get( - "/api/v2/organizations/:organizationId/templates", - (req, res, ctx) => { - return res(ctx.status(200), ctx.json([])); - }, - ), - rest.post("/api/v2/authcheck", (req, res, ctx) => { - return res( - ctx.status(200), - ctx.json({ - createTemplates: true, - }), - ); - }), - ); - - // When - renderWithAuth(, { - route: `/templates`, - path: "/templates", - }); - - // Then - const emptyMessage = t("empty.message", { - ns: "templatesPage", - }); - await screen.findByText(emptyMessage); - }); - - it("renders a filled templates page", async () => { - // When - renderWithAuth(, { - route: `/templates`, - path: "/templates", - }); - - // Then - await screen.findByText(MockTemplate.display_name); - }); - - it("shows empty view without permissions to create", async () => { - server.use( - rest.get( - "/api/v2/organizations/:organizationId/templates", - (req, res, ctx) => { - return res(ctx.status(200), ctx.json([])); - }, - ), - rest.post("/api/v2/authcheck", (req, res, ctx) => { - return res( - ctx.status(200), - ctx.json({ - createTemplates: false, - }), - ); - }), - ); - - // When - renderWithAuth(, { - route: `/templates`, - path: "/templates", - }); - // Then - const emptyMessage = t("empty.descriptionWithoutPermissions", { - ns: "templatesPage", - }); - await screen.findByText(emptyMessage); - }); -}); diff --git a/site/src/pages/TemplatesPage/TemplatesPageView.stories.tsx b/site/src/pages/TemplatesPage/TemplatesPageView.stories.tsx index 9697c72387..a54a43497b 100644 --- a/site/src/pages/TemplatesPage/TemplatesPageView.stories.tsx +++ b/site/src/pages/TemplatesPage/TemplatesPageView.stories.tsx @@ -1,4 +1,3 @@ -import { ComponentMeta, Story } from "@storybook/react"; import { mockApiError, MockOrganization, @@ -7,92 +6,97 @@ import { MockTemplateExample, MockTemplateExample2, } from "../../testHelpers/entities"; -import { TemplatesPageView, TemplatesPageViewProps } from "./TemplatesPageView"; +import { TemplatesPageView } from "./TemplatesPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "pages/TemplatesPageView", component: TemplatesPageView, -} as ComponentMeta; - -const Template: Story = (args) => ( - -); - -export const WithTemplates = Template.bind({}); -WithTemplates.args = { - context: { - organizationId: MockOrganization.id, - permissions: MockPermissions, - error: undefined, - templates: [ - MockTemplate, - { - ...MockTemplate, - active_user_count: -1, - description: "🚀 Some new template that has no activity data", - icon: "/icon/goland.svg", - }, - { - ...MockTemplate, - active_user_count: 150, - description: "😮 Wow, this one has a bunch of usage!", - icon: "", - }, - { - ...MockTemplate, - description: - "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. ", - }, - ], - examples: [], - }, }; -export const WithTemplatesSmallViewPort = Template.bind({}); -WithTemplatesSmallViewPort.args = { - ...WithTemplates.args, -}; -WithTemplatesSmallViewPort.parameters = { - chromatic: { viewports: [600] }, -}; +export default meta; +type Story = StoryObj; -export const EmptyCanCreate = Template.bind({}); -EmptyCanCreate.args = { - context: { - organizationId: MockOrganization.id, - permissions: MockPermissions, - error: undefined, - templates: [], - examples: [MockTemplateExample, MockTemplateExample2], - }, -}; - -export const EmptyCannotCreate = Template.bind({}); -EmptyCannotCreate.args = { - context: { - organizationId: MockOrganization.id, - permissions: { - ...MockPermissions, - createTemplates: false, +export const WithTemplates: Story = { + args: { + context: { + organizationId: MockOrganization.id, + permissions: MockPermissions, + error: undefined, + templates: [ + MockTemplate, + { + ...MockTemplate, + active_user_count: -1, + description: "🚀 Some new template that has no activity data", + icon: "/icon/goland.svg", + }, + { + ...MockTemplate, + active_user_count: 150, + description: "😮 Wow, this one has a bunch of usage!", + icon: "", + }, + { + ...MockTemplate, + description: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. ", + }, + ], + examples: [], }, - error: undefined, - templates: [], - examples: [MockTemplateExample, MockTemplateExample2], }, }; -export const Error = Template.bind({}); -Error.args = { - context: { - organizationId: MockOrganization.id, - permissions: { - ...MockPermissions, - createTemplates: false, +export const WithTemplatesSmallViewPort: Story = { + args: { + ...WithTemplates.args, + }, + parameters: { + chromatic: { viewports: [600] }, + }, +}; + +export const EmptyCanCreate: Story = { + args: { + context: { + organizationId: MockOrganization.id, + permissions: MockPermissions, + error: undefined, + templates: [], + examples: [MockTemplateExample, MockTemplateExample2], }, - error: mockApiError({ - message: "Something went wrong fetching templates.", - }), - templates: undefined, - examples: undefined, + }, +}; + +export const EmptyCannotCreate: Story = { + args: { + context: { + organizationId: MockOrganization.id, + permissions: { + ...MockPermissions, + createTemplates: false, + }, + error: undefined, + templates: [], + examples: [MockTemplateExample, MockTemplateExample2], + }, + }, +}; + +export const Error: Story = { + args: { + context: { + organizationId: MockOrganization.id, + permissions: { + ...MockPermissions, + createTemplates: false, + }, + error: mockApiError({ + message: "Something went wrong fetching templates.", + }), + templates: undefined, + examples: undefined, + }, }, }; diff --git a/site/src/pages/UserSettingsPage/AccountPage/AccountForm.stories.tsx b/site/src/pages/UserSettingsPage/AccountPage/AccountForm.stories.tsx index a056aa1d8f..ede81278f6 100644 --- a/site/src/pages/UserSettingsPage/AccountPage/AccountForm.stories.tsx +++ b/site/src/pages/UserSettingsPage/AccountPage/AccountForm.stories.tsx @@ -1,51 +1,43 @@ -import { Story } from "@storybook/react"; -import { AccountForm, AccountFormProps } from "./AccountForm"; +import type { Meta, StoryObj } from "@storybook/react"; +import { AccountForm } from "./AccountForm"; import { mockApiError } from "testHelpers/entities"; -export default { +const meta: Meta = { title: "components/AccountForm", component: AccountForm, - argTypes: { - onSubmit: { action: "Submit" }, + args: { + email: "test-user@org.com", + isLoading: false, + initialValues: { + username: "test-user", + }, + updateProfileError: undefined, }, }; -const Template: Story = (args: AccountFormProps) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = { - email: "test-user@org.com", - isLoading: false, - initialValues: { - username: "test-user", - }, - updateProfileError: undefined, - onSubmit: () => { - return Promise.resolve(); +export const Example: Story = {}; + +export const Loading: Story = { + args: { + isLoading: true, }, }; - -export const Loading = Template.bind({}); -Loading.args = { - ...Example.args, - isLoading: true, -}; - -export const WithError = Template.bind({}); -WithError.args = { - ...Example.args, - updateProfileError: mockApiError({ - message: "Username is invalid", - validations: [ - { - field: "username", - detail: "Username is too long.", - }, - ], - }), - initialTouched: { - username: true, +export const WithError: Story = { + args: { + updateProfileError: mockApiError({ + message: "Username is invalid", + validations: [ + { + field: "username", + detail: "Username is too long.", + }, + ], + }), + initialTouched: { + username: true, + }, }, }; diff --git a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.stories.tsx b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.stories.tsx index 469d0f3492..e66cdef869 100644 --- a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.stories.tsx +++ b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.stories.tsx @@ -1,53 +1,46 @@ -import { Story } from "@storybook/react"; import { mockApiError } from "testHelpers/entities"; -import { SSHKeysPageView, SSHKeysPageViewProps } from "./SSHKeysPageView"; +import { SSHKeysPageView } from "./SSHKeysPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { - title: "components/SSHKeysPageView", +const meta: Meta = { + title: "pages/SSHKeysPageView", component: SSHKeysPageView, - argTypes: { - onRegenerateClick: { action: "Submit" }, + args: { + isLoading: false, + hasLoaded: true, + sshKey: { + user_id: "test-user-id", + created_at: "2022-07-28T07:45:50.795918897Z", + updated_at: "2022-07-28T07:45:50.795919142Z", + public_key: "SSH-Key", + }, }, }; -const Template: Story = (args: SSHKeysPageViewProps) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = { - isLoading: false, - hasLoaded: true, - sshKey: { - user_id: "test-user-id", - created_at: "2022-07-28T07:45:50.795918897Z", - updated_at: "2022-07-28T07:45:50.795919142Z", - public_key: "SSH-Key", - }, - onRegenerateClick: () => { - return Promise.resolve(); +export const Example: Story = {}; + +export const Loading: Story = { + args: { + isLoading: true, }, }; -export const Loading = Template.bind({}); -Loading.args = { - ...Example.args, - isLoading: true, +export const WithGetSSHKeyError: Story = { + args: { + hasLoaded: false, + getSSHKeyError: mockApiError({ + message: "Failed to get SSH key", + }), + }, }; -export const WithGetSSHKeyError = Template.bind({}); -WithGetSSHKeyError.args = { - ...Example.args, - hasLoaded: false, - getSSHKeyError: mockApiError({ - message: "Failed to get SSH key", - }), -}; - -export const WithRegenerateSSHKeyError = Template.bind({}); -WithRegenerateSSHKeyError.args = { - ...Example.args, - regenerateSSHKeyError: mockApiError({ - message: "Failed to regenerate SSH key", - }), +export const WithRegenerateSSHKeyError: Story = { + args: { + regenerateSSHKeyError: mockApiError({ + message: "Failed to regenerate SSH key", + }), + }, }; diff --git a/site/src/pages/UserSettingsPage/SecurityPage/SettingsSecurityForm.stories.tsx b/site/src/pages/UserSettingsPage/SecurityPage/SettingsSecurityForm.stories.tsx index a53d0c205c..53d70860ca 100644 --- a/site/src/pages/UserSettingsPage/SecurityPage/SettingsSecurityForm.stories.tsx +++ b/site/src/pages/UserSettingsPage/SecurityPage/SettingsSecurityForm.stories.tsx @@ -1,43 +1,40 @@ -import { Story } from "@storybook/react"; -import { SecurityForm, SecurityFormProps } from "./SettingsSecurityForm"; +import type { Meta, StoryObj } from "@storybook/react"; +import { SecurityForm } from "./SettingsSecurityForm"; import { mockApiError } from "testHelpers/entities"; -export default { - title: "components/SettingsSecurityForm", +const meta: Meta = { + title: "components/SecurityForm", component: SecurityForm, - argTypes: { - onSubmit: { action: "Submit" }, + args: { + isLoading: false, }, }; -const Template: Story = (args: SecurityFormProps) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = { - isLoading: false, - onSubmit: () => { - return Promise.resolve(); +export const Example: Story = { + args: { + isLoading: false, }, }; -export const Loading = Template.bind({}); -Loading.args = { - ...Example.args, - isLoading: true, +export const Loading: Story = { + args: { + isLoading: true, + }, }; -export const WithError = Template.bind({}); -WithError.args = { - ...Example.args, - error: mockApiError({ - message: "Old password is incorrect", - validations: [ - { - field: "old_password", - detail: "Old password is incorrect.", - }, - ], - }), +export const WithError: Story = { + args: { + error: mockApiError({ + message: "Old password is incorrect", + validations: [ + { + field: "old_password", + detail: "Old password is incorrect.", + }, + ], + }), + }, }; diff --git a/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.stories.tsx b/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.stories.tsx index b38e4deee1..01f4092c16 100644 --- a/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.stories.tsx +++ b/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.stories.tsx @@ -1,9 +1,6 @@ -import { Story } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { MockToken } from "testHelpers/entities"; -import { - ConfirmDeleteDialog, - ConfirmDeleteDialogProps, -} from "./ConfirmDeleteDialog"; +import { ConfirmDeleteDialog } from "./ConfirmDeleteDialog"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; const queryClient = new QueryClient({ @@ -16,24 +13,27 @@ const queryClient = new QueryClient({ }, }); -export default { +const meta: Meta = { title: "components/ConfirmDeleteDialog", component: ConfirmDeleteDialog, + decorators: [ + (Story) => ( + + + + ), + ], }; -const Template: Story = ( - args: ConfirmDeleteDialogProps, -) => ( - - - -); +export default meta; +type Story = StoryObj; -export const DeleteDialog = Template.bind({}); -DeleteDialog.args = { - queryKey: ["tokens"], - token: MockToken, - setToken: () => { - return null; +export const DeleteDialog: Story = { + args: { + queryKey: ["tokens"], + token: MockToken, + setToken: () => { + return null; + }, }, }; diff --git a/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.stories.tsx b/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.stories.tsx index 5fed9d2864..c3fe79abb1 100644 --- a/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.stories.tsx +++ b/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.stories.tsx @@ -1,56 +1,52 @@ -import { Story } from "@storybook/react"; import { mockApiError, MockTokens } from "testHelpers/entities"; -import { TokensPageView, TokensPageViewProps } from "./TokensPageView"; +import { TokensPageView } from "./TokensPageView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { - title: "components/TokensPageView", +const meta: Meta = { + title: "pages/TokensPageView", component: TokensPageView, args: { - onRegenerateClick: { action: "Submit" }, + isLoading: false, + hasLoaded: true, + tokens: MockTokens, + onDelete: () => { + return Promise.resolve(); + }, }, }; -const Template: Story = (args: TokensPageViewProps) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = { - isLoading: false, - hasLoaded: true, - tokens: MockTokens, - onDelete: () => { - return Promise.resolve(); +export const Example: Story = {}; + +export const Loading: Story = { + args: { + isLoading: true, + hasLoaded: false, }, }; -export const Loading = Template.bind({}); -Loading.args = { - ...Example.args, - isLoading: true, - hasLoaded: false, +export const Empty: Story = { + args: { + tokens: [], + }, }; -export const Empty = Template.bind({}); -Empty.args = { - ...Example.args, - tokens: [], +export const WithGetTokensError: Story = { + args: { + hasLoaded: false, + getTokensError: mockApiError({ + message: "Failed to get tokens.", + }), + }, }; -export const WithGetTokensError = Template.bind({}); -WithGetTokensError.args = { - ...Example.args, - hasLoaded: false, - getTokensError: mockApiError({ - message: "Failed to get tokens.", - }), -}; - -export const WithDeleteTokenError = Template.bind({}); -WithDeleteTokenError.args = { - ...Example.args, - hasLoaded: false, - deleteTokenError: mockApiError({ - message: "Failed to delete token.", - }), +export const WithDeleteTokenError: Story = { + args: { + hasLoaded: false, + deleteTokenError: mockApiError({ + message: "Failed to delete token.", + }), + }, }; diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorspaceProxyView.stories.tsx b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorspaceProxyView.stories.tsx index 4e6d09e606..3b758b2d03 100644 --- a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorspaceProxyView.stories.tsx +++ b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorspaceProxyView.stories.tsx @@ -1,4 +1,3 @@ -import { Story } from "@storybook/react"; import { mockApiError, MockWorkspaceProxies, @@ -6,68 +5,68 @@ import { MockHealthyWildWorkspaceProxy, MockProxyLatencies, } from "testHelpers/entities"; -import { - WorkspaceProxyView, - WorkspaceProxyViewProps, -} from "./WorkspaceProxyView"; +import { WorkspaceProxyView } from "./WorkspaceProxyView"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "components/WorkspaceProxyView", component: WorkspaceProxyView, +}; + +export default meta; +type Story = StoryObj; + +export const PrimarySelected: Story = { args: { - onRegenerateClick: { action: "Submit" }, + isLoading: false, + hasLoaded: true, + proxies: MockWorkspaceProxies, + proxyLatencies: MockProxyLatencies, + preferredProxy: MockPrimaryWorkspaceProxy, }, }; -const Template: Story = ( - args: WorkspaceProxyViewProps, -) => ; - -export const PrimarySelected = Template.bind({}); -PrimarySelected.args = { - isLoading: false, - hasLoaded: true, - proxies: MockWorkspaceProxies, - proxyLatencies: MockProxyLatencies, - preferredProxy: MockPrimaryWorkspaceProxy, +export const Example: Story = { + args: { + isLoading: false, + hasLoaded: true, + proxies: MockWorkspaceProxies, + proxyLatencies: MockProxyLatencies, + preferredProxy: MockHealthyWildWorkspaceProxy, + }, }; -export const Example = Template.bind({}); -Example.args = { - isLoading: false, - hasLoaded: true, - proxies: MockWorkspaceProxies, - proxyLatencies: MockProxyLatencies, - preferredProxy: MockHealthyWildWorkspaceProxy, +export const Loading: Story = { + args: { + ...Example.args, + isLoading: true, + hasLoaded: false, + }, }; -export const Loading = Template.bind({}); -Loading.args = { - ...Example.args, - isLoading: true, - hasLoaded: false, +export const Empty: Story = { + args: { + ...Example.args, + proxies: [], + }, }; -export const Empty = Template.bind({}); -Empty.args = { - ...Example.args, - proxies: [], +export const WithProxiesError: Story = { + args: { + ...Example.args, + hasLoaded: false, + getWorkspaceProxiesError: mockApiError({ + message: "Failed to get proxies.", + }), + }, }; -export const WithProxiesError = Template.bind({}); -WithProxiesError.args = { - ...Example.args, - hasLoaded: false, - getWorkspaceProxiesError: mockApiError({ - message: "Failed to get proxies.", - }), -}; - -export const WithSelectProxyError = Template.bind({}); -WithSelectProxyError.args = { - ...Example.args, - hasLoaded: false, - selectProxyError: mockApiError({ - message: "Failed to select proxy.", - }), +export const WithSelectProxyError: Story = { + args: { + ...Example.args, + hasLoaded: false, + selectProxyError: mockApiError({ + message: "Failed to select proxy.", + }), + }, }; diff --git a/site/src/pages/UsersPage/ResetPasswordDialog.stories.tsx b/site/src/pages/UsersPage/ResetPasswordDialog.stories.tsx index 5facf41985..f07be7be3e 100644 --- a/site/src/pages/UsersPage/ResetPasswordDialog.stories.tsx +++ b/site/src/pages/UsersPage/ResetPasswordDialog.stories.tsx @@ -1,28 +1,20 @@ -import { action } from "@storybook/addon-actions"; -import { Story } from "@storybook/react"; +import { Meta, StoryObj } from "@storybook/react"; import { MockUser } from "testHelpers/entities"; -import { - ResetPasswordDialog, - ResetPasswordDialogProps, -} from "./ResetPasswordDialog"; +import { ResetPasswordDialog } from "./ResetPasswordDialog"; -export default { +const meta: Meta = { title: "components/Dialogs/ResetPasswordDialog", component: ResetPasswordDialog, - argTypes: { - onClose: { action: "onClose", defaultValue: action("onClose") }, - onConfirm: { action: "onConfirm", defaultValue: action("onConfirm") }, +}; + +export default meta; +type Story = StoryObj; + +export const Example: Story = { + args: { + open: true, + user: MockUser, + newPassword: "somerandomstringhere", }, }; - -const Template: Story = ( - args: ResetPasswordDialogProps, -) => ; - -export const Example = Template.bind({}); -Example.args = { - open: true, - user: MockUser, - newPassword: "somerandomstringhere", -}; diff --git a/site/src/pages/UsersPage/UsersPage.test.tsx b/site/src/pages/UsersPage/UsersPage.test.tsx index 68734c7d1c..382ff7f1d7 100644 --- a/site/src/pages/UsersPage/UsersPage.test.tsx +++ b/site/src/pages/UsersPage/UsersPage.test.tsx @@ -179,12 +179,6 @@ const updateUserRole = async (setupActionSpies: () => void, role: Role) => { }; describe("UsersPage", () => { - it("shows users", async () => { - renderPage(); - const users = await screen.findAllByText(/.*@coder.com/); - expect(users.length).toEqual(3); - }); - describe("suspend user", () => { describe("when it is success", () => { it("shows a success message and refresh the page", async () => { diff --git a/site/src/pages/UsersPage/UsersTable/EditRolesButton.stories.tsx b/site/src/pages/UsersPage/UsersTable/EditRolesButton.stories.tsx index 191e761000..ce4bc974cd 100644 --- a/site/src/pages/UsersPage/UsersTable/EditRolesButton.stories.tsx +++ b/site/src/pages/UsersPage/UsersTable/EditRolesButton.stories.tsx @@ -1,42 +1,41 @@ -import { ComponentMeta, Story } from "@storybook/react"; import { MockOwnerRole, MockSiteRoles, MockUserAdminRole, } from "testHelpers/entities"; -import { EditRolesButtonProps, EditRolesButton } from "./EditRolesButton"; +import { EditRolesButton } from "./EditRolesButton"; +import type { Meta, StoryObj } from "@storybook/react"; -export default { +const meta: Meta = { title: "components/EditRolesButton", component: EditRolesButton, - argTypes: { - defaultIsOpen: { - defaultValue: true, - }, + args: { + defaultIsOpen: true, }, -} as ComponentMeta; - -const Template: Story = (args) => ( - -); - -export const Open = Template.bind({}); -Open.args = { - roles: MockSiteRoles, - selectedRoles: [MockUserAdminRole, MockOwnerRole], -}; -Open.parameters = { - chromatic: { delay: 300 }, }; -export const Loading = Template.bind({}); -Loading.args = { - isLoading: true, - roles: MockSiteRoles, - selectedRoles: [MockUserAdminRole, MockOwnerRole], - userLoginType: "password", - oidcRoleSync: false, +export default meta; +type Story = StoryObj; + +export const Open: Story = { + args: { + roles: MockSiteRoles, + selectedRoles: [MockUserAdminRole, MockOwnerRole], + }, + parameters: { + chromatic: { delay: 300 }, + }, }; -Loading.parameters = { - chromatic: { delay: 300 }, + +export const Loading: Story = { + args: { + isLoading: true, + roles: MockSiteRoles, + selectedRoles: [MockUserAdminRole, MockOwnerRole], + userLoginType: "password", + oidcRoleSync: false, + }, + parameters: { + chromatic: { delay: 300 }, + }, }; diff --git a/site/src/pages/WorkspacePage/BuildsTable.stories.tsx b/site/src/pages/WorkspacePage/BuildsTable.stories.tsx index 01f81f8a9a..d454b5e9a8 100644 --- a/site/src/pages/WorkspacePage/BuildsTable.stories.tsx +++ b/site/src/pages/WorkspacePage/BuildsTable.stories.tsx @@ -1,20 +1,23 @@ -import { ComponentMeta, Story } from "@storybook/react"; +import { Meta, StoryObj } from "@storybook/react"; import { MockBuilds } from "testHelpers/entities"; -import { BuildsTable, BuildsTableProps } from "./BuildsTable"; +import { BuildsTable } from "./BuildsTable"; -export default { +const meta: Meta = { title: "components/BuildsTable", component: BuildsTable, -} as ComponentMeta; - -const Template: Story = (args) => ; - -export const Example = Template.bind({}); -Example.args = { - builds: MockBuilds, }; -export const Empty = Template.bind({}); -Empty.args = { - builds: [], +export default meta; +type Story = StoryObj; + +export const Example: Story = { + args: { + builds: MockBuilds, + }, +}; + +export const Empty: Story = { + args: { + builds: [], + }, }; diff --git a/site/src/pages/WorkspacePage/Workspace.stories.tsx b/site/src/pages/WorkspacePage/Workspace.stories.tsx index b5819e6b6d..d06e70f331 100644 --- a/site/src/pages/WorkspacePage/Workspace.stories.tsx +++ b/site/src/pages/WorkspacePage/Workspace.stories.tsx @@ -61,6 +61,7 @@ const meta: Meta = { }), ], }; + export default meta; type Story = StoryObj; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx index a7c0015dd0..133188ef21 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx @@ -1,91 +1,81 @@ -import { action } from "@storybook/addon-actions"; -import { Story } from "@storybook/react"; -import * as Mocks from "../../../testHelpers/entities"; -import { WorkspaceActions, WorkspaceActionsProps } from "./WorkspaceActions"; +import { Meta, StoryObj } from "@storybook/react"; +import * as Mocks from "testHelpers/entities"; +import { WorkspaceActions } from "./WorkspaceActions"; -export default { +const meta: Meta = { title: "components/WorkspaceActions", component: WorkspaceActions, + args: { + isUpdating: false, + }, }; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -const defaultArgs = { - handleStart: action("start"), - handleStop: action("stop"), - handleRestart: action("restart"), - handleDelete: action("delete"), - handleUpdate: action("update"), - handleCancel: action("cancel"), - isOutdated: false, - isUpdating: false, +export const Starting: Story = { + args: { + workspace: Mocks.MockStartingWorkspace, + }, }; -export const Starting = Template.bind({}); -Starting.args = { - ...defaultArgs, - workspace: Mocks.MockStartingWorkspace, +export const Running: Story = { + args: { + workspace: Mocks.MockWorkspace, + }, }; -export const Running = Template.bind({}); -Running.args = { - ...defaultArgs, - workspace: Mocks.MockWorkspace, +export const Stopping: Story = { + args: { + workspace: Mocks.MockStoppingWorkspace, + }, }; -export const Stopping = Template.bind({}); -Stopping.args = { - ...defaultArgs, - workspace: Mocks.MockStoppingWorkspace, +export const Stopped: Story = { + args: { + workspace: Mocks.MockStoppedWorkspace, + }, }; -export const Stopped = Template.bind({}); -Stopped.args = { - ...defaultArgs, - workspace: Mocks.MockStoppedWorkspace, +export const Canceling: Story = { + args: { + workspace: Mocks.MockCancelingWorkspace, + }, }; -export const Canceling = Template.bind({}); -Canceling.args = { - ...defaultArgs, - workspace: Mocks.MockCancelingWorkspace, +export const Canceled: Story = { + args: { + workspace: Mocks.MockCanceledWorkspace, + }, }; -export const Canceled = Template.bind({}); -Canceled.args = { - ...defaultArgs, - workspace: Mocks.MockCanceledWorkspace, +export const Deleting: Story = { + args: { + workspace: Mocks.MockDeletingWorkspace, + }, }; -export const Deleting = Template.bind({}); -Deleting.args = { - ...defaultArgs, - workspace: Mocks.MockDeletingWorkspace, +export const Deleted: Story = { + args: { + workspace: Mocks.MockDeletedWorkspace, + }, }; -export const Deleted = Template.bind({}); -Deleted.args = { - ...defaultArgs, - workspace: Mocks.MockDeletedWorkspace, +export const Outdated: Story = { + args: { + workspace: Mocks.MockOutdatedWorkspace, + }, }; -export const Outdated = Template.bind({}); -Outdated.args = { - ...defaultArgs, - workspace: Mocks.MockOutdatedWorkspace, +export const Failed: Story = { + args: { + workspace: Mocks.MockFailedWorkspace, + }, }; -export const Failed = Template.bind({}); -Failed.args = { - ...defaultArgs, - workspace: Mocks.MockFailedWorkspace, -}; - -export const Updating = Template.bind({}); -Updating.args = { - ...defaultArgs, - isUpdating: true, - workspace: Mocks.MockOutdatedWorkspace, +export const Updating: Story = { + args: { + isUpdating: true, + workspace: Mocks.MockOutdatedWorkspace, + }, }; diff --git a/site/src/pages/WorkspacePage/WorkspaceBuildProgress.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceBuildProgress.stories.tsx index ae1688dd51..2dfb5f4eb4 100644 --- a/site/src/pages/WorkspacePage/WorkspaceBuildProgress.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceBuildProgress.stories.tsx @@ -1,75 +1,71 @@ -import { ComponentMeta, Story } from "@storybook/react"; +import { Meta, StoryObj } from "@storybook/react"; import dayjs from "dayjs"; import { MockStartingWorkspace, MockWorkspaceBuild, MockProvisionerJob, } from "testHelpers/entities"; -import { - WorkspaceBuildProgress, - WorkspaceBuildProgressProps, -} from "./WorkspaceBuildProgress"; +import { WorkspaceBuildProgress } from "./WorkspaceBuildProgress"; -export default { +const meta: Meta = { title: "components/WorkspaceBuildProgress", component: WorkspaceBuildProgress, -} as ComponentMeta; - -const Template: Story = (args) => ( - -); - -export const Starting = Template.bind({}); -Starting.args = { - transitionStats: { - P50: 10000, - P95: 10010, - }, - workspace: { - ...MockStartingWorkspace, - latest_build: { - ...MockWorkspaceBuild, - status: "starting", - job: { - ...MockProvisionerJob, - started_at: dayjs().add(-5, "second").format(), - status: "running", + args: { + transitionStats: { + P50: 10000, + P95: 10010, + }, + workspace: { + ...MockStartingWorkspace, + latest_build: { + ...MockWorkspaceBuild, + status: "starting", + job: { + ...MockProvisionerJob, + started_at: dayjs().add(-5, "second").format(), + status: "running", + }, }, }, }, }; +export default meta; +type Story = StoryObj; + +export const Starting: Story = {}; + // When the transition stats are returning null, the progress bar should not be // displayed -export const StartingUnknown = Template.bind({}); -StartingUnknown.args = { - ...Starting.args, - transitionStats: { - // HACK: the codersdk type generator doesn't support null values, but this - // can be null when the template is new. - // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- Read comment above - // @ts-ignore-error - P50: null, - // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- Read comment above - // @ts-ignore-error - P95: null, +export const StartingUnknown: Story = { + args: { + transitionStats: { + // HACK: the codersdk type generator doesn't support null values, but this + // can be null when the template is new. + // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- Read comment above + // @ts-ignore-error + P50: null, + // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- Read comment above + // @ts-ignore-error + P95: null, + }, }, }; -export const StartingPassedEstimate = Template.bind({}); -StartingPassedEstimate.args = { - ...Starting.args, - transitionStats: { P50: 1000, P95: 1000 }, +export const StartingPassedEstimate: Story = { + args: { + transitionStats: { P50: 1000, P95: 1000 }, + }, }; -export const StartingHighVariaton = Template.bind({}); -StartingHighVariaton.args = { - ...Starting.args, - transitionStats: { P50: 10000, P95: 20000 }, +export const StartingHighVariaton: Story = { + args: { + transitionStats: { P50: 10000, P95: 20000 }, + }, }; -export const StartingZeroEstimate = Template.bind({}); -StartingZeroEstimate.args = { - ...Starting.args, - transitionStats: { P50: 0, P95: 0 }, +export const StartingZeroEstimate: Story = { + args: { + transitionStats: { P50: 0, P95: 0 }, + }, }; diff --git a/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.stories.tsx index 3230bf7ccc..85d06ab706 100644 --- a/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.stories.tsx @@ -1,20 +1,12 @@ -import { action } from "@storybook/addon-actions"; -import { Story } from "@storybook/react"; -import { - WorkspaceDeletedBanner, - WorkspaceDeletedBannerProps, -} from "./WorkspaceDeletedBanner"; +import { Meta, StoryObj } from "@storybook/react"; +import { WorkspaceDeletedBanner } from "./WorkspaceDeletedBanner"; -export default { +const meta: Meta = { title: "components/WorkspaceDeletedBanner", component: WorkspaceDeletedBanner, }; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = { - handleClick: action("extend"), -}; +export const Example: Story = {}; diff --git a/site/src/pages/WorkspacePage/WorkspaceStats.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceStats.stories.tsx index 714854d71c..715bbad70e 100644 --- a/site/src/pages/WorkspacePage/WorkspaceStats.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceStats.stories.tsx @@ -1,4 +1,4 @@ -import { Story } from "@storybook/react"; +import { Meta, StoryObj } from "@storybook/react"; import { MockWorkspace, MockAppearance, @@ -6,14 +6,9 @@ import { MockEntitlementsWithScheduling, MockExperiments, } from "testHelpers/entities"; -import { WorkspaceStats, WorkspaceStatsProps } from "./WorkspaceStats"; +import { WorkspaceStats } from "./WorkspaceStats"; import { DashboardProviderContext } from "components/Dashboard/DashboardProvider"; -export default { - title: "components/WorkspaceStats", - component: WorkspaceStats, -}; - const MockedAppearance = { config: MockAppearance, preview: false, @@ -21,28 +16,39 @@ const MockedAppearance = { save: () => null, }; -const Template: Story = (args) => ( - - - -); - -export const Example = Template.bind({}); -Example.args = { - workspace: MockWorkspace, +const meta: Meta = { + title: "components/WorkspaceStats", + component: WorkspaceStats, + decorators: [ + (Story) => ( + + + + ), + ], }; -export const Outdated = Template.bind({}); -Outdated.args = { - workspace: { - ...MockWorkspace, - outdated: true, +export default meta; +type Story = StoryObj; + +export const Example: Story = { + args: { + workspace: MockWorkspace, + }, +}; + +export const Outdated: Story = { + args: { + workspace: { + ...MockWorkspace, + outdated: true, + }, }, }; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.stories.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.stories.tsx index 9dfd817b31..644a5ff648 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.stories.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.stories.tsx @@ -1,9 +1,5 @@ -import { ComponentMeta, Story } from "@storybook/react"; -import { - WorkspaceParametersPageView, - WorkspaceParametersPageViewProps, -} from "./WorkspaceParametersPage"; -import { action } from "@storybook/addon-actions"; +import { Meta, StoryObj } from "@storybook/react"; +import { WorkspaceParametersPageView } from "./WorkspaceParametersPage"; import { MockWorkspaceBuildParameter1, MockWorkspaceBuildParameter2, @@ -13,13 +9,13 @@ import { MockWorkspaceBuildParameter3, } from "testHelpers/entities"; -export default { +const meta: Meta = { title: "pages/WorkspaceParametersPageView", component: WorkspaceParametersPageView, args: { submitError: undefined, isSubmitting: false, - onCancel: action("cancel"), + data: { buildParameters: [ MockWorkspaceBuildParameter1, @@ -36,11 +32,9 @@ export default { ], }, }, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = {}; +export const Example: Story = {}; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx index 61571eee82..80c5e9bdc3 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx @@ -1,4 +1,4 @@ -import { Story } from "@storybook/react"; +import { Meta, StoryObj } from "@storybook/react"; import dayjs from "dayjs"; import advancedFormat from "dayjs/plugin/advancedFormat"; import timezone from "dayjs/plugin/timezone"; @@ -9,31 +9,19 @@ import { } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule"; import { emptyTTL } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/ttl"; import { mockApiError } from "testHelpers/entities"; -import { - WorkspaceScheduleForm, - WorkspaceScheduleFormProps, -} from "./WorkspaceScheduleForm"; +import { WorkspaceScheduleForm } from "./WorkspaceScheduleForm"; dayjs.extend(advancedFormat); dayjs.extend(utc); dayjs.extend(timezone); -export default { +const meta: Meta = { title: "components/WorkspaceScheduleForm", component: WorkspaceScheduleForm, - argTypes: { - onCancel: { - action: "onCancel", - }, - onSubmit: { - action: "onSubmit", - }, - }, }; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; const defaultInitialValues = { autostartEnabled: true, @@ -42,53 +30,62 @@ const defaultInitialValues = { ttl: 24, }; -export const AllDisabled = Template.bind({}); -AllDisabled.args = { - initialValues: { - autostartEnabled: false, - ...emptySchedule, - autostopEnabled: false, - ttl: emptyTTL, +export const AllDisabled: Story = { + args: { + initialValues: { + autostartEnabled: false, + ...emptySchedule, + autostopEnabled: false, + ttl: emptyTTL, + }, }, }; -export const Autostart = Template.bind({}); -Autostart.args = { - initialValues: { - autostartEnabled: true, - ...defaultSchedule(), - autostopEnabled: false, - ttl: emptyTTL, +export const Autostart: Story = { + args: { + initialValues: { + autostartEnabled: true, + ...defaultSchedule(), + autostopEnabled: false, + ttl: emptyTTL, + }, }, }; -export const WorkspaceWillShutdownInTwoHours = Template.bind({}); -WorkspaceWillShutdownInTwoHours.args = { - initialValues: { ...defaultInitialValues, ttl: 2 }, +export const WorkspaceWillShutdownInTwoHours: Story = { + args: { + initialValues: { ...defaultInitialValues, ttl: 2 }, + }, }; -export const WorkspaceWillShutdownInADay = Template.bind({}); -WorkspaceWillShutdownInADay.args = { - initialValues: { ...defaultInitialValues, ttl: 24 }, +export const WorkspaceWillShutdownInADay: Story = { + args: { + initialValues: { ...defaultInitialValues, ttl: 24 }, + }, }; -export const WorkspaceWillShutdownInTwoDays = Template.bind({}); -WorkspaceWillShutdownInTwoDays.args = { - initialValues: { ...defaultInitialValues, ttl: 48 }, +export const WorkspaceWillShutdownInTwoDays: Story = { + args: { + initialValues: { ...defaultInitialValues, ttl: 48 }, + }, }; -export const WithError = Template.bind({}); -WithError.args = { - initialValues: { ...defaultInitialValues, ttl: 100 }, - initialTouched: { ttl: true }, - submitScheduleError: mockApiError({ - message: "Something went wrong.", - validations: [{ field: "ttl_ms", detail: "Invalid time until shutdown." }], - }), +export const WithError: Story = { + args: { + initialValues: { ...defaultInitialValues, ttl: 100 }, + initialTouched: { ttl: true }, + submitScheduleError: mockApiError({ + message: "Something went wrong.", + validations: [ + { field: "ttl_ms", detail: "Invalid time until shutdown." }, + ], + }), + }, }; -export const Loading = Template.bind({}); -Loading.args = { - initialValues: defaultInitialValues, - isLoading: true, +export const Loading: Story = { + args: { + initialValues: defaultInitialValues, + isLoading: true, + }, }; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.stories.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.stories.tsx index 6d8216902d..c73d21a6e6 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.stories.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.stories.tsx @@ -1,25 +1,18 @@ -import { ComponentMeta, Story } from "@storybook/react"; +import { Meta, StoryObj } from "@storybook/react"; import { MockWorkspace } from "testHelpers/entities"; -import { - WorkspaceSettingsPageView, - WorkspaceSettingsPageViewProps, -} from "./WorkspaceSettingsPageView"; -import { action } from "@storybook/addon-actions"; +import { WorkspaceSettingsPageView } from "./WorkspaceSettingsPageView"; -export default { +const meta: Meta = { title: "pages/WorkspaceSettingsPageView", component: WorkspaceSettingsPageView, args: { error: undefined, isSubmitting: false, workspace: MockWorkspace, - onCancel: action("cancel"), }, -} as ComponentMeta; +}; -const Template: Story = (args) => ( - -); +export default meta; +type Story = StoryObj; -export const Example = Template.bind({}); -Example.args = {}; +export const Example: Story = {}; diff --git a/site/src/pages/index.tsx b/site/src/pages/index.tsx deleted file mode 100644 index 9753a6c840..0000000000 --- a/site/src/pages/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import { FC } from "react"; -import { Navigate } from "react-router-dom"; - -const IndexPage: FC = () => { - return ; -}; - -export default IndexPage; diff --git a/site/src/xServices/createTemplate/createTemplateXService.ts b/site/src/xServices/createTemplate/createTemplateXService.ts index 725ec9d141..e30c1cca93 100644 --- a/site/src/xServices/createTemplate/createTemplateXService.ts +++ b/site/src/xServices/createTemplate/createTemplateXService.ts @@ -23,7 +23,7 @@ import { displayError } from "components/GlobalSnackbar/utils"; import { TemplateAutostopRequirementDaysValue, calculateAutostopRequirementDaysValue, -} from "pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm/AutostopRequirementHelperText"; +} from "pages/TemplateSettingsPage/TemplateSchedulePage/AutostopRequirementHelperText"; import { delay } from "utils/delay"; import { assign, createMachine } from "xstate";