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.08k stars 1.26k forks source link

[data grid] `checkboxSelectionVisibleOnly` with server-side pagination doesn't select all items on the second page #14070

Closed Londeren closed 1 month ago

Londeren commented 1 month ago

Latest version

Steps to reproduce

Link to live example: https://stackblitz.com/edit/react-f1gyh1?file=Demo.tsx

<DataGridPro
  columns={columns}
  unstable_dataSource={dataSource}
  pagination
  initialState={initialStateWithPagination}
  pageSizeOptions={[10, 20, 50]}
  checkboxSelection
  checkboxSelectionVisibleOnly
/>

Steps:

  1. Select all items by clicking on the main (Select All) checkbox in the header
  2. Navigate to page 2 and click the same Select All checkbox

Current behavior

Only 1 item is selected on the second page.

Expected behavior

All items are selected on the second page.

Context

No response

Your environment

npx @mui/envinfo ``` Don't forget to mention which browser you used. Output from `npx @mui/envinfo` goes here. ```

Search keywords: checkboxSelectionVisibleOnly, pagination, checkboxSelection Order ID: 87418

michelengelen commented 1 month ago

Hey @Londeren I did assign this to @MBilalShafi who is our mastermind regarding the server-side integration! 👍🏼

MBilalShafi commented 1 month ago

Thank you @Londeren for reporting. I can reproduce this with the data source variant that you posted as well as the regular server-side pagination.

The culprit is the gridPaginatedVisibleSortedGridRowIdsSelector as it doesn't provide the correct sliced values when checkboxSelectionVisibleOnly prop is passed on a server-side paginated Data Grid.

I'll push a fix soon.

github-actions[bot] commented 1 month ago

:warning: This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

@Londeren: How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.