fix: pass explicit locale to date formatting to prevent hydration mismatch
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 41s

Server and client could use different default locales for
toLocaleDateString/toLocaleString, causing React hydration errors.
Pass the user locale explicitly in JobsList and SettingsPage.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-21 13:36:35 +01:00
parent caa9922ff9
commit be5c3f7a34
2 changed files with 3 additions and 3 deletions

View File

@@ -57,13 +57,13 @@ function getDateParts(dateStr: string): { mins: number; hours: number; useDate:
}
export function JobsList({ initialJobs, libraries, highlightJobId }: JobsListProps) {
const { t } = useTranslation();
const { t, locale } = useTranslation();
const [jobs, setJobs] = useState(initialJobs);
const formatDate = (dateStr: string): string => {
const parts = getDateParts(dateStr);
if (parts.useDate) {
return parts.date.toLocaleDateString();
return parts.date.toLocaleDateString(locale);
}
if (parts.mins < 1) return t("time.justNow");
if (parts.hours > 0) return t("time.hoursAgo", { count: parts.hours });

View File

@@ -734,7 +734,7 @@ export default function SettingsPage({ initialSettings, initialCacheStats, initi
>
<div className="flex items-center justify-between">
<span className="text-sm font-medium text-foreground">
{new Date(r.created_at).toLocaleString()}
{new Date(r.created_at).toLocaleString(locale)}
</span>
<span className="text-xs text-muted-foreground truncate ml-2" title={r.komga_url}>
{r.komga_url}