useDebounceEffect.ts

export function useDebounceEffect(
  effect: React.EffectCallback,
  delay = 500,
  deps?: React.DependencyList | undefined,
) {
  useEffect(() => {
    const debounce = setTimeout(() => {
      effect();
    }, delay);
    return () => clearTimeout(debounce);
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [delay, ...(deps || [])]);
}