Custom Hook

useHasLoader.ts

// Testable Custom Hooks
import { useEffect } from "react";

// Function that can be tested with clear API, easily unit-testable
const handleHasLoader = ({ isLoading, hasFocus, setHasLoader }) => {
  if (isLoading && !hasFocus) {
    return setHasLoader(true);
  }

  return setHasLoader(false);
};

// Custom Hook implementing effect
const useHasLoader = ({ isLoading, hasFocus, setHasLoader }) => {
  useEffect(
    () => 
      handleHasLoader({ isLoading, hasFocus, setHasLoader }),
    [isLoading, hasFocus, setHasLoader],
  );
};

export default useHasLoader;