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.14k stars 1.29k forks source link

[data grid] Pinned columns are broken in RTL mode (re-opening) #14953

Open ranpaz opened 3 days ago

ranpaz commented 3 days ago

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. Could you please check and fix this?

Search keywords: pinned columns in RTL mode

cherniavskii commented 3 days ago

Can you provide a reproduction example? I don't see any issues with column pinning in RTL in our docs: https://mui.com/x/react-data-grid/column-pinning/#initializing-the-pinned-columns

https://github.com/user-attachments/assets/2b342d7e-b52c-4951-a905-f5e48bddcc7f

ranpaz commented 3 days ago

The bug appears after installing DataGrid without any remnants of previous versions

dir = "rtl

  1. npm install @mui/x-data-grid-pro
  2. Deleting the node_modules folder
  3. npm install
cherniavskii commented 3 days ago

Can't reproduce: https://stackblitz.com/edit/react-fh2m51

ranpaz commented 2 days ago

It seems like we’re working in different environments. I’m using Vite, and I noticed something interesting: when I install DataGrid version 6.19 and then upgrade to 7.20, everything works fine. However, if I delete the node_modules and package-lock.json and reinstall, it stops working. This suggests that there might be a dependency issue or something else specific to the environment that breaks during a clean install.

ranpaz commented 1 day ago

It seems like we’re working in different environments. I’m using Vite, and I noticed something interesting: when I install DataGrid version 6.19 and then upgrade to 7.20, everything works fine. However, if I delete the node_modules and package-lock.json and reinstall, it stops working. This suggests that there might be a dependency issue or something else specific to the environment that breaks during a clean install.

I also want to mention that I ran this test with the code provided by your team. I believe that if this bug is not addressed, users who install only version 7.20 directly may encounter this issue. I kindly request your feedback on this matter.

MBilalShafi commented 1 day ago

@ranpaz Could you provide a live reproduction test case (codesandbox/stackblitz or a git repo) since we have no luck reproducing the issue, even after following the mentioned steps. We could unfortunately not assist much unless the issue has been reproduced.

You could follow this guide to ease the process of reproduction: https://mui.com/x/introduction/support/#bug-reproductions

Thank you!

ranpaz commented 1 day ago

Thank you for your response.

I am unable to reproduce the bug in codeSandbox. I'm not entirely sure which versions the system there is using, but when I run the code you provided as an example "https://stackblitz.com/edit/react-fh2m51" on my local machine and follow these steps:

  1. Run npm install @mui/x-data-grid-pro@7.20
  2. Delete the node_modules folder
  3. Delete the package-lock.json file — this is important. Did you delete this file as well?
  4. Run npm install again After following all these steps, in RTL mode, I encountered issues with column pinning and resizing.

This suggests that anyone installing only version 7.20 without previous versions may experience these problems. This is particularly important for me because my system is deployed on AWS, and with each deployment, the files are rebuilt based on the package.json file, without any remnants from previous versions.

Thank :)

ranpaz commented 15 hours ago

this is my package.json:

"@emotion/cache": "^11.13.1",
"@emotion/react": "^11.13.3",
"@emotion/styled": "^11.13.0",
"@mui/icons-material": "^5.16.6",
"@mui/lab": "^5.0.0-alpha.173",
"@mui/material": "^5.16.6",
"@mui/x-data-grid-pro": "^7.20.0",
"@mui/x-date-pickers": "^7.20.0",
"@mui/x-license": "^7.20.0",