@servicetitan/assist-ui/lib/components/infinite-content/hooks/use-infinite-scroll.js

ServiceTitan Atlas UI Components

import { useCallback, useEffect, useRef } from 'react';
export const useInfiniteScroll = ({ hasMore, isLoading, onLoadMore, rootMargin = '100px', threshold = 0.1 })=>{
    const sentinelRef = useRef(null);
    const handleIntersection = useCallback((entries)=>{
        const [entry] = entries;
        if (entry.isIntersecting && hasMore && !isLoading) {
            onLoadMore();
        }
    }, [
        hasMore,
        isLoading,
        onLoadMore
    ]);
    useEffect(()=>{
        const sentinel = sentinelRef.current;
        if (!sentinel) {
            return;
        }
        const observer = new IntersectionObserver(handleIntersection, {
            rootMargin,
            threshold
        });
        observer.observe(sentinel);
        return ()=>{
            observer.unobserve(sentinel);
            observer.disconnect();
        };
    }, [
        handleIntersection,
        rootMargin,
        threshold
    ]);
    return {
        sentinelRef
    };
};

//# sourceMappingURL=use-infinite-scroll.js.map