[question] Full CRUD example with column reordering

[bjornarvh]

The problem in depth

I have been trying to add functionality like the full CRUD example from your documentation, but this example does not keep the same reference on the columns property between renders which is required by the data grid. Because of this column order is reset when the grid is rendered. Is there a way to achieve the same result while keeping the column property reference?

Your environment

System:
OS: Linux 5.15 Ubuntu 22.04.2 LTS 22.04.2 LTS (Jammy Jellyfish)
Binaries:
Node: 22.7.0 - ~/.nvm/versions/node/v22.7.0/bin/node
npm: 10.8.2 - ~/.nvm/versions/node/v22.7.0/bin/npm
pnpm: 9.12.1 - ~/.local/share/pnpm/pnpm
Browsers:
Chrome: 109.0.5414.74
npmPackages:
@emotion/react: ^11.13.3 => 11.13.3
@emotion/styled: ^11.13.0 => 11.13.0
@mui/icons-material: ^6.1.4 => 6.1.4
@mui/lab: 6.0.0-beta.12 => 6.0.0-beta.12
@mui/material: ^6.1.4 => 6.1.4
@mui/utils: ^6.1.4 => 6.1.4
@mui/x-data-grid-pro: ^7.15.0 => 7.15.0
@mui/x-date-pickers-pro: ^7.20.0 => 7.20.0
@mui/x-license: ^7.20.0 => 7.20.0
@types/react: ^18.3.11 => 18.3.11
react: ^18.3.1 => 18.3.1
react-dom: ^18.3.1 => 18.3.1
typescript: ^5.6.3 => 5.6.3

Search keywords: crud column reordering
Order ID: 90083

[cherniavskii]

Hi @bjornarvh
This looks like a duplicate of #12429
Check out #12429 (comment) for a workaround.

I'll close this issue and use #12429 for tracking.