badgateway/react-ketting

useInfiniteCollection first page items returned after refreshOnStale incorrect, duplicate data

BeckyPollard opened this issue · 0 comments

Summary of issue:

When returning items after a refresh of data, the items are combination of old state and new state, instead of only the updated data.

Theory is that when the first (or only) page of the collection items is being updated, the base collection isn't being cleared before adding the updated page items resulting in a duplicate set of data.

In the visual example below, an update of one additional item is made on the useInfiniteCollection items, the length of that array should then grom from 1 to 2 but since the base collection isn't being cleared the new items result is being appended to the outdated result and the length is 3, the first entry being the old state.

Screen Shot 2022-06-10 at 11 56 04 AM

Sample of useInfiniteCollection context:

const { items, loading, hasNextPage, loadNextPage } = useInfiniteCollection(
  merchantResource.follow('transaction-collection', searchParams),
  { refreshOnStale: true },
);