From cf85bfe35e6cc7a9f46204c0d72c938f82821b8e Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Tue, 23 Aug 2022 19:34:48 +0000 Subject: [PATCH 01/11] using hours instead of seconds --- .../TemplateSettingsForm.tsx | 10 +++---- .../TemplateSettingsPage.test.tsx | 30 +++++++++++++++++++ 2 files changed, 35 insertions(+), 5 deletions(-) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index ed8feedaf2025..aa089d5f094cf 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -21,7 +21,7 @@ export const Language = { maxTtlLabel: "Auto-stop limit", iconLabel: "Icon", // This is the same from the CLI on https://github.com/coder/coder/blob/546157b63ef9204658acf58cb653aa9936b70c49/cli/templateedit.go#L59 - maxTtlHelperText: "Edit the template maximum time before shutdown in seconds", + maxTtlHelperText: "Edit the template maximum time before shutdown in hours", formAriaLabel: "Template settings form", selectEmoji: "Select emoji", } @@ -154,11 +154,11 @@ export const TemplateSettingsForm: FC = ({ inputProps={{ min: 0, step: 1 }} label={Language.maxTtlLabel} variant="outlined" - // Display seconds from ms - value={form.values.max_ttl_ms ? form.values.max_ttl_ms / 1000 : ""} - // Convert ms to seconds + // Display hours from ms + value={form.values.max_ttl_ms ? form.values.max_ttl_ms / 3600000 : ""} + // Convert hours to ms onChange={(event) => - form.setFieldValue("max_ttl_ms", Number(event.currentTarget.value) * 1000) + form.setFieldValue("max_ttl_ms", Number(event.currentTarget.value) * 3600000) } /> diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx index 78554885f8209..60e4b24d2867a 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx @@ -69,4 +69,34 @@ describe("TemplateSettingsPage", () => { await waitFor(() => expect(API.updateTemplateMeta).toBeCalledTimes(1)) }) + + test("ttl is converted to and from hours", async () => { + await renderTemplateSettingsPage() + + const newTemplateSettings = { + name: "edited-template-name", + description: "Edited description", + max_ttl_ms: 1, + icon: "/icon/code.svg", + } + + jest.spyOn(API, "updateTemplateMeta").mockResolvedValueOnce({ + ...MockTemplate, + ...newTemplateSettings, + }) + + await fillAndSubmitForm(newTemplateSettings) + expect(screen.getByDisplayValue(1)).toBeInTheDocument() + await waitFor(() => expect(API.updateTemplateMeta).toBeCalledTimes(1)) + + await waitFor(() => + expect(API.updateTemplateMeta).toBeCalledWith( + "test-template", + expect.objectContaining({ + ...newTemplateSettings, + max_ttl_ms: 3600000, + }), + ), + ) + }) }) From 8b8882fe240837271d7e8ec04481a7a7aae6f665 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 13:52:21 +0000 Subject: [PATCH 02/11] checking out --- .../WorkspaceScheduleForm.tsx | 3 +- .../TemplateSettingsForm.tsx | 12 ++------ .../TemplateSettingsPage.test.tsx | 28 ++++++++++++++++++- 3 files changed, 31 insertions(+), 12 deletions(-) diff --git a/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx index 06466d9728540..12cfc8942eba2 100644 --- a/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx +++ b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx @@ -41,6 +41,7 @@ export const Language = { errorTime: "Time must be in HH:mm format (24 hours)", errorTimezone: "Invalid timezone", errorNoStop: "Time until shutdown must be greater than zero when auto-stop is enabled", + errorTtlMax: "Please enter a limit that is less than or equal to 168 hours (7 days).", daysOfWeekLabel: "Days of Week", daySundayLabel: "Sunday", dayMondayLabel: "Monday", @@ -159,7 +160,7 @@ export const validationSchema = Yup.object({ ttl: Yup.number() .integer() .min(0) - .max(24 * 7 /* 7 days */) + .max(24 * 7 /* 7 days */, Language.errorTtlMax) .test("positive-if-auto-stop", Language.errorNoStop, function (value) { const parent = this.parent as WorkspaceScheduleFormValues if (parent.autoStopEnabled) { diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index aa089d5f094cf..678650eacb8c4 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -20,16 +20,15 @@ export const Language = { descriptionLabel: "Description", maxTtlLabel: "Auto-stop limit", iconLabel: "Icon", - // This is the same from the CLI on https://github.com/coder/coder/blob/546157b63ef9204658acf58cb653aa9936b70c49/cli/templateedit.go#L59 - maxTtlHelperText: "Edit the template maximum time before shutdown in hours", formAriaLabel: "Template settings form", selectEmoji: "Select emoji", + ttlMaxError: "Please enter a limit that is less than or equal to 168 hours (7 days).", } export const validationSchema = Yup.object({ name: nameValidator(Language.nameLabel), description: Yup.string(), - max_ttl_ms: Yup.number(), + max_ttl_ms: Yup.number().integer().min(0).max(168, Language.ttlMaxError), }) export interface TemplateSettingsForm { @@ -148,18 +147,11 @@ export const TemplateSettingsForm: FC = ({ - form.setFieldValue("max_ttl_ms", Number(event.currentTarget.value) * 3600000) - } /> diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx index 60e4b24d2867a..1054809b0708c 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx @@ -5,7 +5,7 @@ import { UpdateTemplateMeta } from "api/typesGenerated" import { Language as FooterFormLanguage } from "components/FormFooter/FormFooter" import { MockTemplate } from "../../testHelpers/entities" import { renderWithAuth } from "../../testHelpers/renderHelpers" -import { Language as FormLanguage } from "./TemplateSettingsForm" +import { Language as FormLanguage, validationSchema } from "./TemplateSettingsForm" import { TemplateSettingsPage } from "./TemplateSettingsPage" import { Language as ViewLanguage } from "./TemplateSettingsPageView" @@ -19,6 +19,14 @@ const renderTemplateSettingsPage = async () => { return renderResult } +const validFormValues: UpdateTemplateMeta = { + name: "A name", + description: "A description", + icon: "A string", + max_ttl_ms: 24, + min_autostart_interval_ms: 24, +} + const fillAndSubmitForm = async ({ name, description, @@ -99,4 +107,22 @@ describe("TemplateSettingsPage", () => { ), ) }) + + it("allows a ttl of 7 days", () => { + const values: UpdateTemplateMeta = { + ...validFormValues, + max_ttl_ms: 24 * 7, + } + const validate = () => validationSchema.validateSync(values) + expect(validate).not.toThrowError() + }) + + it("disallows a ttl of 7 days + 1 hour", () => { + const values: UpdateTemplateMeta = { + ...validFormValues, + max_ttl_ms: 24 * 7 + 1, + } + const validate = () => validationSchema.validateSync(values) + expect(validate).toThrowError("ttl must be less than or equal to 168") + }) }) From 45a41d1a2e88fd203e23c400bb0640de1c690b7a Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 14:29:31 +0000 Subject: [PATCH 03/11] added ttl tests --- .../WorkspaceScheduleForm.test.ts | 2 +- .../TemplateSettingsForm.tsx | 12 +++++-- .../TemplateSettingsPage.test.tsx | 36 ++++++------------- 3 files changed, 22 insertions(+), 28 deletions(-) diff --git a/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.test.ts b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.test.ts index 101635a13cd00..ac6472ab58407 100644 --- a/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.test.ts +++ b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.test.ts @@ -161,7 +161,7 @@ describe("validationSchema", () => { ttl: 24 * 7 + 1, } const validate = () => validationSchema.validateSync(values) - expect(validate).toThrowError("ttl must be less than or equal to 168") + expect(validate).toThrowError(Language.errorTtlMax) }) }) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index 678650eacb8c4..d86b1b28830f2 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -54,11 +54,18 @@ export const TemplateSettingsForm: FC = ({ initialValues: { name: template.name, description: template.description, - max_ttl_ms: template.max_ttl_ms, + // on display, convert from ms => hours + max_ttl_ms: template.max_ttl_ms / 3600000, icon: template.icon, }, validationSchema, - onSubmit, + onSubmit: (formData) => { + // on submit, convert from hours => ms + onSubmit({ + ...formData, + max_ttl_ms: formData.max_ttl_ms ? formData.max_ttl_ms * 3600000 : undefined, + }) + }, initialTouched, }) const getFieldHelpers = getFormHelpersWithError(form, error) @@ -152,6 +159,7 @@ export const TemplateSettingsForm: FC = ({ inputProps={{ min: 0, step: 1 }} label={Language.maxTtlLabel} variant="outlined" + type="number" /> diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx index 1054809b0708c..d4f3989b2c029 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx @@ -19,12 +19,11 @@ const renderTemplateSettingsPage = async () => { return renderResult } -const validFormValues: UpdateTemplateMeta = { - name: "A name", +const validFormValues = { + name: "Name", description: "A description", icon: "A string", - max_ttl_ms: 24, - min_autostart_interval_ms: 24, + max_ttl_ms: 1, } const fillAndSubmitForm = async ({ @@ -63,17 +62,11 @@ describe("TemplateSettingsPage", () => { it("succeeds", async () => { await renderTemplateSettingsPage() - const newTemplateSettings = { - name: "edited-template-name", - description: "Edited description", - max_ttl_ms: 4000, - icon: "/icon/code.svg", - } jest.spyOn(API, "updateTemplateMeta").mockResolvedValueOnce({ ...MockTemplate, - ...newTemplateSettings, + ...validFormValues, }) - await fillAndSubmitForm(newTemplateSettings) + await fillAndSubmitForm(validFormValues) await waitFor(() => expect(API.updateTemplateMeta).toBeCalledTimes(1)) }) @@ -81,28 +74,21 @@ describe("TemplateSettingsPage", () => { test("ttl is converted to and from hours", async () => { await renderTemplateSettingsPage() - const newTemplateSettings = { - name: "edited-template-name", - description: "Edited description", - max_ttl_ms: 1, - icon: "/icon/code.svg", - } - jest.spyOn(API, "updateTemplateMeta").mockResolvedValueOnce({ ...MockTemplate, - ...newTemplateSettings, + ...validFormValues, }) - await fillAndSubmitForm(newTemplateSettings) - expect(screen.getByDisplayValue(1)).toBeInTheDocument() + await fillAndSubmitForm(validFormValues) + expect(screen.getByDisplayValue(1)).toBeInTheDocument() // the max_ttl_ms await waitFor(() => expect(API.updateTemplateMeta).toBeCalledTimes(1)) await waitFor(() => expect(API.updateTemplateMeta).toBeCalledWith( "test-template", expect.objectContaining({ - ...newTemplateSettings, - max_ttl_ms: 3600000, + ...validFormValues, + max_ttl_ms: 3600000, // the max_ttl_ms to ms }), ), ) @@ -123,6 +109,6 @@ describe("TemplateSettingsPage", () => { max_ttl_ms: 24 * 7 + 1, } const validate = () => validationSchema.validateSync(values) - expect(validate).toThrowError("ttl must be less than or equal to 168") + expect(validate).toThrowError(FormLanguage.ttlMaxError) }) }) From 3bab482a58a3df3e225f62fb0fb7f0f823813f30 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 14:38:27 +0000 Subject: [PATCH 04/11] added description validation and tests --- .../TemplateSettingsForm.tsx | 11 ++++++++-- .../TemplateSettingsPage.test.tsx | 20 +++++++++++++++++++ 2 files changed, 29 insertions(+), 2 deletions(-) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index d86b1b28830f2..20f9a52834c0f 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -23,12 +23,19 @@ export const Language = { formAriaLabel: "Template settings form", selectEmoji: "Select emoji", ttlMaxError: "Please enter a limit that is less than or equal to 168 hours (7 days).", + descriptionMaxError: "Please enter a description that is less than or equal to 128 characters.", } +const MAX_DESCRIPTION_CHAR_LIMIT = 128 +const MAX_TTL_DAYS = 7 + export const validationSchema = Yup.object({ name: nameValidator(Language.nameLabel), - description: Yup.string(), - max_ttl_ms: Yup.number().integer().min(0).max(168, Language.ttlMaxError), + description: Yup.string().max(MAX_DESCRIPTION_CHAR_LIMIT, Language.descriptionMaxError), + max_ttl_ms: Yup.number() + .integer() + .min(0) + .max(24 * MAX_TTL_DAYS /* 7 days in hours */, Language.ttlMaxError), }) export interface TemplateSettingsForm { diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx index d4f3989b2c029..cd91e1b9eb594 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx @@ -111,4 +111,24 @@ describe("TemplateSettingsPage", () => { const validate = () => validationSchema.validateSync(values) expect(validate).toThrowError(FormLanguage.ttlMaxError) }) + + it("allows a description of 128 chars", () => { + const values: UpdateTemplateMeta = { + ...validFormValues, + description: + "Nam quis nulla. Integer malesuada. In in enim a arcu imperdiet malesuada. Sed vel lectus. Donec odio urna, tempus molestie, port", + } + const validate = () => validationSchema.validateSync(values) + expect(validate).not.toThrowError() + }) + + it("disallows a description of 128 + 1 chars", () => { + const values: UpdateTemplateMeta = { + ...validFormValues, + description: + "Nam quis nulla. Integer malesuada. In in enim a arcu imperdiet malesuada. Sed vel lectus. Donec odio urna, tempus molestie, port a", + } + const validate = () => validationSchema.validateSync(values) + expect(validate).toThrowError(FormLanguage.descriptionMaxError) + }) }) From 94abca98b79ebfc11dca37f45baf32db2562e88e Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 15:12:23 +0000 Subject: [PATCH 05/11] added some helper text --- .../TemplateSettingsPage/TemplateSettingsForm.tsx | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index 20f9a52834c0f..cc21cf72c17f3 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -5,6 +5,7 @@ import InputAdornment from "@material-ui/core/InputAdornment" import Popover from "@material-ui/core/Popover" import { makeStyles } from "@material-ui/core/styles" import TextField from "@material-ui/core/TextField" +import Typography from "@material-ui/core/Typography" import { Template, UpdateTemplateMeta } from "api/typesGenerated" import { OpenDropdown } from "components/DropdownArrows/DropdownArrows" import { FormFooter } from "components/FormFooter/FormFooter" @@ -24,6 +25,10 @@ export const Language = { selectEmoji: "Select emoji", ttlMaxError: "Please enter a limit that is less than or equal to 168 hours (7 days).", descriptionMaxError: "Please enter a description that is less than or equal to 128 characters.", + ttlHelperText: ( + ttl?: number, + ): string => `Workspaces created from this template will, by default, shut down ${ttl} + hours after starting.`, } const MAX_DESCRIPTION_CHAR_LIMIT = 128 @@ -168,6 +173,11 @@ export const TemplateSettingsForm: FC = ({ variant="outlined" type="number" /> + {!form.errors.max_ttl_ms && ( + + {Language.ttlHelperText(form.values.max_ttl_ms)} + + )} From b7ce0202ca1fc0c62195af7085958552cf5f6502 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 15:15:32 +0000 Subject: [PATCH 06/11] fix typing --- site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index cc21cf72c17f3..67b94a1d187f6 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -26,7 +26,7 @@ export const Language = { ttlMaxError: "Please enter a limit that is less than or equal to 168 hours (7 days).", descriptionMaxError: "Please enter a description that is less than or equal to 128 characters.", ttlHelperText: ( - ttl?: number, + ttl: number, ): string => `Workspaces created from this template will, by default, shut down ${ttl} hours after starting.`, } @@ -173,7 +173,7 @@ export const TemplateSettingsForm: FC = ({ variant="outlined" type="number" /> - {!form.errors.max_ttl_ms && ( + {!form.errors.max_ttl_ms && form.values.max_ttl_ms && ( {Language.ttlHelperText(form.values.max_ttl_ms)} From 1eda40cf18af9d563f22a188d958ea97ea4848e4 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 11:22:09 -0400 Subject: [PATCH 07/11] Update site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx Co-authored-by: Cian Johnston --- site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index 67b94a1d187f6..783428eced2ef 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -27,8 +27,7 @@ export const Language = { descriptionMaxError: "Please enter a description that is less than or equal to 128 characters.", ttlHelperText: ( ttl: number, - ): string => `Workspaces created from this template will, by default, shut down ${ttl} - hours after starting.`, + ): string => `Workspaces created from this template may not remain running longer than ${ttl}.`, } const MAX_DESCRIPTION_CHAR_LIMIT = 128 From ac67ccbaefa478c315c364d279500e6327d67fa7 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 15:34:58 +0000 Subject: [PATCH 08/11] ran prettier --- site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index 783428eced2ef..d4d11636ff01a 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -25,9 +25,8 @@ export const Language = { selectEmoji: "Select emoji", ttlMaxError: "Please enter a limit that is less than or equal to 168 hours (7 days).", descriptionMaxError: "Please enter a description that is less than or equal to 128 characters.", - ttlHelperText: ( - ttl: number, - ): string => `Workspaces created from this template may not remain running longer than ${ttl}.`, + ttlHelperText: (ttl: number): string => + `Workspaces created from this template may not remain running longer than ${ttl}.`, } const MAX_DESCRIPTION_CHAR_LIMIT = 128 From 5f74e95ec59ac110ac12825fb89d371987227d55 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 15:38:01 +0000 Subject: [PATCH 09/11] added ttl of 0 test --- .../TemplateSettingsPage/TemplateSettingsPage.test.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx index cd91e1b9eb594..b07d4394d9f9f 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsPage.test.tsx @@ -103,6 +103,15 @@ describe("TemplateSettingsPage", () => { expect(validate).not.toThrowError() }) + it("allows ttl of 0", () => { + const values: UpdateTemplateMeta = { + ...validFormValues, + max_ttl_ms: 0, + } + const validate = () => validationSchema.validateSync(values) + expect(validate).not.toThrowError() + }) + it("disallows a ttl of 7 days + 1 hour", () => { const values: UpdateTemplateMeta = { ...validFormValues, From db107820bb229d98105fff41e4e4dd89072d1a30 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 16:58:04 +0000 Subject: [PATCH 10/11] typo --- site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index d4d11636ff01a..729a84a09f7d1 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -26,7 +26,7 @@ export const Language = { ttlMaxError: "Please enter a limit that is less than or equal to 168 hours (7 days).", descriptionMaxError: "Please enter a description that is less than or equal to 128 characters.", ttlHelperText: (ttl: number): string => - `Workspaces created from this template may not remain running longer than ${ttl}.`, + `Workspaces created from this template may not remain running longer than ${ttl} hours.`, } const MAX_DESCRIPTION_CHAR_LIMIT = 128 From 15e1ad2c69d9616b0e810e6980de821df2e7b199 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 24 Aug 2022 17:46:34 +0000 Subject: [PATCH 11/11] PR feedback --- .../WorkspaceScheduleForm/WorkspaceScheduleForm.tsx | 10 +++++----- .../TemplateSettingsPage/TemplateSettingsForm.tsx | 10 +++++++--- 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx index 12cfc8942eba2..aad9ff2f92432 100644 --- a/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx +++ b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx @@ -36,11 +36,11 @@ dayjs.extend(relativeTime) dayjs.extend(timezone) export const Language = { - errorNoDayOfWeek: "Must set at least one day of week if auto-start is enabled", - errorNoTime: "Start time is required when auto-start is enabled", - errorTime: "Time must be in HH:mm format (24 hours)", - errorTimezone: "Invalid timezone", - errorNoStop: "Time until shutdown must be greater than zero when auto-stop is enabled", + errorNoDayOfWeek: "Must set at least one day of week if auto-start is enabled.", + errorNoTime: "Start time is required when auto-start is enabled.", + errorTime: "Time must be in HH:mm format (24 hours).", + errorTimezone: "Invalid timezone.", + errorNoStop: "Time until shutdown must be greater than zero when auto-stop is enabled.", errorTtlMax: "Please enter a limit that is less than or equal to 168 hours (7 days).", daysOfWeekLabel: "Days of Week", daySundayLabel: "Sunday", diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx index 729a84a09f7d1..11a0143d7892c 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsForm.tsx @@ -31,6 +31,7 @@ export const Language = { const MAX_DESCRIPTION_CHAR_LIMIT = 128 const MAX_TTL_DAYS = 7 +const MS_HOUR_CONVERSION = 3600000 export const validationSchema = Yup.object({ name: nameValidator(Language.nameLabel), @@ -65,7 +66,7 @@ export const TemplateSettingsForm: FC = ({ name: template.name, description: template.description, // on display, convert from ms => hours - max_ttl_ms: template.max_ttl_ms / 3600000, + max_ttl_ms: template.max_ttl_ms / MS_HOUR_CONVERSION, icon: template.icon, }, validationSchema, @@ -73,7 +74,7 @@ export const TemplateSettingsForm: FC = ({ // on submit, convert from hours => ms onSubmit({ ...formData, - max_ttl_ms: formData.max_ttl_ms ? formData.max_ttl_ms * 3600000 : undefined, + max_ttl_ms: formData.max_ttl_ms ? formData.max_ttl_ms * MS_HOUR_CONVERSION : undefined, }) }, initialTouched, @@ -171,7 +172,10 @@ export const TemplateSettingsForm: FC = ({ variant="outlined" type="number" /> - {!form.errors.max_ttl_ms && form.values.max_ttl_ms && ( + {/* If a value for max_ttl_ms has been entered and + there are no validation errors for that field, display helper text. + We do not use the MUI helper-text prop because it overrides the validation error */} + {form.values.max_ttl_ms && !form.errors.max_ttl_ms && ( {Language.ttlHelperText(form.values.max_ttl_ms)}