تشخیص اسکرول کاربر به انتهای div با React

      const divRef = useRef();

<div ref={divRef}>...</div>

    

      const isBottom = (el) => {
  return el.scrollHeight - el.scrollTop === el.clientHeight;
};

    

      import React, { useRef, useEffect } from "react";

const ScrollableDiv = () => {
  const divRef = useRef();

  const onScroll = () => {
    if (divRef.current) {
      const { scrollTop, scrollHeight, clientHeight } = divRef.current;
      if (scrollHeight - scrollTop === clientHeight) {
        console.log("به پایین div رسیدن");
        // انجام اقدام مورد نظر
      }
    }
  };

  useEffect(() => {
    const divElement = divRef.current;

    if (divElement) {
      divElement.addEventListener("scroll", onScroll);
      return () => {
        divElement.removeEventListener("scroll", onScroll);
      };
    }
  }, []);

  return (
    <div
      ref={divRef}
      style={{ height: "200px", overflowY: "scroll" }} // تنظیمات برای ایجاد اسکرول
    >
      {/* محتوای طولانی برای اسکرول */}
    </div>
  );
};

export default ScrollableDiv;