[DataGrid] Always refetch lazy-loading rows

[MBilalShafi]

Related to #16719 (comment)
Pre-requisite for #16045, should ensure proper data integrity after an edit operation has been done in a lazy-loaded Data Grid.

Update

Previously, lazy-loaded data was never re-fetched, even in cases where:

• The data was not cached.
• The cache had expired.

Now, lazy loading attempts to fetch fresh data when the viewport is scrolled. If the data is already cached and valid, it's retrieved from the almost instant cache. However, if the data is missing or the cache has expired, the fresh data will be retrieved.

Todos

• Add skeleton rows for off-viewport rows

Follow-up

• Add dynamic data demo

[mui-bot]

Deploy preview: https://deploy-preview-16827--material-ui-x.netlify.app/

Generated by 🚫 dangerJS against 6b3d7f3

[github-actions]

Thanks for adding a type label to the PR! 👍

[arminmeh]

https://deploy-preview-16827--material-ui-x.netlify.app/x/react-data-grid/server-side-data/lazy-loading/#updating-the-loading-mode

If you load additional pages and start switching row count demo will have a runtime error
(if you can't reproduce I can make a video)

[arminmeh]

You can see skeleton rows on fast scroll which degrades UX.

Is it possible to keep the rows and fetch new data to refresh them?
loading state can be delayed a bit so that it shows up if you are actually waiting for the request to be resolved?

This will open up more cases for duplicate row id, but we can always check for that before applying update

Compare experience after loading all rows and scrolling fast
https://next.mui.com/x/react-data-grid/server-side-data/lazy-loading/#infinite-loading
https://deploy-preview-16827--material-ui-x.netlify.app/x/react-data-grid/server-side-data/lazy-loading/#infinite-loading

Also, I think that https://next.mui.com/x/react-data-grid/server-side-data/lazy-loading/#request-throttling needs to be skipped for already loaded rows, so that cache can be loaded faster