fp/packages/next/app/components/localized-date.tsx

26 lines
637 B
TypeScript

import { formatISO } from "date-fns";
interface ILocalizedDateProps {
date: Date;
}
/**
*
* this causes hydration issues
*
* Error: Text content does not match server-rendered HTML.
*
* Warning: Text content did not match. Server: "2024-01-01" Client: "2023-12-31"
*
* See more info here: https://nextjs.org/docs/messages/react-hydration-error
*/
export function LocalizedDate ({ date }: ILocalizedDateProps) {
const isoDateTime = formatISO(date);
const isoDate = formatISO(date, { representation: 'date' });
return (
<>
<time dateTime={isoDateTime}>{isoDate}</time>
</>
)
}