On disableColumnResize the SVG icon is still visible

[aashay28]

Duplicates

• [x] I have searched the existing issues

Latest version

• [X] I have tested the latest version

Steps to reproduce 🕹

While using disableColumnResize the SVG icon must hide.

<DataGridPro
rows={UsersData}
columns={columns}
checkboxSelection
disableColumnResize
/>

Right now user feels like, the columns are resizable.

Current behavior 😯

On disableColumnResize the SVG icon is still visible

Expected behavior 🤔

On disableColumnResize the SVG icon get hidden

Context 🔦

No response

Your environment 🌎

No response

Order ID or Support key 💳 (optional)

No response

[MBilalShafi]

We show header separator in disabled state on hover to let user be aware of the boundaries of a column, you can hide this by targeting gridClasses.columnSeparator.

<DataGridPremium
  rows={rows}
  columns={columns}
  disableColumnResize
  sx={{
    [`.${gridClasses.columnSeparator} svg`]: {
      visibility: "hidden"
    }
  }}
/>

Does this serve your need?

[aashay28]

@MBilalShafi Yes absolutely correct, but i think the column separator must be hidden when the disableColumnResize option is used.

[MBilalShafi]

Thanks for the recommendation, we are already exploring this topic at https://github.com/mui/mui-x/issues/7268 and you are most welcome to check it out and share your opinion there. Regarding the current ticket, since you have a workaround for your problem, I'll close this.