Почему функция в кастомном хуке странно работает?

Всем привет. Я пытаюсь сделать кастомный хук, который добавляет динамическую пагинацию компоненте. И, вроде как, все более менее получается, но, есть проблема. Почему-то при достижении низа страницы функция, которая добавляет +1 к номеру страницы, из-за чего запускается useEffect с запросом на сервер, вызывается 3 раза. Кроме этого, когда ставишь точку остановы в месте вызова setCurrentPage(p => p + 1), то сам currentPage при этом равен 1, сколько бы раз не вызывался этот сеттер. При этом, при вызове функции запроса номера страниц правильные.

const useDynamicPagination = (getFunction, totalCount, startPage = 1, limit = 10) => {
    const [isFetching, setIsFetching] = useState(false);
    const [currentPage, setCurrentPage] = useState(startPage);
    const [pagesCount, setPagesCount] = useState(1000);

    useEffect(() => {
        const fetchData = async () => {
            setIsFetching(true);
            // Функция, выполняющая запрос
            await getFunction(currentPage, limit);
            setIsFetching(false);
            setPagesCount(Math.ceil(totalCount / limit));
        }
        fetchData();
    }, [currentPage, limit, setIsFetching, setPagesCount])

    useEffect(() => {
        document.addEventListener('scroll', scrollHandler);

        return () => {
            document.removeEventListener('scroll', scrollHandler)
        };
    }, []);

    const scrollHandler = (e) => {
        const scrollPosition = e.target.documentElement.scrollHeight - (e.target.documentElement.scrollTop + window.innerHeight);
        if (scrollPosition < 100 && currentPage < pagesCount) {
            setCurrentPage(p => p + 1);
        }
    }

    return {isFetching};
}

Я еще подумал, что есть вот такой вариант.

const useDynamicPagination = (getFunction, totalCount, startPage = 1, limit = 10) => {
const [isFetching, setIsFetching] = useState(true);
const [currentPage, setCurrentPage] = useState(startPage);
const [pagesCount, setPagesCount] = useState(1000);

useEffect(() => {
    const fetchData = async () => {
        // setIsFetching(true);
        if (isFetching) {
            await getFunction(currentPage, limit);
            setCurrentPage(p => p + 1)
        }
        setIsFetching(false);
        // setPagesCount(Math.ceil(totalCount / limit));
    }
    fetchData();
}, [isFetching, limit, setIsFetching, setPagesCount])

useEffect(() => {
    document.addEventListener('scroll', scrollHandler);

    return () => {
        document.removeEventListener('scroll', scrollHandler)
    };
}, []);

const scrollHandler = (e) => {
    const scrollPosition = e.target.documentElement.scrollHeight - (e.target.documentElement.scrollTop + window.innerHeight);
    if (scrollPosition < 100 && currentPage < pagesCount) {
        setIsFetching(true);
        // setCurrentPage(p => p + 1);
    }
}

return {isFetching};}

Но мне не очень нравится, что здесь запрос запускается при изменении isFetching. Не знаю, это как-то странно, что ли? Мб , я и не прав. + из зависимостей useEffect нужно убрать currentPage, хотя он там используется. Что скажете по второму варианту?