interface AvailabilityPredictionProps {
  // Pass lastonline_at as a prop — earlier this component re-queried Prisma
  // for the same field that the parent page already has on the user row,
  // adding a Postgres RTT per profile view.
  lastOnlineAt: Date | string | null | undefined;
}

export default function AvailabilityPrediction({ lastOnlineAt }: AvailabilityPredictionProps) {
  if (!lastOnlineAt) return null;

  const lastOnline = new Date(lastOnlineAt);
  const hour = lastOnline.getHours();

  const formattedHour = new Date(0, 0, 0, hour).toLocaleTimeString("en-US", {
    hour: "numeric",
    hour12: true,
  });

  return (
    <div className="flex items-center gap-2 text-xs text-text-muted">
      <svg
        className="w-3.5 h-3.5 text-gold/60"
        fill="none"
        stroke="currentColor"
        viewBox="0 0 24 24"
      >
        <path
          strokeLinecap="round"
          strokeLinejoin="round"
          strokeWidth={2}
          d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
        />
      </svg>
      <span>Usually online around {formattedHour}</span>
    </div>
  );
}