use-hook-kits/src/useDebounce.js

  

import { useCallback, useEffect, useRef, useState } from 'react';
import useDebouncedCallback from './useDebounceCallback';

function valueEquality(left,right) {
  return left === right;
}
//{ maxWait?: number; leading?: boolean; trailing?: boolean; equalityFn?: (left: T, right: T) => boolean }
export default function useDebounce(
  value,
  delay,
  options
) {
  const eq = options && options.equalityFn ? options.equalityFn : valueEquality;

  const [state, dispatch] = useState(value);
  const [callback, cancel, callPending] = useDebouncedCallback(
    useCallback((value) => dispatch(value), []),
    delay,
    options
  );
  const previousValue = useRef(value);

  useEffect(() => {
    // We need to use this condition otherwise we will run debounce timer for the first render (including maxWait option)
    if (!eq(previousValue.current, value)) {
      callback(value);
      previousValue.current = value;
    }
  }, [value, callback, eq]);

  return [state, cancel, callPending];
}