search

mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.56k stars 1.33k forks source link

[data grid] TanStack Query integration demos #14227

Open oliviertassinari opened 3 months ago

oliviertassinari commented 3 months ago

Summary

I'm creating this issue to get a sense of the developer traction for having TanStack Query demos for data fetching with the grid. Seeing this tweet https://x.com/ericclemmons/status/1823108565285941266 and this chart https://npm-stat.com/charts.html?package=react-dom,@tanstack/react-query could suggest that there is an audience.

Examples

MBilalShafi commented 3 months ago

We do have one in the tree-data custom caching section but one with lazy-loading/infinite loading should be interesting. 👍

CC @arminmeh

oliviertassinari commented 3 months ago

Interesting, I was thinking of having a dedicated TanStack Query set of examples, kind of an Integration doc, and having the rest of the demos more barebone, showing the raw concepts.

Maybe the ideal would be to support in docs-infra different variants of the demos. Like people could select between "Raw" and "TanStack Query" for all of those demos.

arminmeh commented 1 month ago

I looked briefly into it and I it seems that is better to have a separate integration page, since there is a lot of overlap between TanStack Query and our own data source (especially after lazy loading is merged).

For both you provide a way to fetch the data and your UI is updated automatically. The additional thing that out data source has is the knowledge how to track the changes of the filter/sort/pagination models and adjust request params accordingly.

My point is, by using TanStack Query there is not much data source adds to it, so it does not feel that this is a data source specific example