Check sticky with offset

useSticky.ts

import { useState, useEffect, Dispatch, SetStateAction } from "react";

interface UseStickyReturnType {
  isSticky: boolean;
  setIsSticky: Dispatch<SetStateAction<boolean>>;
}
/**
 * @description Check sticky with offset
 * @param offset
 * @example
 * const menuHeight = 50
 * const { isSticky } = useSticky(menuHeight)
 * @returns {UseStickyReturnType}
 */
const useSticky = (offset: number): UseStickyReturnType => {
  const [isSticky, setIsSticky] = useState(false);

  const handleScroll = () => {
    if (window.pageYOffset > offset) {
      setIsSticky(true);
    } else {
      setIsSticky(false);
    }
  };

  useEffect(() => {
    window.addEventListener("scroll", handleScroll);
    return window.addEventListener("scroll", handleScroll);
  }, []);

  return { isSticky, setIsSticky };
};

export default useSticky;