diff --git a/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx b/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx index 9d8042ae1e..b30cb129f4 100644 --- a/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx +++ b/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx @@ -79,6 +79,7 @@ export const ScheduleForm: FC = ({ }, }); const getFieldHelpers = getFormHelpers(form, submitError); + const browserLocale = navigator.language || "en-US"; return (
@@ -127,7 +128,12 @@ export const ScheduleForm: FC = ({ disabled fullWidth label="Next occurrence" - value={quietHoursDisplay(form.values.time, form.values.timezone, now)} + value={quietHoursDisplay( + browserLocale, + form.values.time, + form.values.timezone, + now, + )} />
diff --git a/site/src/utils/schedule.test.ts b/site/src/utils/schedule.test.ts index d873ec7b5b..cae8d3bda7 100644 --- a/site/src/utils/schedule.test.ts +++ b/site/src/utils/schedule.test.ts @@ -78,8 +78,9 @@ describe("util/schedule", () => { }); describe("quietHoursDisplay", () => { - it("midnight", () => { + it("midnight in Poland", () => { const quietHoursStart = quietHoursDisplay( + "pl", "00:00", "Australia/Sydney", new Date("2023-09-06T15:00:00.000+10:00"), @@ -89,8 +90,9 @@ describe("util/schedule", () => { "00:00 tomorrow (in 9 hours) in Australia/Sydney", ); }); - it("five o'clock today", () => { + it("five o'clock today in Sweden", () => { const quietHoursStart = quietHoursDisplay( + "sv", "17:00", "Europe/London", new Date("2023-09-06T15:00:00.000+10:00"), @@ -100,15 +102,28 @@ describe("util/schedule", () => { "17:00 today (in 11 hours) in Europe/London", ); }); - it("lunch tomorrow", () => { + it("five o'clock today in Finland", () => { const quietHoursStart = quietHoursDisplay( + "fl", + "17:00", + "Europe/London", + new Date("2023-09-06T15:00:00.000+10:00"), + ); + + expect(quietHoursStart).toBe( + "5:00 PM today (in 11 hours) in Europe/London", + ); + }); + it("lunch tomorrow in England", () => { + const quietHoursStart = quietHoursDisplay( + "en", "13:00", "US/Central", new Date("2023-09-06T08:00:00.000+10:00"), ); expect(quietHoursStart).toBe( - "13:00 tomorrow (in 20 hours) in US/Central", + "1:00 PM tomorrow (in 20 hours) in US/Central", ); }); }); diff --git a/site/src/utils/schedule.tsx b/site/src/utils/schedule.tsx index 2e7ee543e0..97479c021f 100644 --- a/site/src/utils/schedule.tsx +++ b/site/src/utils/schedule.tsx @@ -256,6 +256,7 @@ export const timeToCron = (time: string, tz?: string) => { }; export const quietHoursDisplay = ( + browserLocale: string, time: string, tz: string, now: Date | undefined, @@ -276,7 +277,14 @@ export const quietHoursDisplay = ( const today = dayjs(now).tz(tz); const day = dayjs(parsed.next().toDate()).tz(tz); - let display = day.format("HH:mm"); + + const formattedTime = new Intl.DateTimeFormat(browserLocale, { + hour: "numeric", + minute: "numeric", + timeZone: tz, + }).format(day.toDate()); + + let display = formattedTime; if (day.isSame(today, "day")) { display += " today";