Make UI language, timestamps and live feedback consistent

src/lib/ui/match-history.ts

@@ -1,3 +1,4 @@
+import { createTimeFormatter } from '../time-zone.js';
 import { serverIdentity } from './server-labels.js';
 import type { ServerMatch } from '../match-history.js';
 
@@ -8,19 +9,7 @@ export function matchInstanceLabel(match: ServerMatch): string {
     return parts.filter(Boolean).join(' · ') || match.server;
 }
 
-/** Compare calendar days in the display timezone, including DST boundaries. */
+/** Shared history formatting; exact timestamps belong in the time element tooltip. */
 export function matchStartedLabel(value: string, zone: string, now = new Date()): string {
-    const date = new Date(/Z$|[+-]\d\d:\d\d$/.test(value) ? value : value.replace(' ', 'T') + 'Z');
-    if (!Number.isFinite(date.getTime())) return '—';
-    const parts = new Intl.DateTimeFormat('en-US', { timeZone: zone, year: 'numeric', month: 'numeric', day: 'numeric' });
-    const day = (input: Date) => {
-        const values = Object.fromEntries(parts.formatToParts(input).map(part => [part.type, part.value]));
-        return Date.UTC(Number(values.year), Number(values.month) - 1, Number(values.day));
-    };
-    const difference = day(now) - day(date);
-    const dateLabel = difference === 0 ? 'Today' : difference === 86400000 ? 'Yesterday'
-        : new Intl.DateTimeFormat('en-US', { timeZone: zone, month: 'short', day: 'numeric',
-            ...(parts.formatToParts(now).find(p => p.type === 'year')?.value !== parts.formatToParts(date).find(p => p.type === 'year')?.value ? { year: 'numeric' as const } : {}) }).format(date);
-    const clock = new Intl.DateTimeFormat('en-US', { timeZone: zone, hour: 'numeric', minute: '2-digit' }).format(date);
-    return `${dateLabel}, ${clock}`;
+    return createTimeFormatter(zone).relative(value, now.getTime());
 }