import { useEffect, useRef, useState } from "react";

// type Control = {
//   start: () => void;
//   stop: () => void;
// };

// type State = 'RUNNING' | 'STOPPED';

// type Fn = () => void;

export const useInterval = (fn, interval, autostart = true) => {
  const onUpdateRef = useRef();
  const [state, setState] = useState("RUNNING");
  const start = () => {
    setState("RUNNING");
  };
  const stop = () => {
    setState("STOPPED");
  };
  useEffect(() => {
    onUpdateRef.current = fn;
  }, [fn]);
  useEffect(() => {
    if (autostart) {
      setState("RUNNING");
    }
  }, [autostart]);
  useEffect(() => {
    let timerId;
    if (state === "RUNNING") {
      timerId = setInterval(() => {
        onUpdateRef.current?.();
      }, interval);
    } else {
      timerId && clearInterval(timerId);
    }
    return () => {
      timerId && clearInterval(timerId);
    };
  }, [interval, state]);
  return [state, { start, stop }];
};

export default useInterval;