From dd24b9fce6653427e9278a9f8dfffe130d68e3a3 Mon Sep 17 00:00:00 2001 From: Tegan Churchill Date: Wed, 6 May 2026 08:37:40 -0700 Subject: [PATCH 1/3] refactor(DT-3906): migrate schedule view components to Svelte 5 runes MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Migrates the 4 schedule view components — same pattern across all four: - schedule/schedule-day-of-month-view.svelte - schedule/schedule-day-of-week-view.svelte - schedule/schedules-interval-view.svelte - schedule/schedules-time-view.svelte Carved out of #3370 to make the migration PR easier to review. --- .../schedule-day-of-month-view.svelte | 20 +++++++++---- .../schedule/schedule-day-of-week-view.svelte | 17 ++++++++--- .../schedule/schedules-interval-view.svelte | 28 +++++++++++++------ .../schedule/schedules-time-view.svelte | 19 +++++++++---- 4 files changed, 61 insertions(+), 23 deletions(-) diff --git a/src/lib/components/schedule/schedule-day-of-month-view.svelte b/src/lib/components/schedule/schedule-day-of-month-view.svelte index 3731bb6b04..abb81672be 100644 --- a/src/lib/components/schedule/schedule-day-of-month-view.svelte +++ b/src/lib/components/schedule/schedule-day-of-month-view.svelte @@ -5,11 +5,21 @@ import SchedulesTimeView from './schedules-time-view.svelte'; - export let daysOfMonth: number[]; - export let months: string[]; - export let hour: string; - export let minute: string; - export let timezoneName: string; + type Props = { + daysOfMonth: number[]; + months: string[]; + hour: string; + minute: string; + timezoneName: string; + }; + + let { + daysOfMonth = $bindable(), + months = $bindable(), + hour = $bindable(), + minute = $bindable(), + timezoneName, + }: Props = $props();
diff --git a/src/lib/components/schedule/schedule-day-of-week-view.svelte b/src/lib/components/schedule/schedule-day-of-week-view.svelte index 03c296009e..911310a5c0 100644 --- a/src/lib/components/schedule/schedule-day-of-week-view.svelte +++ b/src/lib/components/schedule/schedule-day-of-week-view.svelte @@ -4,10 +4,19 @@ import SchedulesTimeView from './schedules-time-view.svelte'; - export let daysOfWeek: string[]; - export let hour: string; - export let minute: string; - export let timezoneName: string; + type Props = { + daysOfWeek: string[]; + hour: string; + minute: string; + timezoneName: string; + }; + + let { + daysOfWeek = $bindable(), + hour = $bindable(), + minute = $bindable(), + timezoneName, + }: Props = $props();
diff --git a/src/lib/components/schedule/schedules-interval-view.svelte b/src/lib/components/schedule/schedules-interval-view.svelte index d4f06a0172..dafd154046 100644 --- a/src/lib/components/schedule/schedules-interval-view.svelte +++ b/src/lib/components/schedule/schedules-interval-view.svelte @@ -5,21 +5,31 @@ import { translate } from '$lib/i18n/translate'; import type { ScheduleOffsetUnit } from '$lib/types/schedule'; - export let days = ''; - export let hour = ''; - export let minute = ''; - export let second = ''; - export let phase = ''; + type Props = { + days?: string; + hour?: string; + minute?: string; + second?: string; + phase?: string; + }; + + let { + days = $bindable(''), + hour = $bindable(''), + minute = $bindable(''), + second = $bindable(''), + phase = $bindable(''), + }: Props = $props(); - let offset = ''; - let offsetUnit: ScheduleOffsetUnit = 'min'; + let offset = $state(''); + let offsetUnit = $state('min'); const error = (x: string) => { if (x) return isNaN(parseInt(x)); return false; }; - $: { + $effect(() => { if (offset) { if (offsetUnit === 'days') { phase = (parseInt(offset) * 60 * 60 * 24).toString() + 's'; @@ -31,7 +41,7 @@ phase = parseInt(offset).toString() + 's'; } } - } + });
diff --git a/src/lib/components/schedule/schedules-time-view.svelte b/src/lib/components/schedule/schedules-time-view.svelte index c0b3837dc1..39202cef27 100644 --- a/src/lib/components/schedule/schedules-time-view.svelte +++ b/src/lib/components/schedule/schedules-time-view.svelte @@ -3,14 +3,23 @@ import TimePicker from '$lib/holocene/time-picker.svelte'; import { translate } from '$lib/i18n/translate'; - export let hour = ''; - export let minute = ''; - export let timezoneName: string; + type Props = { + hour?: string; + minute?: string; + timezoneName: string; + }; - $: timezoneHint = + let { + hour = $bindable(''), + minute = $bindable(''), + timezoneName, + }: Props = $props(); + + const timezoneHint = $derived( timezoneName.toLowerCase() === 'utc' ? 'Universal Standard Time (UTC)' - : timezoneName; + : timezoneName, + );
From 9a61b882ad53ab46336faeb19d44d5a4563c73a2 Mon Sep 17 00:00:00 2001 From: Tegan Churchill Date: Thu, 7 May 2026 11:24:44 -0700 Subject: [PATCH 2/3] Apply suggestions from code review Co-authored-by: Laura Whitaker --- src/lib/components/schedule/schedule-day-of-month-view.svelte | 2 +- src/lib/components/schedule/schedule-day-of-week-view.svelte | 2 +- src/lib/components/schedule/schedules-interval-view.svelte | 2 +- src/lib/components/schedule/schedules-time-view.svelte | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/lib/components/schedule/schedule-day-of-month-view.svelte b/src/lib/components/schedule/schedule-day-of-month-view.svelte index abb81672be..e424424a7d 100644 --- a/src/lib/components/schedule/schedule-day-of-month-view.svelte +++ b/src/lib/components/schedule/schedule-day-of-month-view.svelte @@ -5,7 +5,7 @@ import SchedulesTimeView from './schedules-time-view.svelte'; - type Props = { + interface Props { daysOfMonth: number[]; months: string[]; hour: string; diff --git a/src/lib/components/schedule/schedule-day-of-week-view.svelte b/src/lib/components/schedule/schedule-day-of-week-view.svelte index 911310a5c0..9ad002409b 100644 --- a/src/lib/components/schedule/schedule-day-of-week-view.svelte +++ b/src/lib/components/schedule/schedule-day-of-week-view.svelte @@ -4,7 +4,7 @@ import SchedulesTimeView from './schedules-time-view.svelte'; - type Props = { + interface Props { daysOfWeek: string[]; hour: string; minute: string; diff --git a/src/lib/components/schedule/schedules-interval-view.svelte b/src/lib/components/schedule/schedules-interval-view.svelte index dafd154046..ca008241a0 100644 --- a/src/lib/components/schedule/schedules-interval-view.svelte +++ b/src/lib/components/schedule/schedules-interval-view.svelte @@ -5,7 +5,7 @@ import { translate } from '$lib/i18n/translate'; import type { ScheduleOffsetUnit } from '$lib/types/schedule'; - type Props = { + interface Props { days?: string; hour?: string; minute?: string; diff --git a/src/lib/components/schedule/schedules-time-view.svelte b/src/lib/components/schedule/schedules-time-view.svelte index 39202cef27..48e1ded8b6 100644 --- a/src/lib/components/schedule/schedules-time-view.svelte +++ b/src/lib/components/schedule/schedules-time-view.svelte @@ -3,7 +3,7 @@ import TimePicker from '$lib/holocene/time-picker.svelte'; import { translate } from '$lib/i18n/translate'; - type Props = { + interface Props { hour?: string; minute?: string; timezoneName: string; From 6a66860155010f2dab98c19a6f8437600e62968b Mon Sep 17 00:00:00 2001 From: Tegan Churchill Date: Thu, 7 May 2026 11:38:13 -0700 Subject: [PATCH 3/3] Prettier --- src/lib/components/schedule/schedule-day-of-month-view.svelte | 2 +- src/lib/components/schedule/schedule-day-of-week-view.svelte | 2 +- src/lib/components/schedule/schedules-interval-view.svelte | 2 +- src/lib/components/schedule/schedules-time-view.svelte | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/lib/components/schedule/schedule-day-of-month-view.svelte b/src/lib/components/schedule/schedule-day-of-month-view.svelte index e424424a7d..3c77340926 100644 --- a/src/lib/components/schedule/schedule-day-of-month-view.svelte +++ b/src/lib/components/schedule/schedule-day-of-month-view.svelte @@ -11,7 +11,7 @@ hour: string; minute: string; timezoneName: string; - }; + } let { daysOfMonth = $bindable(), diff --git a/src/lib/components/schedule/schedule-day-of-week-view.svelte b/src/lib/components/schedule/schedule-day-of-week-view.svelte index 9ad002409b..c6278ad966 100644 --- a/src/lib/components/schedule/schedule-day-of-week-view.svelte +++ b/src/lib/components/schedule/schedule-day-of-week-view.svelte @@ -9,7 +9,7 @@ hour: string; minute: string; timezoneName: string; - }; + } let { daysOfWeek = $bindable(), diff --git a/src/lib/components/schedule/schedules-interval-view.svelte b/src/lib/components/schedule/schedules-interval-view.svelte index ca008241a0..4cd01d9534 100644 --- a/src/lib/components/schedule/schedules-interval-view.svelte +++ b/src/lib/components/schedule/schedules-interval-view.svelte @@ -11,7 +11,7 @@ minute?: string; second?: string; phase?: string; - }; + } let { days = $bindable(''), diff --git a/src/lib/components/schedule/schedules-time-view.svelte b/src/lib/components/schedule/schedules-time-view.svelte index 48e1ded8b6..fcb1dd3dfb 100644 --- a/src/lib/components/schedule/schedules-time-view.svelte +++ b/src/lib/components/schedule/schedules-time-view.svelte @@ -7,7 +7,7 @@ hour?: string; minute?: string; timezoneName: string; - }; + } let { hour = $bindable(''),