jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-09-18 16:05:33 -04:00
Code Issues Activity

move some non-post pages to mdx

Browse Source
This commit is contained in:
Jake Jarvis
2025-03-07 11:53:23 -05:00
parent 8118b8501a
commit 354dade9aa
72 changed files with 811 additions and 1873 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components/RelativeTime/RelativeTime.tsx
View File

@@ -1,22 +1,22 @@
"use client";
import useHasMounted from "../../hooks/useHasMounted";
import { useHasMounted } from "../../hooks";
import { formatDate, formatTimeAgo } from "../../lib/helpers/format-date";
import type { ComponentPropsWithoutRef } from "react";
export type RelativeTimeProps = {
export type RelativeTimeProps = ComponentPropsWithoutRef<"time"> & {
date: string | number | Date;
verb?: string; // optional "Updated", "Published", "Created", etc.
staticFormat?: string; // format for the placeholder/fallback before client-side renders the relative time
className?: string;
};
const RelativeTime = ({ date, verb, staticFormat, className }: RelativeTimeProps) => {
const RelativeTime = ({ date, verb, staticFormat, ...rest }: RelativeTimeProps) => {
// play nice with SSR -- only use relative time on the client, since it'll quickly become outdated on the server and
// cause a react hydration mismatch error.
const hasMounted = useHasMounted();
return (
<time dateTime={formatDate(date)} title={formatDate(date, "MMM D, YYYY, h:mm A z")} className={className}>
<time dateTime={formatDate(date)} title={formatDate(date, "MMM D, YYYY, h:mm A z")} {...rest}>
{verb && `${verb} `}
{hasMounted ? formatTimeAgo(date, { suffix: true }) : `on ${formatDate(date, staticFormat)}`}
</time>