import { useEffect, useRef } from "react";

interface AnimationFrameCallback {
  (timeInfo: { time: number; delta: number }): void;
}

export default function useAnimationFrame(
  callback: AnimationFrameCallback,
  deps: React.DependencyList,
) {
  const frame = useRef<number>();
  const last = useRef<number>(performance.now());
  const init = useRef<number>(performance.now());

  const animate = () => {
    const now = performance.now();
    const time = now - init.current;
    const delta = now - last.current;

    callback({ time, delta });

    last.current = now;
    frame.current = requestAnimationFrame(animate);
  };

  useEffect(() => {
    frame.current = requestAnimationFrame(animate);
    return () => {
      if (frame.current) {
        cancelAnimationFrame(frame.current);
      }
    };
  }, deps);
}