DataTable changes data in another row when you changes something in a row

[mstuij]

Describe the bug

I have a DataTable with a column chooser dialog.

When you select/unselect a column in the Chooser Dialog there will be at random times another column (so another row) checked/unchecked.

Reproducer

https://stackblitz.com/edit/vitejs-vite-hrpqxvre

System Information

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 20.19.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.8.2 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    primereact: latest => 10.9.5 
    react: ^19.1.0 => 19.1.0

Steps to reproduce the behavior

1. Click the column chooser dialog
2. In the column chooser dialog select or unselect columns

Expected behavior

You should expect that only the row where you click/unclick the column changes and not other rows

The problem is that see that there are cascading changes.

[acc-cassio]

@mstuij I find it hard to understand whether the problem origins from the implementation or from a primereact's bug because the reproducer is not trivial. Could you try to simplify it so we can help you better?

[thomaslow]

@mstuij I have the same problem in my project. The problem is related to the performance improvements in 10.9.5, see #7420. You can workaround this problem by updating to 10.9.6 and disabling memoization by adding cellMemo={false} to your DataTable component.

@acc-cassio I added a pull request that should fix the issue, see #8108.

[mstuij]

@thomaslow Thanks that solved the bug!

[yamafaktory]

For the record, the react prop gets spread into the DOM: React does not recognize the cellMemo prop on a DOM element. .

[thomaslow]

@yamafaktory This has been fixed last week, see #8120