diff --git a/src/components/infinite-scroll/InfiniteScroll.tsx b/src/components/infinite-scroll/InfiniteScroll.tsx index 92745d5..8d22a86 100644 --- a/src/components/infinite-scroll/InfiniteScroll.tsx +++ b/src/components/infinite-scroll/InfiniteScroll.tsx @@ -20,6 +20,11 @@ export const InfiniteScroll = ({ const observerTarget = useRef(null) + useEffect(() => { + setItems([]) + setPage(0) + }, [getDataFunc]) + useEffect(() => { if ( !observerTarget.current || @@ -31,14 +36,18 @@ export const InfiniteScroll = ({ const fetchData = async () => { setIsLoading(true) - const data = await getDataFunc(page, itemsPerPage) + try { + const data = await getDataFunc(page, itemsPerPage) - if (data && data.length > 0) { - setPage((prevPage) => prevPage + 1) - setItems((prevItems) => [...prevItems, ...data]) + if (data && data.length > 0) { + setPage((prevPage) => prevPage + 1) + setItems((prevItems) => [...prevItems, ...data]) + } + } catch (error) { + console.error('Error fetching data:', error) + } finally { + setIsLoading(false) } - - setIsLoading(false) } const target = observerTarget.current