React useTimeout hook (by Chris Bongers)

react-useTimeout.hook.js

// From <https://dev.to/dailydevtips1/react-cleaner-use-of-settimeout-105m>
import { useCallback, useEffect, useRef, useMemo } from 'react';

/**
 * To use the hook
 * ```
 * import useTimeout from './useTimeout';
 *
 * const [timeout] = useTimeout(() => {
 *  setShow(false);
 * }, 1500);
 * 
 * timeout();
 * ```
 */
export default function useTimeout(callback, delay) {
  const timeoutRef = useRef();
  const callbackRef = useRef(callback);

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

  useEffect(() => {
    return () => window.clearTimeout(timeoutRef.current);
  }, []);

  const memoizedCallback = useCallback(
    (args) => {
      if (timeoutRef.current) {
        window.clearTimeout(timeoutRef.current);
      }
      timeoutRef.current = window.setTimeout(() => {
        timeoutRef.current = null;
        callbackRef.current?.(args);
      }, delay);
    },
    [delay, timeoutRef, callbackRef]
  );

  return useMemo(() => [memoizedCallback], [memoizedCallback]);
}