diff --git a/.changeset/chatty-rabbits-remember.md b/.changeset/chatty-rabbits-remember.md new file mode 100644 index 0000000..4a9dc9f --- /dev/null +++ b/.changeset/chatty-rabbits-remember.md @@ -0,0 +1,5 @@ +--- +"@openfun/cunningham-react": patch +--- + +add warning on DataGrid when sortModel is missing diff --git a/packages/react/src/components/DataGrid/DataList.tsx b/packages/react/src/components/DataGrid/DataList.tsx index b7b6a43..7a9c54f 100644 --- a/packages/react/src/components/DataGrid/DataList.tsx +++ b/packages/react/src/components/DataGrid/DataList.tsx @@ -2,5 +2,15 @@ import React from "react"; import { BaseProps, DataGrid, Row } from ":/components/DataGrid/index"; export const DataList = ({ rows, ...props }: BaseProps) => { - return ; + return ( + ({ + ...column, + enableSorting: false, + }))} + /> + ); }; diff --git a/packages/react/src/components/DataGrid/index.tsx b/packages/react/src/components/DataGrid/index.tsx index a5003e6..7e7606b 100644 --- a/packages/react/src/components/DataGrid/index.tsx +++ b/packages/react/src/components/DataGrid/index.tsx @@ -92,6 +92,14 @@ export const DataGrid = ({ const { t } = useCunningham(); const headlessColumns = useHeadlessColumns({ columns, enableRowSelection }); + headlessColumns.forEach((column) => { + if (column.enableSorting && !onSortModelChange) { + console.warn( + "You are using a column with sorting enabled, but you are not providing an `onSortModelChange` handler. The sorting will not work as expected.", + ); + } + }); + /** * Features. */ diff --git a/packages/react/src/components/DataGrid/utils.tsx b/packages/react/src/components/DataGrid/utils.tsx index 61e79ad..aee8256 100644 --- a/packages/react/src/components/DataGrid/utils.tsx +++ b/packages/react/src/components/DataGrid/utils.tsx @@ -28,7 +28,8 @@ export const useHeadlessColumns = ({ const id = (column.id ?? column.field) as string; const opts = { id, - enableSorting: column.enableSorting, + enableSorting: + column.enableSorting === undefined ? true : column.enableSorting, header: column.headerName, cell: (info: CellContext) => { if (column.renderCell) {