[DataGridPro] Fix pinned columns order in column management

[alisasanib]

Fixes #17889

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

The column management section was not respecting order of pinned columns when users were changing visibility of columns. As a result this user interaction led to change in the order of the columns in column panel.

This fix ensures column management section keeps the same order as the pinned columns in the grid.

[github-actions]

Thanks for adding a type label to the PR! 👍

[mui-bot]

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

Bundle size report

Total Size Change:^{${\tiny{\color{red}▲}}$}+56B^(0.00%) - Total Gzip Change:^{${\tiny{\color{red}▲}}$}+116B^(0.00%)
Files: 118 total (0 added, 0 removed, 6 changed)

Show 6 more bundle changes

@mui/x-data-grid parsed:^{${\tiny{\color{red}▲}}$}+33B^(+0.01%) gzip:^{${\tiny{\color{red}▲}}$}+27B^(+0.02%)
@mui/x-data-grid/DataGrid parsed:^{${\tiny{\color{red}▲}}$}+33B^(+0.01%) gzip:^{${\tiny{\color{red}▲}}$}+20B^(+0.02%)
@mui/x-data-grid-premium parsed:^{${\tiny{\color{green}▼}}$}-3B^(0.00%) gzip:^{${\tiny{\color{red}▲}}$}+17B^(+0.01%)
@mui/x-data-grid-pro parsed:^{${\tiny{\color{green}▼}}$}-3B^(0.00%) gzip: 0B^(0.00%)
@mui/x-data-grid-premium/DataGridPremium parsed:^{${\tiny{\color{green}▼}}$}-2B^(0.00%) gzip:^{${\tiny{\color{red}▲}}$}+16B^(+0.01%)
@mui/x-data-grid-pro/DataGridPro parsed:^{${\tiny{\color{green}▼}}$}-2B^(0.00%) gzip:^{${\tiny{\color{red}▲}}$}+36B^(+0.03%)

Details of bundle changes

Generated by 🚫 dangerJS against bd1c94e

[arminmeh]

Hi @alisasanib
Thank you for this pull request!

Your changes seem to impact the commercially licensed code. For any changes of this nature, we require contributors to sign the MUI’s Contributor License Agreement (CLA). However, I can’t find a CLA signed that could cover these changes.

Please follow the steps at mui-org.notion.site/CLA-Contributor-License-Agreement-92ece655b1584b10b00e4de9e67eedb0 to sign the document.

[alisasanib]

Hi @alisasanib Thank you for this pull request!

Your changes seem to impact the commercially licensed code. For any changes of this nature, we require contributors to sign the MUI’s Contributor License Agreement (CLA). However, I can’t find a CLA signed that could cover these changes.

Please follow the steps at mui-org.notion.site/CLA-Contributor-License-Agreement-92ece655b1584b10b00e4de9e67eedb0 to sign the document.

@arminmeh Done! I just forwarded the confirmation email to [email protected]

[zannager]

@arminmeh CLA signed, thanks.

[arminmeh]

@alisasanib I have checked and updated your PR

• Instead of changing the selector, I have changed the way pinning pre-processor works. It includes hidden columns now in the ordered columns state
• I have changed one of the tests to cover the pinning state updates. Reset button goes through the same flow as the click on an item, so I think that we don't need that one anymore.

Since I have also made a change I would ask someone else from @mui/xgrid to approve this.

[MBilalShafi]

LGTM, thank you @alisasanib and @arminmeh for the fix.

[github-actions]

Cherry-pick PRs will be created targeting branches: v7.x