[discussion] Preparing v6

[flaviendelangle]

This is an umbrella issue that centralizes and lists all the potential improvements that we can consider in MUI X v6. The potential improvements being listed here require breaking changes. We do intend to ship v6 in the coming months. We plan, as much as possible, to release the next major features in minor versions without breaking changes.

Same issue for MUI Core v6: mui/material-ui#30660

Infrastructure

• [core] Upgrade the min node.js version supported to v14 #5605

Data Grid packages

Publicly deprecated APIs.

• [data grid] Remove publicly deprecated APIs #5602
• [core] Remove GridFeatureModeConstant #6077

Columns

• [data grid] Invert generic parameter order in Grid params #5603
• [data grid] Rename GridColumnsState all field #5607
• [RFC] Remove the columnTypes prop #242
• [DataGridPro] Update onColumnOrderChange behaviour to match onRowsOrderChange #6126
• [RFC] Improve grid column definition typing #7188

As discussed in #4769

• [data grid] Add a default valueParser and valueFormatter to singleSelect columns #5615
• [data grid] Consider using generic parameter as unknown instead of any in GridCellParams #5614
• [data grid] Remove the hide property of GridColDef #6001

Rows

• [data grid] Stop exporting the root selector gridRowsStateSelector #5623
• [DataGrid] Remove headerHeight prop #602

Cells

• [data grid] Remove onCellFocusOut and add documentation for alternative recommended approach. #6300

Filtering

• [data grid] Refactor GridFilterItem properties #5604
• [data grid] Stop exporting the root selector gridFilterStateSelector #5619
• [data grid] Rename the filterPanelOperators translation key filterPanelOperator #6963
• Rename the selectors and state to follow [data-grid] Terminology for various row listings #4151
  TODO: Deprecate the old selectors and create new one
  @DanailH
• Rename GridFilterModel['linkOperator'] to GridFilterModel['logicOperator'] and same for translations #7270
• [DataGrid] Accept date objects in filter items #6564 seems to be backwards compatible
• Remove the single select logic still present in GridFilterInputValue #7271

Sorting

• [data grid] Stop exporting the root selector gridSortingStateSelector #5622

Editing

• [data grid] Remove the editing experimental features and make them enabled by default #5606
• [data grid] Use React.useState to track the cells in edit mode. #5625 (not easily viable, can be done after beta)
• [data grid] Remove gridEditRowsStateSelector #5626
  TODO: Create a new gridEditingStateSelector selector and wrap gridEditRowsStateSelector with wrapWithWarningOnCall

Pagination

• [data grid] Merge the pageSize and page into a single pagination prop #5624

Density

• [data grid] Remove headerHeight and rowHeight from state #5620

Row Grouping

• [data grid] Stop exporting the root selector gridRowGroupingStateSelector #5621

Virtualization / Rendering

• [data grid] Remove disableExtendRowFullWidth prop #4308
• [data grid] Do not fallback on valueToRender when children === null #5612
• [data grid] Rename the rowsScroll event to a wider name #5610

Detail Panel

• [data grid] Do not toggle the panel with Ctrl+Enter #5613

Keyboard navigation

• [data grid] Remove the NavigationKeyDown events #5617
• [data grid] Remove Alt+C keyboard shortcut #5618

Styling

• Have a single place for border styles. [DataGridPro] Fix missing border in right-pinned columns #4197 (comment)

General events topics

• [data grid] Remove GridEvents enum #4684
  It will allow to not define pro-only and premium-only events in the community package

Focus management

• There're two interfaces for "cell coordinates" (objects with cell id and field): GridCellCoordinates and GridCellIdentifier. They could be merged. Context: [DataGrid] Store the outlined cell in the state #7111 (comment)

Error management

• [data grid] Rename ErrorOverlay #5609
• [DataGrid] Uncatchable Errors thrown if row validation fails #1804
  Remove default error boundary

Slots

• [core] components -> slots API rename #6986 (we can make it backwards compatible)
• [DataGrid] Remove Header component slot #6977

[flaviendelangle]

@alexfauquette could you add a line in the list above to match the comment // TODO v6: remove once we stop ignoring events fired from portals ? I did not follow exactly what has to be done

[m4theushw]

Rename the filterPanelOperatorAnd translation key filterPanelOperator

I didn't understand this one.

---

I added:

• Remove the single select logic still present in GridFilterInputValue

  mui-x/packages/grid/x-data-grid/src/components/panel/filterPanel/GridFilterInputValue.tsx

  Line 17 in 0d8a55d

  `MUI: Using GridFilterInputValue with a "${type}" column is deprecated.`,

• Rename GridFilterModel['linkOperator'] to GridFilterModel['logicOperator']

  Do you agree? I already suggested this name in [DataGrid] Add quick filtering engine #4317

• Use React.useState to track the cells in edit mode, instead of the grid's state

[flaviendelangle]

Rename the filterPanelOperatorAnd translation key filterPanelOperator

I didn't either 😆 , but there is a TODO, @alexfauquette maybe

Rename GridFilterModel['linkOperator'] to GridFilterModel['logicOperator']

Yes logicOperator is probably more accurate

Use React.useState to track the cells in edit mode, instead of the grid's state

Could you describe that one / link an issue ?

[alexfauquette]

Rename the filterPanelOperatorAnd translation key filterPanelOperator

I think it refers to this TODO

  filterPanelOperators: 'Operator', // TODO v6: rename to filterPanelOperator

[flaviendelangle]

@alexfauquette oh that's funny, the script updating the locale files is putting the comment in the wrong place
It considers it as a group title

  // Filter panel text
  filterPanelAddFilter: 'إضافة مرشِح',
  filterPanelDeleteIconLabel: 'حذف',
  filterPanelLinkOperator: 'عامل منطقي',
  filterPanelOperators: 'عامل',

  // TODO v6: rename to filterPanelOperator
  filterPanelOperatorAnd: 'و',
  filterPanelOperatorOr: 'أو',
  filterPanelColumns: 'الأعمدة',
  filterPanelInputLabel: 'القيمة',
  filterPanelInputPlaceholder: 'ترشِيح قيمة',

[mbrookes]

Column reordering disabled by default? It's inconsistent with the row reordering. And should columns have the six-dot icon to indicate "re-orderability", the same as rows?

[mbrookes]

Don't show the keyboard focus indicator when a cell is not keyboard focused. At the moment a cell gets a blue outline when it is clicked. Not sure that's so much of a breaking change as a bug fix, bit it's enough of a change in behaviour that it probably deserves to wait for v6.

[m4theushw]

Column reordering disabled by default? It's inconsistent with the row reordering. And should columns have the six-dot icon to indicate "re-orderability", the same as rows?

@mbrookes It's not consistent because, although both are "reordering", they have different use cases. Column reordering is meant to only change the order of the columns that the user, using the grid, sees. The new order might be persisted, by saving the session, but in essence it's only for visualization. The row reordering is meant to reorder rows and save this new order in a database, so it can be presented in the same order in another page, that might not be using the grid. It's not enabled by default because if the backend is not prepared it has no use. If it was enabled by default, it would be too easy to mess with the saved order since rows change more often than columns. If a new row is added we can't trust the saved order anymore.

And should columns have the six-dot icon to indicate "re-orderability", the same as rows?

Maybe, but we're already fighting to fit the column menu icon. We still need to support column reordering in mobile so the icon could go into the columns panel.