React hook useFadeIn

useFadeIn.ts

import { useEffect, useState } from "react";

/**
 * Trigger animation after component mounts with a slight delay for dramatic effect
 *
 * @param delay - The delay in milliseconds
 * @returns A boolean indicating whether the element is visible
 */
function useFadeIn(delay) {
  const [isVisible, setIsVisible] = useState(false);

  useEffect(() => {
    const timer = setTimeout(() => setIsVisible(true), delay);
    return () => clearTimeout(timer);
  }, [delay]);

  return isVisible;
}