'use client';
 
import { useEffect, useState } from 'react';
 
export interface Elapsed {
  /** Whole seconds since the run started. */
  seconds: number;
  /** `12s`, `1m 04s`, or `1h 02m`, for labels like Thought for 12s. */
  label: string;
}
 
export function formatElapsed(seconds: number): string {
  if (seconds < 60) return `${seconds}s`;
  const minutes = Math.floor(seconds / 60);
  if (minutes < 60) return `${minutes}m ${String(seconds % 60).padStart(2, '0')}s`;
  return `${Math.floor(minutes / 60)}h ${String(minutes % 60).padStart(2, '0')}m`;
}
 
/**
 * Counts seconds while `running` is true and holds the final value once it
 * turns false, so the same number can read "Thinking 8s" and then "Thought
 * for 8s". Starting again resets the count.
 */
export function useElapsed(running: boolean): Elapsed {
  const [seconds, setSeconds] = useState(0);
 
  useEffect(() => {
    if (!running) return;