ConrabOpto / mst-query

Query library for mobx-state-tree
MIT License
109 stars 7 forks source link

Data prop not updating for pagination #72

Open krisbot01 opened 5 days ago

krisbot01 commented 5 days ago

I am using the same setup as the example from the README with these query options:

{
  pagination: { skip: skip, take: 10 },
  enabled: true,
  refetchOnChanged: "pagination"
}

When I update skip the endpoint gets called, the data received and the models map of the model-store gets updated but the data of the query remains the same. Replacing pagination with request gives me the update but that overwrites the data completely.

I've been digging through the source code and it looks like the intention is for the data to merge at some point close to the prepareData call but I am not sure where it goes wrong.

For now I'll try to get a workaround running but this seems to be a case that is not part of the tests either.

Edit: I ended up on this workaround added to the modelStore.

.views((self) => ({
  get data() {
    return Array.from(self.models.values())
  }
}))
k-ode commented 2 days ago

Thanks for raising this issue. I'm aiming to cut a proper release and update the documentation soon.

A new function, onQueryMore, has been introduced, which allows you to attach a listener to a query that's triggered whenever more data is fetched. There's no default behavior for adding data because it's unclear whether you prefer to append or prepend the data to your list.

export const ItemListQuery = createQuery('ItemListQuery', {
    data: t.model({
        items: t.array(ItemModel),
    }),
    pagination: t.model({
        skip: 0,
    }),
}).actions((self) => ({
    afterCreate() {
        onQueryMore(self, (data) => {
            self.data.items.push(...data.items);
        });
    },
}));