useDelayLoading

useDelayLoading

import { useEffect, useRef, useState } from 'react';

const useDelayLoading = (isLoading: boolean, delay = 1500): boolean => {
  const [loading, setLoading] = useState(false);
  const timerRef = useRef<number>();

  useEffect(() => {
    const timer = timerRef.current;
    if (isLoading) {
      timerRef.current = setTimeout(() => {
        setLoading(true);
      }, delay) as unknown as number;
    } else {
      if (timer !== null) {
        clearTimeout(timer);
      }
      setLoading(false);
    }
    return () => {
      if (timer !== null) {
        clearTimeout(timer);
      }
    };
  }, [delay, isLoading]);
  return loading;
};

export default useDelayLoading;