redux-firestore icon indicating copy to clipboard operation
redux-firestore copied to clipboard

endBefore not working as expected

Open TrySpace opened this issue 4 years ago • 1 comments

What is the current behavior? Getting to the next pages as described here works: https://www.seedcode.com/paginating-firestore-queries-with-document-snapshot-cursors-and-react-redux-firebase/

Except when I try it with endBefore and provide: getSnapshotByObject(items[0]), after navigating 3 pages away it returns the same as the initial query, so it does not select the correct "page".

What is the expected behavior? I'd expect the previous page to be queried, not 3 pages back. I guess technically it 'ends' 'before' the selected snapshot, but it cuts of the result by the limit, but that's not what I want.

Which version of redux-firestore are you using? What about other dependencies? "redux-firestore": "^0.15.0",

Minimal code to reproduce issue


  const posts =  useSelector(({ firestore: { ordered } }: RootState) => ordered[`posts/postsById`])

  const [startCursor, setStartCursor] = useState(null)
  const [endCursor, setEndCursor] = useState(null)

  const nextPage = () => {
    setEndCursor(null)
    setStartCursor(getSnapshotByObject(posts[posts.length - 1]))
  }

  const prevPage = () => {
    setStartCursor(null)
    setEndCursor(getSnapshotByObject(posts[0]))
  }

  const listsQuery: ReduxFirestoreQuerySetting = {
    collection: 'postsById',
    limit,
    orderBy: orderByQuery,
    where: whereQuery,
    storeAs: 'posts/postsById',
    ...(startCursor && { startAfter: startCursor }),
    ...(endCursor && { endBefore: endCursor })  
  }

TrySpace avatar May 21 '21 10:05 TrySpace

Trying this as suggested here: https://morioh.com/p/b287c3c0ee1f Returns all the previously queried items instead of the expected 3... I'm really at a loss here...


const limit = 3;

const listsQuery: ReduxFirestoreQuerySetting = {
    collection: 'postsById',
    ...(!firstCursor && {
      limit,
    }),
    orderBy: orderByQuery,
    where: whereQuery,
    storeAs: 'posts/postsById',
    ...(startCursor && {
      startAfter: startCursor,
      limit,
    }),
    ...(endCursor && {
      endBefore: endCursor,
      limitToLast: limit,
    })
}

I really don't understand how it is returning everything from, let's call it "page 1", to the last page I was on then... so after I had done nextPage 3x, and then tried prevPage it will return 9 items, instead of 3.

I would expect limitToLast to limit it to the last 3??

TrySpace avatar May 21 '21 11:05 TrySpace