import { useEffect, useState } from "react";
import { formatDistanceToNow } from "@/lib/time-utils";

const TICK_MS = 30_000;

interface RelativeTimestampProps {
  date: Date;
}

/**
 * Displays a relative timestamp (e.g. "5m ago") that auto-refreshes every 30s.
 */
export function RelativeTimestamp({ date }: RelativeTimestampProps) {
  const [, setTick] = useState(0);

  useEffect(() => {
    const id = setInterval(() => setTick((t) => t + 1), TICK_MS);
    return () => clearInterval(id);
  }, []);

  return <>{formatDistanceToNow(date.toISOString())}</>;
}