[docs] Fix empty space issue in `PopularFeaturesDemo`

[k-rajat19]

• [x] I have followed (at least) the PR section of the contributing guide.

Closes #14989

Before: https://mui.com/x/react-data-grid/demo/ (space appears on zoom level 90% or less) After: https://deploy-preview-15000--material-ui-x.netlify.app/x/react-data-grid/demo/

[mui-bot]

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

Generated by :no_entry_sign: dangerJS against 9676b3eb1316a6015b8510aebdc3c2e75a401f49

[k-rajat19]

Hi @romgrk ,

There are 2 problems I have found : 1- floating point imprecision errors which I have fixed using Math.round().

by wrapping with Math.round() problem is partially fixed but there is still a glitch when I toggle a row or when the grid mounts and that is the second problem. A bit of context I have found for second problem: 2- I suspect that this problem arises due to lagging of main container height behind the currentPageTotalHeight on few initial calls of the update dimension method and due to which this Y scrolling condition becomes true. After few initial calls both heights are settled and we see the correct dimensions. I have tried to find out a way to fix that but it seems very complicated to find out the exact reason for lagging. is there any way we can solve this ?

Note : this demo works fine for v6 and other lower version because then we are using autoHeight and in case of autoHeight we completely assuming that there is no scrolling on Y so no problem occurs. (https://github.com/mui/mui-x/pull/14614/files#diff-218f2b76b9274e420335d97176eab776351ba42e296a8e7e3cce3b5158e53ec5R515-R526).

[cherniavskii]

I suspect that this problem arises due to lagging of main container height behind the currentPageTotalHeight on few initial calls

I think this is the nature of the flex parent container approach – the data grid height grows to match the size of the content.

I thought that flex parent container effectively eliminates the need for autoHeight and I deprecated it. But it looks like the flex parent container is not perfect either. 🤔

[github-actions[bot]]

This pull request has been inactive for 30 days. Please remove the stale label or leave a comment to keep it open. Otherwise, it will be closed in 15 days.

[github-actions[bot]]

This pull request has been closed due to 15 days of inactivity after being marked stale.