import { useMemo } from 'react';

import { useEffect } from 'react';

import { useRef } from 'react';

function debounce(fn, wait) {

  let timer;

  return function (...args) {

    if (timer) {

      clearTimeout(timer);

    }

    timer = setTimeout(() => fn(...args), wait);

  };

}

export function useDebounce(callback) {

  const ref = useRef;

  useEffect(() => {

    ref.current = callback;

  }, [callback]);

  const debouncedCallback = useMemo(() => {

    const func = () => {

      ref.current?.();

    };

    return debounce(func, 1000);

  }, []);

  return debouncedCallback;

}