Skip to content

Commit df29762

Browse files
fix(site): match activity bump text with template settings (#12170)
Close #12130
1 parent 99dbeb4 commit df29762

File tree

4 files changed

+102
-78
lines changed

4 files changed

+102
-78
lines changed

site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx

Lines changed: 26 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -8,20 +8,19 @@ import {
88
emptySchedule,
99
} from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule";
1010
import { emptyTTL } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/ttl";
11-
import { mockApiError } from "testHelpers/entities";
11+
import { MockTemplate, mockApiError } from "testHelpers/entities";
1212
import { WorkspaceScheduleForm } from "./WorkspaceScheduleForm";
1313

1414
dayjs.extend(advancedFormat);
1515
dayjs.extend(utc);
1616
dayjs.extend(timezone);
1717

18-
const meta: Meta<typeof WorkspaceScheduleForm> = {
19-
title: "pages/WorkspaceSettingsPage/WorkspaceScheduleForm",
20-
component: WorkspaceScheduleForm,
21-
args: {
22-
allowTemplateAutoStart: true,
23-
allowTemplateAutoStop: true,
24-
allowedTemplateAutoStartDays: [
18+
const mockTemplate = {
19+
...MockTemplate,
20+
allow_user_autostart: true,
21+
allow_user_autostop: true,
22+
autostart_requirement: {
23+
days_of_week: [
2524
"sunday",
2625
"monday",
2726
"tuesday",
@@ -33,12 +32,20 @@ const meta: Meta<typeof WorkspaceScheduleForm> = {
3332
},
3433
};
3534

35+
const meta: Meta<typeof WorkspaceScheduleForm> = {
36+
title: "pages/WorkspaceSettingsPage/WorkspaceScheduleForm",
37+
component: WorkspaceScheduleForm,
38+
args: {
39+
template: mockTemplate,
40+
},
41+
};
42+
3643
export default meta;
3744
type Story = StoryObj<typeof WorkspaceScheduleForm>;
3845

3946
const defaultInitialValues = {
40-
autostartEnabled: true,
4147
...defaultSchedule(),
48+
autostartEnabled: true,
4249
autostopEnabled: true,
4350
ttl: 24,
4451
};
@@ -51,8 +58,11 @@ export const AllDisabled: Story = {
5158
autostopEnabled: false,
5259
ttl: emptyTTL,
5360
},
54-
allowTemplateAutoStart: false,
55-
allowTemplateAutoStop: false,
61+
template: {
62+
...mockTemplate,
63+
allow_user_autostart: false,
64+
allow_user_autostop: false,
65+
},
5666
},
5767
};
5868

@@ -64,7 +74,10 @@ export const Autostart: Story = {
6474
autostopEnabled: false,
6575
ttl: emptyTTL,
6676
},
67-
allowTemplateAutoStop: false,
77+
template: {
78+
...mockTemplate,
79+
allow_user_autostop: false,
80+
},
6881
},
6982
};
7083

@@ -90,7 +103,7 @@ export const WithError: Story = {
90103
args: {
91104
initialValues: { ...defaultInitialValues, ttl: 100 },
92105
initialTouched: { ttl: true },
93-
submitScheduleError: mockApiError({
106+
error: mockApiError({
94107
message: "Something went wrong.",
95108
validations: [
96109
{ field: "ttl_ms", detail: "Invalid time until shutdown." },

site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.test.tsx

Lines changed: 49 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {
44
validationSchema,
55
WorkspaceScheduleFormValues,
66
WorkspaceScheduleForm,
7+
WorkspaceScheduleFormProps,
78
} from "./WorkspaceScheduleForm";
89
import { timeZones } from "utils/timeZones";
910
import * as API from "api/api";
@@ -245,8 +246,8 @@ describe("ttlShutdownAt", () => {
245246
});
246247

247248
const autoStartDayLabels = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
248-
const defaultFormProps = {
249-
submitScheduleError: "",
249+
const defaultFormProps: WorkspaceScheduleFormProps = {
250+
error: "",
250251
initialValues: {
251252
...defaultSchedule(),
252253
autostartEnabled: true,
@@ -257,20 +258,28 @@ const defaultFormProps = {
257258
defaultTTL: 24,
258259
onCancel: () => null,
259260
onSubmit: () => null,
260-
allowedTemplateAutoStartDays: autoStartDayLabels,
261-
allowTemplateAutoStart: true,
262-
allowTemplateAutoStop: true,
261+
template: {
262+
...MockTemplate,
263+
allow_user_autostart: true,
264+
allow_user_autostop: true,
265+
autostart_requirement: {
266+
...MockTemplate.autostart_requirement,
267+
days_of_week: autoStartDayLabels,
268+
},
269+
},
263270
};
264271

265272
describe("templateInheritance", () => {
266273
it("disables the entire autostart feature appropriately", async () => {
267274
jest.spyOn(API, "getTemplateByName").mockResolvedValue(MockTemplate);
268-
render(
269-
<WorkspaceScheduleForm
270-
{...defaultFormProps}
271-
allowTemplateAutoStart={false}
272-
/>,
273-
);
275+
const props = {
276+
...defaultFormProps,
277+
template: {
278+
...defaultFormProps.template,
279+
allow_user_autostart: false,
280+
},
281+
};
282+
render(<WorkspaceScheduleForm {...props} />);
274283

275284
const autoStartToggle = await screen.findByLabelText("Enable Autostart");
276285
expect(autoStartToggle).toBeDisabled();
@@ -291,12 +300,18 @@ describe("templateInheritance", () => {
291300
const enabledDayLabels = ["Sat", "Sun"];
292301

293302
jest.spyOn(API, "getTemplateByName").mockResolvedValue(MockTemplate);
294-
render(
295-
<WorkspaceScheduleForm
296-
{...defaultFormProps}
297-
allowedTemplateAutoStartDays={["saturday", "sunday"]}
298-
/>,
299-
);
303+
const props = {
304+
...defaultFormProps,
305+
template: {
306+
...defaultFormProps.template,
307+
autostart_requirement: {
308+
...MockTemplate.autostart_requirement,
309+
days_of_week: ["saturday", "sunday"],
310+
},
311+
},
312+
};
313+
314+
render(<WorkspaceScheduleForm {...props} />);
300315

301316
const autoStartToggle = await screen.findByLabelText("Enable Autostart");
302317
expect(autoStartToggle).toBeEnabled();
@@ -321,13 +336,15 @@ describe("templateInheritance", () => {
321336
}
322337
});
323338
it("disables the entire autostop feature appropriately", async () => {
339+
const props = {
340+
...defaultFormProps,
341+
template: {
342+
...defaultFormProps.template,
343+
allow_user_autostop: false,
344+
},
345+
};
324346
jest.spyOn(API, "getTemplateByName").mockResolvedValue(MockTemplate);
325-
render(
326-
<WorkspaceScheduleForm
327-
{...defaultFormProps}
328-
allowTemplateAutoStop={false}
329-
/>,
330-
);
347+
render(<WorkspaceScheduleForm {...props} />);
331348

332349
const autoStopToggle = await screen.findByLabelText("Enable Autostop");
333350
expect(autoStopToggle).toBeDisabled();
@@ -398,17 +415,16 @@ test("form should be enabled when both auto stop and auto start features are dis
398415
});
399416

400417
test("form should be disabled when both auto stop and auto start features are disabled at template level", async () => {
418+
const props = {
419+
...defaultFormProps,
420+
template: {
421+
...defaultFormProps.template,
422+
allow_user_autostart: false,
423+
allow_user_autostop: false,
424+
},
425+
};
401426
jest.spyOn(API, "getTemplateByName").mockResolvedValue(MockTemplate);
402-
render(
403-
<WorkspaceScheduleForm
404-
{...defaultFormProps}
405-
allowTemplateAutoStart={false}
406-
allowTemplateAutoStop={false}
407-
initialValues={{
408-
...defaultFormProps.initialValues,
409-
}}
410-
/>,
411-
);
427+
render(<WorkspaceScheduleForm {...props} />);
412428

413429
const submitButton = await screen.findByRole("button", { name: "Submit" });
414430
expect(submitButton).toBeDisabled();

site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.tsx

Lines changed: 25 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ import { timeZones } from "utils/timeZones";
3232
import Tooltip from "@mui/material/Tooltip";
3333
import { formatDuration, intervalToDuration } from "date-fns";
3434
import { DisabledBadge } from "components/Badges/Badges";
35-
import { TemplateAutostartRequirement } from "api/typesGenerated";
35+
import { Template } from "api/typesGenerated";
3636

3737
// REMARK: some plugins depend on utc, so it's listed first. Otherwise they're
3838
// sorted alphabetically.
@@ -71,12 +71,10 @@ export const Language = {
7171
};
7272

7373
export interface WorkspaceScheduleFormProps {
74-
submitScheduleError?: unknown;
74+
template: Template;
75+
error?: unknown;
7576
initialValues: WorkspaceScheduleFormValues;
7677
isLoading: boolean;
77-
allowedTemplateAutoStartDays: TemplateAutostartRequirement["days_of_week"];
78-
allowTemplateAutoStop: boolean;
79-
allowTemplateAutoStart: boolean;
8078
onCancel: () => void;
8179
onSubmit: (values: WorkspaceScheduleFormValues) => void;
8280
// for storybook
@@ -95,7 +93,6 @@ export interface WorkspaceScheduleFormValues {
9593
saturday: boolean;
9694
startTime: string;
9795
timezone: string;
98-
9996
autostopEnabled: boolean;
10097
ttl: number;
10198
}
@@ -184,16 +181,14 @@ export const validationSchema = Yup.object({
184181
});
185182

186183
export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
187-
submitScheduleError,
184+
error,
188185
initialValues,
189186
isLoading,
190187
onCancel,
191188
onSubmit,
192189
initialTouched,
193190
defaultTTL,
194-
allowedTemplateAutoStartDays,
195-
allowTemplateAutoStop,
196-
allowTemplateAutoStart,
191+
template,
197192
}) => {
198193
const form = useFormik<WorkspaceScheduleFormValues>({
199194
initialValues,
@@ -202,10 +197,7 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
202197
initialTouched,
203198
enableReinitialize: true,
204199
});
205-
const formHelpers = getFormHelpers<WorkspaceScheduleFormValues>(
206-
form,
207-
submitScheduleError,
208-
);
200+
const formHelpers = getFormHelpers<WorkspaceScheduleFormValues>(form, error);
209201

210202
const checkboxes: Array<{ value: boolean; name: string; label: string }> = [
211203
{
@@ -289,7 +281,7 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
289281
Select the time and days of week on which you want the workspace
290282
starting automatically.
291283
</div>
292-
{!allowTemplateAutoStart && (
284+
{!template.allow_user_autostart && (
293285
<Tooltip title="This option can be enabled in the template settings">
294286
<DisabledBadge />
295287
</Tooltip>
@@ -301,7 +293,7 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
301293
<FormControlLabel
302294
control={
303295
<Switch
304-
disabled={!allowTemplateAutoStart}
296+
disabled={!template.allow_user_autostart}
305297
name="autostartEnabled"
306298
checked={form.values.autostartEnabled}
307299
onChange={handleToggleAutostart}
@@ -316,7 +308,7 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
316308
// or if primary feature is toggled off via the switch above
317309
disabled={
318310
isLoading ||
319-
!allowTemplateAutoStart ||
311+
!template.allow_user_autostart ||
320312
!form.values.autostartEnabled
321313
}
322314
label={Language.startTimeLabel}
@@ -329,7 +321,7 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
329321
// or if primary feature is toggled off via the switch above
330322
disabled={
331323
isLoading ||
332-
!allowTemplateAutoStart ||
324+
!template.allow_user_autostart ||
333325
!form.values.autostartEnabled
334326
}
335327
label={Language.timezoneLabel}
@@ -367,8 +359,10 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
367359
// also disabled if primary feature switch (above) is toggled off
368360
disabled={
369361
isLoading ||
370-
!allowTemplateAutoStart ||
371-
!allowedTemplateAutoStartDays.includes(checkbox.name) ||
362+
!template.allow_user_autostart ||
363+
!template.autostart_requirement.days_of_week.includes(
364+
checkbox.name,
365+
) ||
372366
!form.values.autostartEnabled
373367
}
374368
onChange={form.handleChange}
@@ -396,10 +390,13 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
396390
<div css={{ marginBottom: 16 }}>
397391
Set how many hours should elapse after the workspace started
398392
before the workspace automatically shuts down. This will be
399-
extended by 1 hour after last activity in the workspace was
400-
detected.
393+
extended by{" "}
394+
{dayjs
395+
.duration({ milliseconds: template.activity_bump_ms })
396+
.humanize()}{" "}
397+
after last activity in the workspace was detected.
401398
</div>
402-
{!allowTemplateAutoStop && (
399+
{!template.allow_user_autostop && (
403400
<Tooltip title="This option can be enabled in the template settings">
404401
<DisabledBadge />
405402
</Tooltip>
@@ -414,7 +411,7 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
414411
name="autostopEnabled"
415412
checked={form.values.autostopEnabled}
416413
onChange={handleToggleAutostop}
417-
disabled={!allowTemplateAutoStop}
414+
disabled={!template.allow_user_autostop}
418415
/>
419416
}
420417
label={Language.stopSwitch}
@@ -428,7 +425,7 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
428425
// if autostop feature is toggled off via the switch above
429426
disabled={
430427
isLoading ||
431-
!allowTemplateAutoStop ||
428+
!template.allow_user_autostop ||
432429
!form.values.autostopEnabled
433430
}
434431
inputProps={{ min: 0, step: "any" }}
@@ -443,7 +440,9 @@ export const WorkspaceScheduleForm: FC<WorkspaceScheduleFormProps> = ({
443440
isLoading={isLoading}
444441
// If both options, autostart and autostop, are disabled at the template
445442
// level, the form is disabled.
446-
submitDisabled={!allowTemplateAutoStart && !allowTemplateAutoStop}
443+
submitDisabled={
444+
!template.allow_user_autostart && !template.allow_user_autostop
445+
}
447446
/>
448447
</HorizontalForm>
449448
);

site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -101,12 +101,8 @@ export const WorkspaceSchedulePage: FC = () => {
101101

102102
{template && (
103103
<WorkspaceScheduleForm
104-
allowedTemplateAutoStartDays={
105-
template.autostart_requirement.days_of_week
106-
}
107-
allowTemplateAutoStart={template.allow_user_autostart}
108-
allowTemplateAutoStop={template.allow_user_autostop}
109-
submitScheduleError={submitScheduleMutation.error}
104+
template={template}
105+
error={submitScheduleMutation.error}
110106
initialValues={{
111107
...getAutostart(workspace),
112108
...getAutostop(workspace),

0 commit comments

Comments
 (0)