Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[data grid] useGridRootProps should only be used inside the DataGrid, DataGridPro or DataGridPremium component #13227

Closed
tteris opened this issue May 23, 2024 · 3 comments
Labels
component: data grid This is the name of the generic UI component, not the React module! feature: Pagination Related to the data grid Pagination feature support: premium standard Support request from a Premium standard plan user. https://mui.com/legal/technical-support-sla/

Comments

@tteris
Copy link

tteris commented May 23, 2024

Steps to reproduce

hi just bought the annual premium package of mui-x and followed the instructions on change the import to the new packages

import {
  DataGridPremium,
  GridToolbar,
  GridToolbarContainer,
  GridToolbarExport,
  GridToolbarColumnsButton,
  GridToolbarFilterButton,
  GridToolbarDensitySelector,
} from "@mui/x-data-grid-premium";

        <DataGridPremium 
          getRowId={getRowId}
          rows={data}
          columns={columns}
          slots={{
            toolbar: GridToolbar,
          }}
          pageSize={10}
          rowsPerPageOptions={[10, 20, 100]}
          pageSizeOptions={[10, 20, 100]}
        />

and i get

MUI X: useGridRootProps should only be used inside the DataGrid, DataGridPro or DataGridPremium component.

if i delete the slots={{ toolbar: GridToolbar }}
i have no error but i cannot use the tool bar or the pagination
please help

Current behavior

No response

Expected behavior

No response

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: DataGridPremium DataGrid
Order ID: 91159

@tteris tteris added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label May 23, 2024
@oliviertassinari oliviertassinari changed the title MUI X: useGridRootProps should only be used inside the DataGrid, DataGridPro or DataGridPremium component. [data grid] useGridRootProps should only be used inside the DataGrid, DataGridPro or DataGridPremium component May 23, 2024
@oliviertassinari oliviertassinari added component: data grid This is the name of the generic UI component, not the React module! support: premium standard Support request from a Premium standard plan user. https://mui.com/legal/technical-support-sla/ labels May 23, 2024
@michelengelen
Copy link
Member

Hey @tteris ... thanks for purchasing the premium package. We appreciate that.

The pagination is disabled by default on the Pro and Premium data grid. Docs

To enable it just pass the pagination prop to the grid. 👍🏼

I am not sure where that error comes from though. Could you provide a minimal reproduction in a codesandbox?

@michelengelen michelengelen added status: waiting for author Issue with insufficient information feature: Pagination Related to the data grid Pagination feature and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels May 24, 2024
@tteris
Copy link
Author

tteris commented May 24, 2024

Ok fixed with the version 7.5.1 thank you very much

@github-actions github-actions bot added status: waiting for maintainer These issues haven't been looked at yet by a maintainer and removed status: waiting for author Issue with insufficient information labels May 24, 2024
@michelengelen michelengelen removed the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label May 24, 2024
Copy link

⚠️ 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.

@tteris: 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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: data grid This is the name of the generic UI component, not the React module! feature: Pagination Related to the data grid Pagination feature support: premium standard Support request from a Premium standard plan user. https://mui.com/legal/technical-support-sla/
Projects
None yet
Development

No branches or pull requests

3 participants