diff --git a/docs/pages/x/api/data-grid/selectors.json b/docs/pages/x/api/data-grid/selectors.json index e10bb19d717b2..10cb5c8c44395 100644 --- a/docs/pages/x/api/data-grid/selectors.json +++ b/docs/pages/x/api/data-grid/selectors.json @@ -161,7 +161,7 @@ }, { "name": "gridExpandedSortedRowEntriesSelector", - "returnType": "{ id: GridRowId; model: GridValidRowModel }[]", + "returnType": "GridRowEntry[]", "category": "Filtering", "description": "Get the id and the model of the rows accessible after the filtering process.\nDoes not contain the collapsed children.", "supportsApiRef": true @@ -196,7 +196,7 @@ }, { "name": "gridFilteredSortedRowEntriesSelector", - "returnType": "{ id: GridRowId; model: GridValidRowModel }[]", + "returnType": "GridRowEntry[]", "category": "Filtering", "description": "Get the id and the model of the rows accessible after the filtering process.\nContains the collapsed children.", "supportsApiRef": true @@ -210,7 +210,7 @@ }, { "name": "gridFilteredSortedTopLevelRowEntriesSelector", - "returnType": "{ id: GridRowId; model: GridValidRowModel }[]", + "returnType": "GridRowEntry[]", "category": "Filtering", "description": "Get the id and the model of the top level rows accessible after the filtering process.", "supportsApiRef": true @@ -299,7 +299,7 @@ }, { "name": "gridPaginatedVisibleSortedGridRowEntriesSelector", - "returnType": "{ id: GridRowId; model: GridValidRowModel }[]", + "returnType": "GridRowEntry[]", "category": "Pagination", "description": "Get the id and the model of each row to include in the current page if the pagination is enabled.", "supportsApiRef": true @@ -446,7 +446,7 @@ }, { "name": "gridSortedRowEntriesSelector", - "returnType": "{ id: GridRowId; model: GridValidRowModel }[]", + "returnType": "GridRowEntry[]", "category": "Sorting", "description": "Get the id and the model of the rows after the sorting process.", "supportsApiRef": true diff --git a/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx b/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx index 909ecae28e8cb..5ba08b587cdc5 100644 --- a/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx +++ b/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx @@ -7,7 +7,7 @@ import { gridExpandedRowCountSelector } from '../filter/gridFilterSelector'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; import { GridPrintExportOptions } from '../../../models/gridExport'; import { GridValidRowModel } from '../../../models/gridRows'; -import { GridInitialStateCommunity } from '../../../models/gridStateCommunity'; +import { GridInitialStateCommunity, GridStateCommunity } from '../../../models/gridStateCommunity'; import { gridColumnDefinitionsSelector, gridColumnVisibilityModelSelector, @@ -15,6 +15,7 @@ import { import { gridClasses } from '../../../constants/gridClasses'; import { useGridApiMethod } from '../../utils/useGridApiMethod'; import { gridRowsMetaSelector } from '../rows/gridRowsMetaSelector'; +import { GRID_ID_AUTOGENERATED } from '../rows/gridRowsUtils'; import { defaultGetRowsToExport, getColumnsToExport } from './utils'; import { getDerivedPaginationModel } from '../pagination/useGridPaginationModel'; import { GridPipeProcessor, useGridRegisterPipeProcessor } from '../../core/pipeProcessing'; @@ -71,6 +72,7 @@ export const useGridPrintExport = ( const previousGridState = React.useRef(null); const previousColumnVisibility = React.useRef<{ [key: string]: boolean }>({}); const previousRows = React.useRef([]); + const previousVirtualizationState = React.useRef(); React.useEffect(() => { doc.current = ownerDocument(apiRef.current.rootElementRef!.current!); @@ -106,7 +108,15 @@ export const useGridPrintExport = ( const updateGridRowsForPrint = React.useCallback( (getRowsToExport: NonNullable) => { const rowsToExportIds = getRowsToExport({ apiRef }); - const newRows = rowsToExportIds.map((id) => apiRef.current.getRow(id)); + + const newRows = rowsToExportIds.reduce((acc, id) => { + const row = apiRef.current.getRow(id); + if (!row[GRID_ID_AUTOGENERATED]) { + acc.push(row); + } + return acc; + }, [] as GridValidRowModel[]); + apiRef.current.setRows(newRows); }, [apiRef], @@ -130,7 +140,7 @@ export const useGridPrintExport = ( const rowsMeta = gridRowsMetaSelector(apiRef.current.state); - const gridRootElement = apiRef.current.rootElementRef!.current; + const gridRootElement = apiRef.current.rootElementRef.current; const gridClone = gridRootElement!.cloneNode(true) as HTMLElement; // Allow to overflow to not hide the border of the last row @@ -181,6 +191,8 @@ export const useGridPrintExport = ( // prevents us to do it const container = document.createElement('div'); container.appendChild(gridClone); + // To avoid an empty page in start on Chromium based browsers + printDoc.body.style.marginTop = '0px'; printDoc.body.innerHTML = container.innerHTML; const defaultPageStyle = @@ -271,7 +283,10 @@ export const useGridPrintExport = ( apiRef.current.setColumnVisibilityModel(previousColumnVisibility.current); } - apiRef.current.unstable_setVirtualization(true); + apiRef.current.setState((state) => ({ + ...state, + virtualization: previousVirtualizationState.current!, + })); apiRef.current.setRows(previousRows.current); // Clear local state @@ -293,7 +308,9 @@ export const useGridPrintExport = ( previousGridState.current = apiRef.current.exportState(); // It appends that the visibility model is not exported, especially if columnVisibility is not controlled previousColumnVisibility.current = gridColumnVisibilityModelSelector(apiRef); - previousRows.current = apiRef.current.getSortedRows(); + previousRows.current = apiRef.current + .getSortedRows() + .filter((row) => !row[GRID_ID_AUTOGENERATED]); if (props.pagination) { const visibleRowCount = gridExpandedRowCountSelector(apiRef); @@ -313,8 +330,16 @@ export const useGridPrintExport = ( ), }, })); - apiRef.current.forceUpdate(); } + previousVirtualizationState.current = apiRef.current.state.virtualization; + apiRef.current.setState((state) => ({ + ...state, + virtualization: { + ...state.virtualization, + enabled: false, + enabledForColumns: false, + }, + })); await updateGridColumnsForPrint( options?.fields, @@ -324,7 +349,6 @@ export const useGridPrintExport = ( updateGridRowsForPrint(options?.getRowsToExport ?? defaultGetRowsToExport); - apiRef.current.unstable_setVirtualization(false); await raf(); // wait for the state changes to take action const printWindow = buildPrintWindow(options?.fileName); if (process.env.NODE_ENV === 'test') { diff --git a/packages/x-data-grid/src/hooks/features/sorting/gridSortingSelector.ts b/packages/x-data-grid/src/hooks/features/sorting/gridSortingSelector.ts index d157ad5608840..90c85a1ad65f4 100644 --- a/packages/x-data-grid/src/hooks/features/sorting/gridSortingSelector.ts +++ b/packages/x-data-grid/src/hooks/features/sorting/gridSortingSelector.ts @@ -1,7 +1,9 @@ import { createSelector, createSelectorMemoized } from '../../../utils/createSelector'; import { GridSortDirection, GridSortModel } from '../../../models/gridSortModel'; -import { GridStateCommunity } from '../../../models/gridStateCommunity'; -import { gridRowsLookupSelector } from '../rows/gridRowsSelector'; +import { gridRowTreeSelector, gridRowsLookupSelector } from '../rows/gridRowsSelector'; +import { GRID_ID_AUTOGENERATED, isAutoGeneratedRow } from '../rows/gridRowsUtils'; +import type { GridStateCommunity } from '../../../models/gridStateCommunity'; +import type { GridValidRowModel, GridRowEntry } from '../../../models/gridRows'; /** * @category Sorting @@ -25,8 +27,19 @@ export const gridSortedRowIdsSelector = createSelector( export const gridSortedRowEntriesSelector = createSelectorMemoized( gridSortedRowIdsSelector, gridRowsLookupSelector, - // TODO rows v6: Is this the best approach ? - (sortedIds, idRowsLookup) => sortedIds.map((id) => ({ id, model: idRowsLookup[id] ?? {} })), + gridRowTreeSelector, + (sortedIds, idRowsLookup, rowTree) => + sortedIds.reduce[]>((acc, id) => { + const model = idRowsLookup[id]; + if (model) { + acc.push({ id, model }); + } + const rowNode = rowTree[id]; + if (rowNode && isAutoGeneratedRow(rowNode)) { + acc.push({ id, model: { [GRID_ID_AUTOGENERATED]: id } }); + } + return acc; + }, [] as GridRowEntry[]), ); /**