bug(reducers): subcollection orderBy ordered array not correctly sorted after update

[jollyBaker]

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

bug

What is the current behavior?

Updating a field of a document in a subcollection, does update correctly the value of the document but not the array sorting. Refreshing returns the correct sorted array.

What is the expected behavior?

The array should be sorted correctly to the current values of the documents in the subcollection.

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

 "firebase": "^5.3.0",
 "react-redux": "^5.0.7",
 "react-redux-firebase": "^2.1.6",
 "redux-firestore": "^0.5.7"

browser independant

Steps to reproduce and if possible a minimal demo of the problem via codesandbox or similar.

Not sure, another issue might be related to this issue, but I will show the code for my specific problem.

firestore index is created for the query:

participants | points DESC wins DESC quotient DESC

connect listeners:

firestoreConnect((props) => [
    {
      collection: 'tournaments',
      doc: props.tournamentId,
      subcollections: [{ collection: 'participants' }],
      orderBy: [['points', 'desc'],['wins', 'desc'],['quotient', 'desc']],
      storeAs: 'participants' + props.tournamentId }
  ]),
 connect(
    ({ firestore }, props) =>  ({
        participants: firestore.ordered['participants' + props.tournamentId],
      )
    }
  )

If for example points are updated, the points are changed correctly in the array but the array is not correctly sorted due to the update. But participants are correctly sorted after each refresh/tab switch of the component.

There could be an easy solution for my problem, which I am currently cannot find or my expected behavior isn't implemented yet.

Thanks for help!

[kledk]

Also having this issue.

[prescottprue]

There have been a number of issues reported relating to how subcollections are stored. To address these, I have started the v1.0.0 Roadmap doc which includes notes about the current plans for the new state pattern.

This new state pattern should make it relatively easy to debug issues like this.

[geminiyellow]

oh, please fix it, thank you sir.

[nazar-kuznetsov]

Please fix it.

[Wgil]

@prescottprue

Is

connect(({ firestore }) =>  ({
  somethingOrdered: Object.values(firestore.data.something).filter(Boolean)
}))

a valid workaround for this? filter(Boolean) is required in order to delete the null values preserved, preserveOnDelete doesn't seem to be working for me.

[Anne-Anq]

Hi @prescottprue,

In one listener response where I get a collection (ordered, filtered with a where and stored as something) I get:

• some duplicate values in firestore.ordered.
• some missing values in firestore.ordered. I get the same number of documents in firestore.ordered and in firestore.data, but firestore.ordered does not contain all the docs that are in firestore.data and it also contains some doubles. It is not a duplicate listener since that comes in only one listener response.

I believe this could be related to that issue.

[prescottprue]

@Anne-Anq are you able to provide an example to reproduce the issue your are describing? It sounds similar, but it is interesting to hear that there are some duplicate docs, initially I assumed the issue was just not correctly re-ordering.

The issue discussed here seems like it may be similar to https://github.com/prescottprue/redux-firestore/issues/230, which was fixed by a recent update. That said, apparently when using an array in orderBy, things are still not working as expected

[Anne-Anq]

I was wrong, I am not using orderBy in this case.

This is my listener: listenEvents: ({ firestore, teamId }) => date => { firestore.setListener({ collection: Team.collection, doc: teamId, subcollections: [{ collection: 'events' }], where: ['END_TIME', '>=', date], storeAs: 'events' }) }

I am using "redux-firestore": "^0.7.0"

I am not sure how to help you replicate it, because we are using similar listeners and firestore.ordered in other places that work just fine.

Also the issue is there on first load: the first listener response is wrong as explained before, but if I change a document, in some cases, the document_modified changes the modified doc in firestore.ordered AND adds another one.

Is it the first time you here about that kind of issue? Let me know if there is anything in particular that you think would be helpful I shared

[prescottprue]

@Anne-Anq Can you try updating to 0.9.0 and see if you still experience the issue? This seems similar to #230 and #239, so I want to make sure we get to the bottom of it. Thanks to all for reporting

[Baileypollard]

I am still having this issue on v0.12

@prescottprue

[edo]

Hi, just wanted to note that to me this issue is there in the latest versions of redux-firestore (0.13.0), but maybe a bit more complex than that the order is simply messed up. In fact, besides errors in reordering, I even see duplication of objects in the array occuring. So the ordered array currently is AFAIK not safe to use.

Steps to reproduce:

• I have a numerical indexValue in all the docs that I query. index is 1 here.

• I use orderBy Asc, but this issue is also there with desc:

• When I first load or refresh the page, the ordered array is in the correct order.

Note that this specific node with title "General ways ...." is in index 54

• When I update the indexValue in a specific doc, the order of the array updates accordingly In this case, all the indexes are at value 1. And I change the value of this index to 0. This array item, then is 'sent' to the start of the array:

• When I update the indexValue of that specific doc again, that doc is duplicated in the array, and shows up twice:

The array length however, is consistent. So something probably has been overwritten.

When I refresh the page again, everything works perfectly fine again. So somewhere in the updating of documents, the orderby function, doesn't sort the array properly.

Workaround As an (ugly) work-around, I now use the unordered data object, which I turn into an array, and then sort accordingly:

const nodes = useSelector((state) => state.firestore.data.nodes)
let orderedNodes = Object.keys(nodes).map(key => nodes[key]).sort((v1, v2) => v1.index - v2.index);

It's far from ideal, as I would like to use the ordered data provided by Firestore and not order client-side, but it fixes my issue for now.