fix: use app locale for datetime formatting instead of browser default

date displays across event details, docker info, job cards, and vuln
scans were calling toLocaleString() with no locale argument, which
ignores whatever language the user picked in the app and falls back to
the OS setting. route everything through formatDateTime/formatDateTimeShort
utilities backed by date-fns, which already picks up the paraglide
locale set via setDefaultOptions.

fixes #2349

Author: Giulio Savini

frontend/src/lib/components/dialogs/docker-info-dialog.svelte

@@ -7,6 +7,7 @@
 	import type { DockerInfo } from '$lib/types/docker-info.type';
 	import { m } from '$lib/paraglide/messages';
 	import bytes from '$lib/utils/bytes';
+	import { formatDateTimeShort } from '$lib/utils/locale.util';
 
 	interface Props {
 		open: boolean;
@@ -23,11 +24,7 @@
 
 	function formatTime(timeStr: string | undefined) {
 		if (!timeStr) return '-';
-		try {
-			return new Date(timeStr).toLocaleString();
-		} catch {
-			return timeStr;
-		}
+		return formatDateTimeShort(timeStr) || timeStr;
 	}
 </script>
 

frontend/src/lib/components/dialogs/event-details-dialog.svelte

@@ -7,6 +7,7 @@
 	import { m } from '$lib/paraglide/messages';
 	import { environmentStore, LOCAL_DOCKER_ENVIRONMENT_ID } from '$lib/stores/environment.store.svelte';
 	import { AlertIcon, InfoIcon, EnvironmentsIcon, UserIcon, ClockIcon } from '$lib/icons';
+	import { formatDateTime } from '$lib/utils/locale.util';
 
 	type Severity = 'success' | 'warning' | 'error' | 'info';
 
@@ -61,11 +62,7 @@
 	});
 
 	function formatDate(timestamp: string): string {
-		try {
-			return new Date(timestamp).toLocaleString();
-		} catch {
-			return timestamp;
-		}
+		return formatDateTime(timestamp) || timestamp;
 	}
 
 	function stringifyForDisplay(value: unknown): string {

frontend/src/lib/components/job-card/job-card.svelte

@@ -7,6 +7,7 @@
 	import { Spinner } from '$lib/components/ui/spinner';
 	import { jobScheduleService } from '$lib/services/job-schedule-service';
 	import { formatDistanceToNow } from 'date-fns';
+	import { formatDateTimeShort } from '$lib/utils/locale.util';
 	import type { Snippet } from 'svelte';
 	import type { JobStatus } from '$lib/types/job-schedule.type';
 	import JobScheduleDialog from './job-schedule-dialog.svelte';
@@ -40,7 +41,7 @@
 		if (!job.nextRun) return null;
 		const nextRunDate = new Date(job.nextRun);
 		const relative = formatDistanceToNow(nextRunDate, { addSuffix: true });
-		const absolute = nextRunDate.toLocaleString();
+		const absolute = formatDateTimeShort(nextRunDate);
 		return `${relative} (${absolute})`;
 	});
 

frontend/src/lib/components/vulnerability/vulnerability-scan-item.svelte

@@ -6,6 +6,7 @@
 	import { onDestroy } from 'svelte';
 	import type { VulnerabilityScanSummary } from '$lib/types/vulnerability.type';
 	import { m } from '$lib/paraglide/messages';
+	import { formatDateTime } from '$lib/utils/locale.util';
 	import { queryKeys } from '$lib/query/query-keys';
 	import { vulnerabilityService } from '$lib/services/vulnerability-service';
 	import {
@@ -83,7 +84,7 @@
 		if (!ts) return m.common_na();
 		const parsed = new Date(ts);
 		if (Number.isNaN(parsed.getTime())) return m.common_na();
-		return parsed.toLocaleTimeString();
+		return formatDateTime(parsed);
 	});
 
 	const statusLabel = $derived.by(() => {

frontend/src/lib/components/vulnerability/vulnerability-scan-panel.svelte

@@ -12,6 +12,7 @@
 	import type { VulnerabilityScanResult, Vulnerability as VulnType, SeveritySummary } from '$lib/types/vulnerability.type';
 	import type { Paginated, SearchPaginationSortRequest } from '$lib/types/pagination.type';
 	import { ShieldCheckIcon, ShieldAlertIcon, ShieldXIcon, ScanIcon, CodeIcon, CheckIcon } from '$lib/icons';
+	import { formatDateTime } from '$lib/utils/locale.util';
 	import { useQueryClient } from '@tanstack/svelte-query';
 
 	interface Props {
@@ -388,7 +389,7 @@
 			<Card.Title>{m.vuln_title()}</Card.Title>
 			<Card.Description>
 				{#if scan?.status === 'completed'}
-					{m.vuln_scan_time()}: {scan ? new Date(scan.scanTime).toLocaleString() : m.common_na()}
+					{m.vuln_scan_time()}: {scan ? formatDateTime(scan.scanTime) : m.common_na()}
 				{:else if isWorking}
 					{m.vuln_scanning()}
 				{:else}

frontend/src/lib/utils/locale.util.ts

@@ -1,7 +1,30 @@
 import { setLocale as setParaglideLocale, type Locale } from '$lib/paraglide/runtime';
-import { setDefaultOptions } from 'date-fns';
+import { format, setDefaultOptions } from 'date-fns';
 import { z } from 'zod/v4';
 
+/**
+ * Format a date/timestamp as a locale-aware datetime string.
+ * Uses date-fns which picks up the locale set by setLocale(), so it
+ * reflects the language the user has chosen in the app rather than
+ * defaulting to the browser's system locale.
+ */
+export function formatDateTime(date: Date | string | null | undefined): string {
+	if (!date) return '';
+	const d = typeof date === 'string' ? new Date(date) : date;
+	if (isNaN(d.getTime())) return '';
+	return format(d, 'PPpp');
+}
+
+/**
+ * Same as formatDateTime but omits seconds (PPp).
+ */
+export function formatDateTimeShort(date: Date | string | null | undefined): string {
+	if (!date) return '';
+	const d = typeof date === 'string' ? new Date(date) : date;
+	if (isNaN(d.getTime())) return '';
+	return format(d, 'PPp');
+}
+
 export async function setLocale(locale: Locale, reload = true) {
 	let dateFnsLocale: string = locale;
 	if (dateFnsLocale === 'en') {