bug - query results leaking, to other results while loading

[Maretzky85]

Do you want to request a feature or report a bug?

Bug

What is the current behaviour? Firestore When have multiple listeners set to same source, but with different queue i.e. /users stored as users sorted by date /users stored as usersNeededAssistance where users.assistance = true and changing i.e. limit in query leads to render usersNeededAssistance instead of users for a brief moment. In other words it seems to showing the other query results while loading updated query, and isLoading is not working returning always true except for first use.

In Firestore only. For Firebase it was working flawlessly.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via codesandbox or similar.

Current behaviour is self explanatory i believe.

Update - In first usage everything is working fine, but after refresh is broken - it seems to me, that old query is not closed, and is showing data between loading. When changing query data there is two @@reduxFirestore/LISTENER_RESPONSE instead of one.

What is the expected behavior? Working isLoading function, or just not mixed results ;)

Which versions of dependencies, and which browser and OS are affected by this issue? Did this work in previous versions or setups?

"firebase": "^8.1.2",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-redux": "^7.2.2",
"react-redux-firebase": "^3.8.1",
"react-scripts": "4.0.1",
"redux-devtools-extension": "^2.13.8",
"redux-firestore": "^0.14.0"

Checked in linux / apple, firefox/safari/chrome

[vykut]

I have the same problem, did you manage to solve it?

[prescottprue]

This is because of how things are stored in redux (just based on the name) Try using storeAs to store the data in a different location of your redux store, you can make this unique to your query, heres an example:

// someUid is a variable holding a user's uid
{
  collection: 'projects',
  where: ['createdBy', '==', someUid],
  storeAs: `${someUid}-projects`
}

In future versions of redux-firestore the plan is to have data in the store under a key which is unique to the query by default - since this drastically changes where data is located, there are also new utilities to help pull out of the store

[vykut]

Thanks for your reply. It's funny, because I was already doing what you just said and query results are still leaking. As @Maretzky85 said, this happens just once, during a single re-render and then it goes back to normal and I get the results I'm looking for. But it led to some crashes because for a brief moment I get multiple documents from a single doc query and this messed up the logic of the component.

[sorkinl]

@prescottprue I am having the same issue. It is not related to storeAs, but rather when setting up 2 firestoreConnect listeners on the same collection, the results from the second one will briefly appear and then get overwritten again. As an example:

In my app, I query a list of posts on the left side of the screen with firestoreConnect({collection:'posts', storeAs: "posts"}) inside the component A. In the component A, I change the limit of the query on scrolling down, in order to load more posts on scroll. On the right side however, I load a single document as follows firestoreConnect({collection: 'posts', doc: '*id*', storeAs: "singlePost"}) in order to have a single post selected. The latter query happens in component B. So when I load the page and have posts on the left and post on the right loaded, I scroll down and the results from firestore.ordered.singlePost briefly appear inside firestore.ordered.posts. I am not sure what is causing that, but the same thing happens even if I use regular firebase SDK and useonSnapshot(). I tried setting allowMultipleListeners:true in config, too. Am I doing something wrong? I would appreciate some help with figuring this out.