public/owltide
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages 1 Wiki Activity Actions

Explicitly set locale to avoid hydration mismatch

Browse source 
Some functions in luxon default to the system's locale while other
functions default to "en-US".  Explicitly set the locale everywhere
the luxon objects are created to avoid possible mismatches and
unexpected behaviour should the system's locale be different.
This commit is contained in:
Hornwitser 2025-05-25 23:32:50 +02:00
parent e722876aae
commit ed67982ec0
5 changed files with 31 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

22
components/ShiftScheduleTable.vue
View file

@ -432,12 +432,12 @@ const newShiftStart = ref("");
const newShiftDuration = ref("01:00");
const newShiftEnd = computed({
get: () => (
DateTime.fromISO(newShiftStart.value, { zone: accountStore.activeTimezone })
.plus(Duration.fromISOTime(newShiftDuration.value))
DateTime.fromISO(newShiftStart.value, { zone: accountStore.activeTimezone, locale: "en-US" })
.plus(Duration.fromISOTime(newShiftDuration.value, { locale: "en-US" }))
.toFormat("HH:mm")
),
set: (value: string) => {
const start = DateTime.fromISO(newShiftStart.value, { zone: accountStore.activeTimezone });
const start = DateTime.fromISO(newShiftStart.value, { zone: accountStore.activeTimezone, locale: "en-US" });
const end = endFromTime(start, value);
newShiftDuration.value = dropDay(end.diff(start)).toFormat("hh:mm");
},
@ -448,16 +448,16 @@ watch(() => props.role, () => {
});
function endFromTime(start: DateTime, time: string) {
let end = start.startOf("day").plus(Duration.fromISOTime(time));
let end = start.startOf("day").plus(Duration.fromISOTime(time, { locale: "en-US" }));
if (end.toMillis() <= start.toMillis()) {
end = end.plus({ days: 1 });
}
return end;
}
function durationFromTime(time: string) {
let duration = Duration.fromISOTime(time);
let duration = Duration.fromISOTime(time, { locale: "en-US" });
if (duration.toMillis() === 0) {
duration = Duration.fromMillis(oneDayMs);
duration = Duration.fromMillis(oneDayMs, { locale: "en-US" });
}
return duration;
}
@ -474,7 +474,7 @@ function editShiftSlot(
}
) {
if (edits.start) {
const start = DateTime.fromISO(edits.start, { zone: accountStore.activeTimezone });
const start = DateTime.fromISO(edits.start, { zone: accountStore.activeTimezone, locale: "en-US" });
shiftSlot = {
...shiftSlot,
start,
@ -554,7 +554,7 @@ function newShiftSlot(options: { start?: DateTime, end?: DateTime } = {}) {
end = options.end;
start = options.end.minus(duration);
} else {
start = DateTime.fromISO(newShiftStart.value, { zone: accountStore.activeTimezone });
start = DateTime.fromISO(newShiftStart.value, { zone: accountStore.activeTimezone, locale: "en-US" });
end = endFromTime(start, newShiftEnd.value);
}
if (!start.isValid || !end.isValid) {
@ -617,8 +617,8 @@ const shiftSlots = computed(() => {
role: shift.role,
assigned: slot.assigned ?? [],
origRole: shift.role,
start: DateTime.fromISO(slot.start, { zone: accountStore.activeTimezone }),
end: DateTime.fromISO(slot.end, { zone: accountStore.activeTimezone }),
start: DateTime.fromISO(slot.start, { zone: accountStore.activeTimezone, locale: "en-US" }),
end: DateTime.fromISO(slot.end, { zone: accountStore.activeTimezone, locale: "en-US" }),
});
}
}
@ -634,7 +634,7 @@ const shiftSlots = computed(() => {
gaps.push([index, {
type: "gap",
role: props.role,
start: DateTime.fromMillis(maxEnd),
start: DateTime.fromMillis(maxEnd, { locale: "en-US" }),
end: second.start,
}]);
}