GovOPlaN/govoplan-scheduling
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(webui): use Core date-time formatting

Browse Source
This commit is contained in:
Albrecht Degering
2026-07-21 13:52:59 +02:00
parent 0452100242
commit 886579942f
1 changed files with 16 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
webui/src/features/scheduling/SchedulingPage.tsx
View File

@@ -18,6 +18,7 @@ import {
DataGridEmptyAction, DataGridEmptyAction,
DataGridRowActions, DataGridRowActions,
DateTimeField, DateTimeField,
formatDateTime,
ModuleSubnav, ModuleSubnav,
SelectionList, SelectionList,
SelectionListItem, SelectionListItem,
@@ -31,6 +32,7 @@ import {
type AuthInfo, type AuthInfo,
type CalendarPickerUiCapability, type CalendarPickerUiCapability,
type DataGridColumn, type DataGridColumn,
type FormatDateTimeOptions,
type ModuleSubnavGroup type ModuleSubnavGroup
} from "@govoplan/core-webui"; } from "@govoplan/core-webui";
import { import {
@@ -1064,8 +1066,8 @@ function CandidateSlotsGrid({
</span> </span>
) )
}, },
{ id: "start", header: I18N.start, minWidth: 160, resizable: true, value: (slot) => slot.start_at, render: (slot) => formatDateTime(slot.start_at) }, { id: "start", header: I18N.start, minWidth: 160, resizable: true, value: (slot) => slot.start_at, render: (slot) => formatDateTime(slot.start_at, SHORT_DATE_TIME_OPTIONS) },
{ id: "end", header: I18N.end, minWidth: 160, resizable: true, value: (slot) => slot.end_at, render: (slot) => formatDateTime(slot.end_at) }, { id: "end", header: I18N.end, minWidth: 160, resizable: true, value: (slot) => slot.end_at, render: (slot) => formatDateTime(slot.end_at, SHORT_DATE_TIME_OPTIONS) },
{ {
id: "available", id: "available",
header: I18N.available, header: I18N.available,
@@ -1235,17 +1237,24 @@ function isoFromLocal(value: string): string {
return new Date(value).toISOString(); return new Date(value).toISOString();
} }
function formatDateTime(value: string): string { const SHORT_DATE_TIME_OPTIONS: FormatDateTimeOptions = {
return new Intl.DateTimeFormat(undefined, { dateStyle: "short", timeStyle: "short" }).format(new Date(value)); year: undefined,
} month: undefined,
day: undefined,
hour: undefined,
minute: undefined,
timeZoneName: undefined,
dateStyle: "short",
timeStyle: "short"
};
function formatRange(start: string, end: string): string { function formatRange(start: string, end: string): string {
return `${formatDateTime(start)} – ${formatDateTime(end)}`; return `${formatDateTime(start, SHORT_DATE_TIME_OPTIONS)} – ${formatDateTime(end, SHORT_DATE_TIME_OPTIONS)}`;
} }
function formatRelevantDate(request: SchedulingRequest): string { function formatRelevantDate(request: SchedulingRequest): string {
const timestamp = schedulingRelevantTimestamp(request); const timestamp = schedulingRelevantTimestamp(request);
return Number.isFinite(timestamp) ? formatDateTime(new Date(timestamp).toISOString()) : ""; return Number.isFinite(timestamp) ? formatDateTime(new Date(timestamp).toISOString(), SHORT_DATE_TIME_OPTIONS) : "";
} }
function errorMessage(error: unknown, fallback: string): string { function errorMessage(error: unknown, fallback: string): string {