plugin-axios
plugin-axios copied to clipboard
API request result.entities contains records in a different order than they were returned from the server.
Describe the bug
This is more of a question but something that might be worth addressing. I have an API endpoint that returns a list of conversations. If I pass in a query string parameter "include_archived" it returns a full list of conversations (including those that have been archived). This endpoint always returns the conversations in order of time descending. It seems that the order of records in the 'entities' property of a request result does not always match the order of records returned from the server. This mainly happens when the server returns some new records and some that already exist in the store.
Steps to reproduce the bug
- Define models
- Create data
- Retrieve data from API that contains a few records (for example primary keys: 1, 4, and 5)
result = Conversation.api().get('/conversations')
- Retrieve data from API that contains records from above as well as some different ones (so for example primary keys: 1, 2, 3, 4, and 5)
result = Conversation.api().get('/conversations?include_archived=true')
- Observe that result.entities.conversations is not in the order 1, 2, 3, 4, 5.
- Also observe that result.response.data (returned from server) does have the order 1, 2, 3, 4, 5.
Expected behavior
It would be nice if result.entities could contain the records in the same order that they were returned from the server.
I can manually sort these after the fact but it would be more efficient if sorting could just be assumed since this is being used on an infinite scroll and sometimes users have hundreds of conversations being loaded into a single view.
Versions
- Vuex ORM Axios: 0.9.2
- Vuex ORM: 0.36.3
Thanks so much for your consideration.
@omanizer Yes, this is expected behavior at the moment. I understand your pain, but this is something to do with fondamental of Vuex ORM.
Because all the records are normalized and stored at the store, it's a bit hard to restore the original order of the records. Because entities
contains all of the same entities. For example, when you have response with post
with author
which is a user, and also post
has nested comments
and comment
also has nested author
. In this case, both post.author
and post.comments.author
will be merged as a same user (if they have same ID) as a users
key in entities
object.
In this case, we're not sure how we should order the final users
objects.
So the best practice when using Vuex ORM is that to not rely on response order but always query the local records separately using orderBy
query method. It's kinda feels like duplication, but it's most semantically correct way to do it.
However, I think it would be nice to somehow obtain the original order from the response. Not sure what is the best API, but I think this is worth discussing.