Description
merge
prop introduced in v1.9.0 is super great and makes infinity scroll almost out-of-the-box experience!
However merge
just give ability to accumulate data, but in some cases we need a bit more - we need to know what's inside the latest batch in order to consider if we should keep loading or not.
Use Case
Infinite loading over unknown amount of pages with non guaranteed items count per page. For example we would like to set skip: true
for a query when we know that latest batch had exactly 0 items.
Right now we can't achieve this as data in data
& currentData
props is accumulated data.
Proposal
The proposal is to repurpose currentData
for this case not to contain accumulated data, but only state of latest/current batch.
Or just introduce another prop which would hold this data (latestData
/latestBatch
or whatever you consider reasonable).
Example of what I would like to achieve:
const [hasMoreData, setHasMoreDataState] = useState(true);
const { data = [], latestBatch = [] } = api.useQuery(..., { skip: !hasMoreData });
useEffect(() => {
const mightHaveMore = latestBatch.length > 0;
setHasMoreDataState(mightHaveMore);
}, [latestBatch.length]);
Thank you!