Simple debounce hook

package.json

{
  "name": "use-debounce",
  "version": "1.0.0",
  "main": "useDebounce.ts"
}

useDebounce.ts

import type { DependencyList } from "react";
import { useEffect, useRef } from "react";

export default function useDebounce(
  fn: () => void,
  ms = 0,
  deps: DependencyList = []
): void {
  const timeout = useRef<ReturnType<typeof setTimeout>>();
  const callback = useRef(fn);

  // doesn't need to useCallback, not ref checked
  function reset() {
    clearTimeout(timeout.current);
    timeout.current = setTimeout(() => {
      callback.current();
    }, ms);
  }

  useEffect(() => {
    callback.current = fn;
  }, [fn]);

  useEffect(() => {
    reset();
    return () => clearTimeout(timeout.current);
  }, [ms]);

  useEffect(reset, deps);
}