[React] useTimeout hook

use.timeout.ts

import { useState, useEffect } from 'react';

export type TimeoutOptions = {
  initial: number;
  auto?: boolean;
  interval?: number;
  onFinish?: () => void;
};

export const useTimeout = (options?: TimeoutOptions) => {
  const { initial = 10_000, interval = 1000, onFinish } = options ?? {};
  const [time, setTime] = useState(initial);
  const [isRunning, setIsRunning] = useState(false);

  useEffect(() => {
    if (!isRunning) return;
    if (time <= 0) return finish();
    const timer = setTimeout(() => {
      setTime(prevTime => prevTime - interval);
    }, interval);
    return () => clearTimeout(timer);
  }, [isRunning, time, interval]);

  const finish = () => {
    onFinish?.();
    setIsRunning(false);
  };

  const start = (startAt = time) => {
    setTime(startAt);
    setIsRunning(true);
  };

  const resume = () => time && setIsRunning(true);
  const stop = () => setIsRunning(false);

  const reset = () => {
    setTime(initial);
    setIsRunning(false);
  };

  const restart = () => start(initial);

  return { time, isRunning, start, stop, resume, restart, reset };
};