diff --git a/.changeset/six-bats-look.md b/.changeset/six-bats-look.md new file mode 100644 index 0000000000..19e0988611 --- /dev/null +++ b/.changeset/six-bats-look.md @@ -0,0 +1,5 @@ +--- +"@medusajs/dashboard": patch +--- + +Update problematic dependency array of InfiniteList useEffect to avoid infinite loop. diff --git a/packages/admin/dashboard/src/components/common/infinite-list/infinite-list.tsx b/packages/admin/dashboard/src/components/common/infinite-list/infinite-list.tsx index c2a7cf0740..4e1b8e93de 100644 --- a/packages/admin/dashboard/src/components/common/infinite-list/infinite-list.tsx +++ b/packages/admin/dashboard/src/components/common/infinite-list/infinite-list.tsx @@ -65,6 +65,13 @@ export const InfiniteList = < const parentRef = useRef(null) const startObserver = useRef() const endObserver = useRef() + const fetchNextPageRef = useRef(fetchNextPage) + const fetchPreviousPageRef = useRef(fetchPreviousPage) + + useEffect(() => { + fetchNextPageRef.current = fetchNextPage + fetchPreviousPageRef.current = fetchPreviousPage + }, [fetchNextPage, fetchPreviousPage]) useEffect(() => { if (isPending) { @@ -78,7 +85,7 @@ export const InfiniteList = < (entries) => { if (entries[0].isIntersecting && hasPreviousPage) { startObserver.current?.disconnect() - fetchPreviousPage() + fetchPreviousPageRef.current() } }, { @@ -90,7 +97,7 @@ export const InfiniteList = < (entries) => { if (entries[0].isIntersecting && hasNextPage) { endObserver.current?.disconnect() - fetchNextPage() + fetchNextPageRef.current() } }, { @@ -113,8 +120,6 @@ export const InfiniteList = < endObserver.current?.disconnect() } }, [ - fetchNextPage, - fetchPreviousPage, hasNextPage, hasPreviousPage, isFetching,