[BUG] - Table useInfiniteScroll hook fetches twice

[ynchen2829]

NextUI Version

2.4.1

Describe the bug

Following the example code for Infinite pagination in nextUI Table Infinite Scroll, the expected behavior is that when the page initially loads, fetch is performed once to load the initial page, however, loadMore from useAsyncList hook is called immediately after the initial load, causing the app to load not only one, but two pages.

This may not seem like a big deal, but in my customized software, when I call list.reload, this behavior rises concurrency issue and messes up the cursor.next, causing my Table to load the wrong page of data.

Your Example Website or App

codeSandboxLink

Steps to Reproduce the Bug or Issue

1. Go to sandbox
2. Run dev server
3. Inspect to see console.log statements, and two consecutive pages are fetched without being scrolled to the bottom.

Alternative:

1. Go to nextUI Table Infinite Scroll
2. Click preview
3. Notice that the initial load has 20 items instead of 10 (expected behavior), where each loadMore loads 10 more items

Expected behavior

Expected: Initial load calling load once Seeing: Initial load triggers load once and triggers loadMore without scrolling to bottom.

Screenshots or Videos

No response

Operating System Version

macOS

Browser

Chrome

[linear[bot]]

ENG-1009 [BUG] - Table useInfiniteScroll hook fetches twice

[abhisektomar1]

I am Working on it!