[DataGridPro] Fix pinned columns in RTL mode #14586
Conversation
KenanYusuf
added
bug 🐛
| refs.fillerLeft = findGridElement( | ||
| apiRef.current, | ||
| isRtl ? 'filler--pinnedRight' : 'filler--pinnedLeft', | ||
| ); | ||
| refs.fillerRight = findGridElement( | ||
| apiRef.current, | ||
| isRtl ? 'filler--pinnedLeft' : 'filler--pinnedRight', | ||
| ); |
There was a problem hiding this comment.
Inverting these fixes an issue where pinned column viewport fillers were resizing the opposite sides:
Screen.Recording.2024-09-11.at.15.26.22.mov
| position: isRtl ? 'right' : 'left', | ||
| filterFn: (index) => (isRtl ? index < colIndex! : index > colIndex!), |
There was a problem hiding this comment.
Inverting the position and filter function fixes an issue where the other cells within the pinned columns were not being resized:
Screen.Recording.2024-09-11.at.16.07.32.mov
|
Deploy preview: https://deploy-preview-14586--material-ui-x.netlify.app/ |
| pinnedLeftLength: number, | ||
| ) { | ||
| const factor = isRtl ? -1 : 1; |
There was a problem hiding this comment.
I don't fully understand the purpose of this offset, but removing the factor fixes this additional space between right pinned cells and non-pinned cells:
cherniavskii
added
plan: Pro
cherniavskii
changed the title
There was a problem hiding this comment.
Nice, we clearly missed this in Argos 👍🏻
|
The issue of pinning columns in RTL mode has still not been resolved (#14586). If you install "@mui/x-data-grid-pro": "^7.20.0" cleanly, without remnants from previous versions, the problem persists |
Fixes #14245
Before: codesandbox
After: codesandbox
Note: Resizing left pinned columns in RTL mode has the same issue that LTR see on right pinned columns (#12852). This PR does not attempt to fix that, as there is already a PR in progress for this issue (#12979).