mui
[DataGridPremium] Reorder grouped rows
Resolves #7775
Preview: https://deploy-preview-18251--material-ui-x.netlify.app/x/react-data-grid/row-grouping/
To Do
- [ ] Add tests
- [ ] Test with aggregation + row grouping and other edge cases
- [ ] Review server-side aspect
- [ ] UX improvements
- [ ] Improve types
- [ ] Improve documentation
Deploy preview: https://deploy-preview-18251--material-ui-x.netlify.app/
Updated pages:
- docs/data/data-grid/row-grouping/row-grouping.md
- docs/data/data-grid/row-ordering/row-ordering.md
- docs/data/data-grid/server-side-data/row-grouping.md
Bundle size report
| Bundle | Parsed size | Gzip size |
|---|---|---|
| @mui/x-data-grid | 🔺+301B(+0.05%) | 🔺+156B(+0.08%) |
| @mui/x-data-grid-pro | 🔺+1.15KB(+0.16%) | 🔺+399B(+0.18%) |
| @mui/x-data-grid-premium | 🔺+15KB(+1.77%) | 🔺+4.76KB(+1.88%) |
| @mui/x-charts | 0B(0.00%) | 0B(0.00%) |
| @mui/x-charts-pro | 0B(0.00%) | 0B(0.00%) |
| @mui/x-date-pickers | 0B(0.00%) | 0B(0.00%) |
| @mui/x-date-pickers-pro | 0B(0.00%) | 0B(0.00%) |
| @mui/x-tree-view | 0B(0.00%) | 0B(0.00%) |
| @mui/x-tree-view-pro | 0B(0.00%) | 0B(0.00%) |
Generated by :no_entry_sign: dangerJS against 218558e9e0595996740a532cfc4b8c763e26345d
This pull request has conflicts, please resolve those before we can evaluate the pull request.
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
@mui/xgrid Opening for review, the functionality is almost done, just finishing up some documenation related changes. Feel free to start reviewing. I'll be adding a summary about the changes soon too.
Does it make sense to hide the reorder column if it's not supported, like with sort applied etc.?
I think that disabling it (like it is now) is pretty good. Removing the column would make the columns jump on repeatedly clicking on the column header of some column (changing sorting)
This pull request has conflicts, please resolve those before we can evaluate the pull request.
This pull request has conflicts, please resolve those before we can evaluate the pull request.
This pull request has conflicts, please resolve those before we can evaluate the pull request.
Great work @MBilalShafi 💯 I found a small issue when trying to drag a row from the bottom of the grid. It might be due to some other element ending the drag event prematurely.
https://github.com/user-attachments/assets/98a57768-8bb5-47fa-83e5-3ada73164ae7
I found a small issue when trying to drag a row from the bottom of the grid. It might be due to some other element ending the drag event prematurely.
The issue is also visible here: https://mui.com/x/react-data-grid/row-ordering/#implementing-row-reordering
It's reproduced in combination of the setting "When scrolling" in "Show scroll bars" setting.
The scrollbar div overflows on the last cell and prevents the hover to work below that.
~~I'll open~~ Opened a separate issue for this.