Blame · elapsed-time.tsx

a011f1e	1	"use client";
a011f1e	2
a011f1e	3	import { useState, useEffect } from "react";
a011f1e	4
a011f1e	5	function format(ms: number): string {
a011f1e	6	if (ms < 1000) return "<1s";
a011f1e	7	const s = Math.floor(ms / 1000);
a011f1e	8	if (s < 60) return `${s}s`;
a011f1e	9	const m = Math.floor(s / 60);
a011f1e	10	const rem = s % 60;
a011f1e	11	return rem > 0 ? `${m}m ${rem}s` : `${m}m`;
a011f1e	12	}
a011f1e	13
a011f1e	14	function parseDate(dateStr: string): number {
a011f1e	15	const normalized = dateStr.endsWith("Z") \|\| dateStr.includes("+") \|\| dateStr.includes("T")
a011f1e	16	? dateStr
a011f1e	17	: dateStr + "Z";
a011f1e	18	return new Date(normalized).getTime();
a011f1e	19	}
a011f1e	20
a011f1e	21	export function ElapsedTime({ since }: { since: string }) {
9d879c0	22	const [elapsed, setElapsed] = useState<number \| null>(null);
a011f1e	23
a011f1e	24	useEffect(() => {
9d879c0	25	const update = () => {
a011f1e	26	setElapsed(Math.max(0, Date.now() - parseDate(since)));
9d879c0	27	};
9d879c0	28	update();
9d879c0	29	const interval = setInterval(() => {
9d879c0	30	update();
a011f1e	31	}, 1000);
a011f1e	32	return () => clearInterval(interval);
a011f1e	33	}, [since]);
a011f1e	34
9d879c0	35	if (elapsed === null) return <>--</>;
a011f1e	36	return <>{format(elapsed)}</>;
a011f1e	37	}