4403e22006
Now that both server and client use the same locale from context, the post-hydration useEffect that re-formatted with the browser's OS locale was causing a visible flicker. Just render with the context locale directly. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
12 lines
357 B
TypeScript
12 lines
357 B
TypeScript
import { useLocale } from "./LocaleContext";
|
|
|
|
/**
|
|
* Renders a date formatted with the server-detected locale,
|
|
* ensuring SSR and client output match (no hydration flicker).
|
|
*/
|
|
export function ClientDate({ iso }: { iso: string }) {
|
|
const locale = useLocale();
|
|
return (
|
|
<time dateTime={iso}>{new Date(iso).toLocaleDateString(locale)}</time>
|
|
);
|
|
}
|