@mui/x-data-grid 6.0.0-alpha.0 → 6.0.0-alpha.2

package/node/hooks/features/rows/useGridRows.js

@@ -42,9 +42,10 @@ const rowsStateInitializer = (state, props, apiRef) => {
   return (0, _extends2.default)({}, state, {
     rows: (0, _gridRowsUtils.getRowsStateFromCache)({
       apiRef,
-      previousTree: null,
       rowCountProp: props.rowCount,
-      loadingProp: props.loading
+      loadingProp: props.loading,
+      previousTree: null,
+      previousTreeDepths: null
     })
   });
 };
@@ -65,9 +66,20 @@ const useGridRows = (apiRef, props) => {
   const lastUpdateMs = React.useRef(Date.now());
   const timeout = React.useRef(null);
   const getRow = React.useCallback(id => {
-    var _ref;
+    const model = (0, _gridRowsSelector.gridRowsLookupSelector)(apiRef)[id];
+
+    if (model) {
+      return model;
+    }
+
+    const node = apiRef.current.getRowNode(id);
 
-    return (_ref = (0, _gridRowsSelector.gridRowsLookupSelector)(apiRef)[id]) != null ? _ref : null;
+    if (node && (0, _gridRowsUtils.isAutoGeneratedRow)(node)) {
+      // TODO rows v6: Is it the best approach ?
+      return {};
+    }
+
+    return null;
   }, [apiRef]);
   const lookup = React.useMemo(() => currentPage.rows.reduce((acc, {
     id
@@ -75,16 +87,20 @@ const useGridRows = (apiRef, props) => {
     acc[id] = index;
     return acc;
   }, {}), [currentPage.rows]);
-  const throttledRowsChange = React.useCallback((newCache, throttle) => {
+  const throttledRowsChange = React.useCallback(({
+    cache,
+    throttle
+  }) => {
     const run = () => {
       timeout.current = null;
       lastUpdateMs.current = Date.now();
       apiRef.current.setState(state => (0, _extends2.default)({}, state, {
         rows: (0, _gridRowsUtils.getRowsStateFromCache)({
           apiRef,
-          previousTree: (0, _gridRowsSelector.gridRowTreeSelector)(apiRef),
           rowCountProp: props.rowCount,
-          loadingProp: props.loading
+          loadingProp: props.loading,
+          previousTree: (0, _gridRowsSelector.gridRowTreeSelector)(apiRef),
+          previousTreeDepths: (0, _gridRowsSelector.gridRowTreeDepthsSelector)(apiRef)
         })
       }));
       apiRef.current.publishEvent('rowsSet');
@@ -96,7 +112,7 @@ const useGridRows = (apiRef, props) => {
       timeout.current = null;
     }
 
-    apiRef.current.unstable_caches.rows = newCache;
+    apiRef.current.unstable_caches.rows = cache;
 
     if (!throttle) {
       run();
@@ -118,72 +134,42 @@ const useGridRows = (apiRef, props) => {
 
   const setRows = React.useCallback(rows => {
     logger.debug(`Updating all rows, new length ${rows.length}`);
-    throttledRowsChange((0, _gridRowsUtils.createRowsInternalCache)({
-      rows,
-      getRowId: props.getRowId,
-      loading: props.loading
-    }), true);
+    throttledRowsChange({
+      cache: (0, _gridRowsUtils.createRowsInternalCache)({
+        rows,
+        getRowId: props.getRowId,
+        loading: props.loading
+      }),
+      throttle: true
+    });
   }, [logger, props.getRowId, props.loading, throttledRowsChange]);
   const updateRows = React.useCallback(updates => {
     if (props.signature === _useGridApiEventHandler.GridSignature.DataGrid && updates.length > 1) {
       // TODO: Add test with direct call to `apiRef.current.updateRows` in DataGrid after enabling the `apiRef` on the free plan.
       throw new Error(["MUI: You can't update several rows at once in `apiRef.current.updateRows` on the DataGrid.", 'You need to upgrade to DataGridPro or DataGridPremium component to unlock this feature.'].join('\n'));
-    } // we remove duplicate updates. A server can batch updates, and send several updates for the same row in one fn call.
-
-
-    const uniqueUpdates = new Map();
-    updates.forEach(update => {
-      const id = (0, _gridRowsUtils.getRowIdFromRowModel)(update, props.getRowId, 'A row was provided without id when calling updateRows():');
+    }
 
-      if (uniqueUpdates.has(id)) {
-        uniqueUpdates.set(id, (0, _extends2.default)({}, uniqueUpdates.get(id), update));
-      } else {
-        uniqueUpdates.set(id, update);
-      }
+    const cache = (0, _gridRowsUtils.updateCacheWithNewRows)({
+      updates,
+      getRowId: props.getRowId,
+      previousCache: apiRef.current.unstable_caches.rows
     });
-    const deletedRowIds = [];
-    const prevCache = apiRef.current.unstable_caches.rows;
-    const newCache = {
-      rowsBeforePartialUpdates: prevCache.rowsBeforePartialUpdates,
-      loadingPropBeforePartialUpdates: prevCache.loadingPropBeforePartialUpdates,
-      idRowsLookup: (0, _extends2.default)({}, prevCache.idRowsLookup),
-      idToIdLookup: (0, _extends2.default)({}, prevCache.idToIdLookup),
-      ids: [...prevCache.ids]
-    };
-    uniqueUpdates.forEach((partialRow, id) => {
-      // eslint-disable-next-line no-underscore-dangle
-      if (partialRow._action === 'delete') {
-        delete newCache.idRowsLookup[id];
-        delete newCache.idToIdLookup[id];
-        deletedRowIds.push(id);
-        return;
-      }
-
-      const oldRow = apiRef.current.getRow(id);
-
-      if (!oldRow) {
-        newCache.idRowsLookup[id] = partialRow;
-        newCache.idToIdLookup[id] = id;
-        newCache.ids.push(id);
-        return;
-      }
-
-      newCache.idRowsLookup[id] = (0, _extends2.default)({}, apiRef.current.getRow(id), partialRow);
+    throttledRowsChange({
+      cache,
+      throttle: true
     });
-
-    if (deletedRowIds.length > 0) {
-      newCache.ids = newCache.ids.filter(id => !deletedRowIds.includes(id));
-    }
-
-    throttledRowsChange(newCache, true);
   }, [props.signature, props.getRowId, throttledRowsChange, apiRef]);
   const getRowModels = React.useCallback(() => {
-    const allRows = (0, _gridRowsSelector.gridRowIdsSelector)(apiRef);
+    const dataRows = (0, _gridRowsSelector.gridDataRowIdsSelector)(apiRef);
     const idRowsLookup = (0, _gridRowsSelector.gridRowsLookupSelector)(apiRef);
-    return new Map(allRows.map(id => [id, idRowsLookup[id]]));
+    return new Map(dataRows.map(id => {
+      var _idRowsLookup$id;
+
+      return [id, (_idRowsLookup$id = idRowsLookup[id]) != null ? _idRowsLookup$id : {}];
+    }));
   }, [apiRef]);
   const getRowsCount = React.useCallback(() => (0, _gridRowsSelector.gridRowCountSelector)(apiRef), [apiRef]);
-  const getAllRowIds = React.useCallback(() => (0, _gridRowsSelector.gridRowIdsSelector)(apiRef), [apiRef]);
+  const getAllRowIds = React.useCallback(() => (0, _gridRowsSelector.gridDataRowIdsSelector)(apiRef), [apiRef]);
   const getRowIndexRelativeToVisibleRows = React.useCallback(id => lookup[id], [lookup]);
   const setRowChildrenExpansion = React.useCallback((id, isExpanded) => {
     const currentNode = apiRef.current.getRowNode(id);
@@ -192,6 +178,10 @@ const useGridRows = (apiRef, props) => {
       throw new Error(`MUI: No row with id #${id} found`);
     }
 
+    if (currentNode.type !== 'group') {
+      throw new Error('MUI: Only group nodes can be expanded or collapsed');
+    }
+
     const newNode = (0, _extends2.default)({}, currentNode, {
       childrenExpanded: isExpanded
     });
@@ -208,9 +198,9 @@ const useGridRows = (apiRef, props) => {
     apiRef.current.publishEvent('rowExpansionChange', newNode);
   }, [apiRef]);
   const getRowNode = React.useCallback(id => {
-    var _gridRowTreeSelector$;
+    var _ref;
 
-    return (_gridRowTreeSelector$ = (0, _gridRowsSelector.gridRowTreeSelector)(apiRef)[id]) != null ? _gridRowTreeSelector$ : null;
+    return (_ref = (0, _gridRowsSelector.gridRowTreeSelector)(apiRef)[id]) != null ? _ref : null;
   }, [apiRef]);
   const getRowGroupChildren = React.useCallback(({
     skipAutoGeneratedRows = true,
@@ -234,9 +224,8 @@ const useGridRows = (apiRef, props) => {
 
       for (let index = startIndex; index < sortedRowIds.length && tree[sortedRowIds[index]].depth > groupNode.depth; index += 1) {
         const id = sortedRowIds[index];
-        const node = tree[id];
 
-        if (!skipAutoGeneratedRows || !node.isAutoGenerated) {
+        if (!skipAutoGeneratedRows || !(0, _gridRowsUtils.isAutoGeneratedRow)(tree[id])) {
           children.push(id);
         }
       }
@@ -252,21 +241,43 @@ const useGridRows = (apiRef, props) => {
     return children;
   }, [apiRef]);
   const setRowIndex = React.useCallback((rowId, targetIndex) => {
-    const allRows = (0, _gridRowsSelector.gridRowIdsSelector)(apiRef);
-    const oldIndex = allRows.findIndex(row => row === rowId);
+    const node = apiRef.current.getRowNode(rowId);
 
-    if (oldIndex === -1 || oldIndex === targetIndex) {
-      return;
+    if (!node) {
+      throw new Error(`MUI: No row with id #${rowId} found`);
     }
 
-    logger.debug(`Moving row ${rowId} to index ${targetIndex}`);
-    const updatedRows = [...allRows];
-    updatedRows.splice(targetIndex, 0, updatedRows.splice(oldIndex, 1)[0]);
-    apiRef.current.setState(state => (0, _extends2.default)({}, state, {
-      rows: (0, _extends2.default)({}, state.rows, {
-        ids: updatedRows
-      })
-    }));
+    if (node.parent !== _gridRowsUtils.GRID_ROOT_GROUP_ID) {
+      throw new Error(`MUI: The row reordering do not support reordering of grouped rows yet`);
+    }
+
+    if (node.type !== 'leaf') {
+      throw new Error(`MUI: The row reordering do not support reordering of footer or grouping rows`);
+    }
+
+    apiRef.current.setState(state => {
+      const group = (0, _gridRowsSelector.gridRowTreeSelector)(state, apiRef.current.instanceId)[_gridRowsUtils.GRID_ROOT_GROUP_ID];
+
+      const allRows = group.children;
+      const oldIndex = allRows.findIndex(row => row === rowId);
+
+      if (oldIndex === -1 || oldIndex === targetIndex) {
+        return state;
+      }
+
+      logger.debug(`Moving row ${rowId} to index ${targetIndex}`);
+      const updatedRows = [...allRows];
+      updatedRows.splice(targetIndex, 0, updatedRows.splice(oldIndex, 1)[0]);
+      return (0, _extends2.default)({}, state, {
+        rows: (0, _extends2.default)({}, state.rows, {
+          tree: (0, _extends2.default)({}, state.rows.tree, {
+            [_gridRowsUtils.GRID_ROOT_GROUP_ID]: (0, _extends2.default)({}, group, {
+              children: updatedRows
+            })
+          })
+        })
+      });
+    });
     apiRef.current.publishEvent('rowsSet');
   }, [apiRef, logger]);
   const replaceRows = React.useCallback((firstRowToRender, newRows) => {
@@ -278,45 +289,48 @@ const useGridRows = (apiRef, props) => {
       return;
     }
 
-    const allRows = (0, _gridRowsSelector.gridRowIdsSelector)(apiRef);
-    const updatedRows = [...allRows];
-    const idRowsLookup = (0, _gridRowsSelector.gridRowsLookupSelector)(apiRef);
-    const idToIdLookup = (0, _gridRowsSelector.gridRowsIdToIdLookupSelector)(apiRef);
-    const tree = (0, _gridRowsSelector.gridRowTreeSelector)(apiRef);
-    const updatedIdRowsLookup = (0, _extends2.default)({}, idRowsLookup);
-    const updatedIdToIdLookup = (0, _extends2.default)({}, idToIdLookup);
-    const updatedTree = (0, _extends2.default)({}, tree);
-    const newRowEntries = newRows.map(newRowModel => {
-      const rowId = (0, _gridRowsUtils.getRowIdFromRowModel)(newRowModel, props.getRowId, 'A row was provided without id when calling replaceRows().');
-      return {
-        id: rowId,
-        model: newRowModel
-      };
-    });
-    newRowEntries.forEach((row, index) => {
-      const [replacedRowId] = updatedRows.splice(firstRowToRender + index, 1, row.id);
-      delete updatedIdRowsLookup[replacedRowId];
-      delete updatedIdToIdLookup[replacedRowId];
-      delete updatedTree[replacedRowId];
-    });
-    newRowEntries.forEach(row => {
+    const treeDepth = (0, _gridRowsSelector.gridRowMaximumTreeDepthSelector)(apiRef);
+
+    if (treeDepth > 1) {
+      throw new Error('`apiRef.current.unstable_replaceRows` is not compatible with tree data and row grouping');
+    }
+
+    const tree = (0, _extends2.default)({}, (0, _gridRowsSelector.gridRowTreeSelector)(apiRef));
+    const dataRowIdToModelLookup = (0, _extends2.default)({}, (0, _gridRowsSelector.gridRowsLookupSelector)(apiRef));
+    const dataRowIdToIdLookup = (0, _extends2.default)({}, (0, _gridRowsSelector.gridRowsDataRowIdToIdLookupSelector)(apiRef));
+    const rootGroup = tree[_gridRowsUtils.GRID_ROOT_GROUP_ID];
+    const rootGroupChildren = [...rootGroup.children];
+
+    for (let i = 0; i < newRows.length; i += 1) {
+      const rowModel = newRows[i];
+      const rowId = (0, _gridRowsUtils.getRowIdFromRowModel)(rowModel, props.getRowId, 'A row was provided without id when calling replaceRows().');
+      const [replacedRowId] = rootGroupChildren.splice(firstRowToRender + i, 1, rowId);
+      delete dataRowIdToModelLookup[replacedRowId];
+      delete dataRowIdToIdLookup[replacedRowId];
+      delete tree[replacedRowId];
       const rowTreeNodeConfig = {
-        id: row.id,
-        parent: null,
+        id: rowId,
         depth: 0,
-        groupingKey: null,
-        groupingField: null
+        parent: _gridRowsUtils.GRID_ROOT_GROUP_ID,
+        type: 'leaf',
+        groupingKey: null
       };
-      updatedIdRowsLookup[row.id] = row.model;
-      updatedIdToIdLookup[row.id] = row.id;
-      updatedTree[row.id] = rowTreeNodeConfig;
-    });
+      dataRowIdToModelLookup[rowId] = rowModel;
+      dataRowIdToIdLookup[rowId] = rowId;
+      tree[rowId] = rowTreeNodeConfig;
+    }
+
+    tree[_gridRowsUtils.GRID_ROOT_GROUP_ID] = (0, _extends2.default)({}, rootGroup, {
+      children: rootGroupChildren
+    }); // Removes potential remaining skeleton rows from the dataRowIds.
+
+    const dataRowIds = rootGroupChildren.filter(childId => tree[childId].type === 'leaf');
     apiRef.current.setState(state => (0, _extends2.default)({}, state, {
       rows: (0, _extends2.default)({}, state.rows, {
-        idRowsLookup: updatedIdRowsLookup,
-        idToIdLookup: updatedIdToIdLookup,
-        tree: updatedTree,
-        ids: updatedRows
+        dataRowIdToModelLookup,
+        dataRowIdToIdLookup,
+        dataRowIds,
+        tree
       })
     }));
     apiRef.current.publishEvent('rowsSet');
@@ -346,7 +360,12 @@ const useGridRows = (apiRef, props) => {
     if (apiRef.current.unstable_caches.rows.rowsBeforePartialUpdates === props.rows) {
       // The `props.rows` did not change since the last row grouping
       // We can use the current rows cache which contains the partial updates done recently.
-      cache = apiRef.current.unstable_caches.rows;
+      cache = (0, _extends2.default)({}, apiRef.current.unstable_caches.rows, {
+        updates: {
+          type: 'full',
+          rows: (0, _gridRowsSelector.gridDataRowIdsSelector)(apiRef)
+        }
+      });
     } else {
       // The `props.rows` has changed since the last row grouping
       // We must use the new `props.rows` on the new grouping
@@ -358,7 +377,10 @@ const useGridRows = (apiRef, props) => {
       });
     }
 
-    throttledRowsChange(cache, false);
+    throttledRowsChange({
+      cache,
+      throttle: false
+    });
   }, [logger, apiRef, props.rows, props.getRowId, props.loading, throttledRowsChange]);
   const handleStrategyProcessorChange = React.useCallback(methodName => {
     if (methodName === 'rowTreeCreation') {
@@ -379,12 +401,26 @@ const useGridRows = (apiRef, props) => {
    */
 
   const applyHydrateRowsProcessor = React.useCallback(() => {
-    apiRef.current.setState(state => (0, _extends2.default)({}, state, {
-      rows: (0, _extends2.default)({}, state.rows, apiRef.current.unstable_applyPipeProcessors('hydrateRows', state.rows.groupingResponseBeforeRowHydration))
-    }));
+    apiRef.current.setState(state => {
+      const response = apiRef.current.unstable_applyPipeProcessors('hydrateRows', {
+        tree: (0, _gridRowsSelector.gridRowTreeSelector)(state, apiRef.current.instanceId),
+        treeDepths: (0, _gridRowsSelector.gridRowTreeDepthsSelector)(state, apiRef.current.instanceId),
+        dataRowIds: (0, _gridRowsSelector.gridDataRowIdsSelector)(state, apiRef.current.instanceId),
+        dataRowIdToModelLookup: (0, _gridRowsSelector.gridRowsLookupSelector)(state, apiRef.current.instanceId),
+        dataRowIdToIdLookup: (0, _gridRowsSelector.gridRowsDataRowIdToIdLookupSelector)(state, apiRef.current.instanceId)
+      });
+      return (0, _extends2.default)({}, state, {
+        rows: (0, _extends2.default)({}, state.rows, response, {
+          totalTopLevelRowCount: (0, _gridRowsUtils.getTopLevelRowCount)({
+            tree: response.tree,
+            rowCountProp: props.rowCount
+          })
+        })
+      });
+    });
     apiRef.current.publishEvent('rowsSet');
     apiRef.current.forceUpdate();
-  }, [apiRef]);
+  }, [apiRef, props.rowCount]);
   (0, _pipeProcessing.useGridRegisterPipeApplier)(apiRef, 'hydrateRows', applyHydrateRowsProcessor);
   (0, _useGridApiMethod.useGridApiMethod)(apiRef, rowApi, 'GridRowApi');
   /**
@@ -426,11 +462,14 @@ const useGridRows = (apiRef, props) => {
     }
 
     logger.debug(`Updating all rows, new length ${props.rows.length}`);
-    throttledRowsChange((0, _gridRowsUtils.createRowsInternalCache)({
-      rows: props.rows,
-      getRowId: props.getRowId,
-      loading: props.loading
-    }), false);
+    throttledRowsChange({
+      cache: (0, _gridRowsUtils.createRowsInternalCache)({
+        rows: props.rows,
+        getRowId: props.getRowId,
+        loading: props.loading
+      }),
+      throttle: false
+    });
   }, [props.rows, props.rowCount, props.getRowId, props.loading, logger, throttledRowsChange, apiRef]);
 };
 

package/node/hooks/features/rows/useGridRowsPreProcessors.js

@@ -1,47 +1,102 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useGridRowsPreProcessors = void 0;
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _strategyProcessing = require("../../core/strategyProcessing");
 
-const flatRowTreeCreationMethod = ({
-  ids,
-  idRowsLookup,
-  idToIdLookup,
-  previousTree
+var _gridRowsUtils = require("./gridRowsUtils");
+
+const createFlatRowTree = rows => {
+  const tree = {
+    [_gridRowsUtils.GRID_ROOT_GROUP_ID]: (0, _extends2.default)({}, (0, _gridRowsUtils.buildRootGroup)(), {
+      children: rows
+    })
+  };
+
+  for (let i = 0; i < rows.length; i += 1) {
+    const rowId = rows[i];
+    tree[rowId] = {
+      id: rowId,
+      depth: 0,
+      parent: _gridRowsUtils.GRID_ROOT_GROUP_ID,
+      type: 'leaf',
+      groupingKey: null
+    };
+  }
+
+  return {
+    groupingName: _strategyProcessing.GRID_DEFAULT_STRATEGY,
+    tree,
+    treeDepths: {
+      0: rows.length
+    },
+    dataRowIds: rows
+  };
+};
+
+const updateFlatRowTree = ({
+  previousTree,
+  actions
 }) => {
-  const tree = {};
-
-  for (let i = 0; i < ids.length; i += 1) {
-    const rowId = ids[i];
-
-    if (previousTree && previousTree[rowId] && previousTree[rowId].depth === 0 && previousTree[rowId].parent == null && // pinned row can be unpinned
-    !previousTree[rowId].isPinned) {
-      tree[rowId] = previousTree[rowId];
-    } else {
-      tree[rowId] = {
-        id: rowId,
-        depth: 0,
-        parent: null,
-        groupingKey: '',
-        groupingField: null
-      };
-    }
+  const tree = (0, _extends2.default)({}, previousTree);
+  const idsToRemoveFromRootGroup = {};
+
+  for (let i = 0; i < actions.remove.length; i += 1) {
+    const idToDelete = actions.remove[i];
+    idsToRemoveFromRootGroup[idToDelete] = true;
+    delete tree[idToDelete];
   }
 
+  for (let i = 0; i < actions.insert.length; i += 1) {
+    const idToInsert = actions.insert[i];
+    tree[idToInsert] = {
+      id: idToInsert,
+      depth: 0,
+      parent: _gridRowsUtils.GRID_ROOT_GROUP_ID,
+      type: 'leaf',
+      groupingKey: null
+    };
+  } // TODO rows v6: Support row unpinning
+
+
+  const rootGroup = tree[_gridRowsUtils.GRID_ROOT_GROUP_ID];
+  let rootGroupChildren = [...rootGroup.children, ...actions.insert];
+
+  if (Object.values(idsToRemoveFromRootGroup).length) {
+    rootGroupChildren = rootGroupChildren.filter(id => !idsToRemoveFromRootGroup[id]);
+  }
+
+  tree[_gridRowsUtils.GRID_ROOT_GROUP_ID] = (0, _extends2.default)({}, rootGroup, {
+    children: rootGroupChildren
+  });
   return {
     groupingName: _strategyProcessing.GRID_DEFAULT_STRATEGY,
     tree,
-    treeDepth: 1,
-    idRowsLookup,
-    idToIdLookup,
-    ids
+    treeDepths: {
+      0: rootGroupChildren.length
+    },
+    dataRowIds: rootGroupChildren
   };
 };
 
+const flatRowTreeCreationMethod = params => {
+  if (params.updates.type === 'full') {
+    return createFlatRowTree(params.updates.rows);
+  }
+
+  return updateFlatRowTree({
+    previousTree: params.previousTree,
+    actions: params.updates.actions
+  });
+};
+
 const useGridRowsPreProcessors = apiRef => {
   (0, _strategyProcessing.useGridRegisterStrategyProcessor)(apiRef, _strategyProcessing.GRID_DEFAULT_STRATEGY, 'rowTreeCreation', flatRowTreeCreationMethod);
 };

package/node/hooks/features/selection/useGridSelection.js

@@ -149,7 +149,7 @@ const useGridSelection = (apiRef, props) => {
 
     const rowNode = apiRef.current.getRowNode(id);
 
-    if ((rowNode == null ? void 0 : rowNode.position) === 'footer' || rowNode != null && rowNode.isPinned) {
+    if ((rowNode == null ? void 0 : rowNode.type) === 'footer' || (rowNode == null ? void 0 : rowNode.type) === 'pinnedRow') {
       return false;
     }
 
@@ -299,7 +299,7 @@ const useGridSelection = (apiRef, props) => {
       }
     }
 
-    if (params.rowNode.isPinned) {
+    if (params.rowNode.type === 'pinnedRow') {
       return;
     }
 

package/node/hooks/features/sorting/gridSortingSelector.js

@@ -28,10 +28,15 @@ const gridSortedRowIdsSelector = (0, _createSelector.createSelector)(gridSorting
  */
 
 exports.gridSortedRowIdsSelector = gridSortedRowIdsSelector;
-const gridSortedRowEntriesSelector = (0, _createSelector.createSelector)(gridSortedRowIdsSelector, _gridRowsSelector.gridRowsLookupSelector, (sortedIds, idRowsLookup) => sortedIds.map(id => ({
-  id,
-  model: idRowsLookup[id]
-})));
+const gridSortedRowEntriesSelector = (0, _createSelector.createSelector)(gridSortedRowIdsSelector, _gridRowsSelector.gridRowsLookupSelector, // TODO rows v6: Is this the best approach ?
+(sortedIds, idRowsLookup) => sortedIds.map(id => {
+  var _idRowsLookup$id;
+
+  return {
+    id,
+    model: (_idRowsLookup$id = idRowsLookup[id]) != null ? _idRowsLookup$id : {}
+  };
+}));
 /**
  * Get the current sorting model.
  * @category Sorting

package/node/hooks/features/sorting/useGridSorting.js

@@ -11,8 +11,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var React = _interopRequireWildcard(require("react"));
 
-var _gridFeatureMode = require("../../../models/gridFeatureMode");
-
 var _keyboardUtils = require("../../../utils/keyboardUtils");
 
 var _useGridApiEventHandler = require("../../utils/useGridApiEventHandler");
@@ -35,6 +33,8 @@ var _gridSortingUtils = require("./gridSortingUtils");
 
 var _pipeProcessing = require("../../core/pipeProcessing");
 
+var _gridRowsUtils = require("../rows/gridRowsUtils");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -112,11 +112,11 @@ const useGridSorting = (apiRef, props) => {
 
   const applySorting = React.useCallback(() => {
     apiRef.current.setState(state => {
-      if (props.sortingMode === _gridFeatureMode.GridFeatureModeConstant.server) {
+      if (props.sortingMode === 'server') {
         logger.debug('Skipping sorting rows as sortingMode = server');
         return (0, _extends2.default)({}, state, {
           sorting: (0, _extends2.default)({}, state.sorting, {
-            sortedRows: (0, _rows.gridRowIdsSelector)(state, apiRef.current.instanceId)
+            sortedRows: (0, _gridRowsUtils.getTreeNodeDescendants)((0, _rows.gridRowTreeSelector)(apiRef), _rows.GRID_ROOT_GROUP_ID, false)
           })
         });
       }
@@ -220,38 +220,14 @@ const useGridSorting = (apiRef, props) => {
   }, [apiRef, props.disableMultipleColumnsSorting]);
   const flatSortingMethod = React.useCallback(params => {
     const rowTree = (0, _rows.gridRowTreeSelector)(apiRef);
+    const rootGroupNode = rowTree[_rows.GRID_ROOT_GROUP_ID];
+    const sortedChildren = params.sortRowList ? params.sortRowList(rootGroupNode.children.map(childId => rowTree[childId])) : [...rootGroupNode.children];
 
-    if (!params.sortRowList) {
-      const bodyRowIds = [];
-      const footerRowIds = [];
-      (0, _rows.gridRowIdsSelector)(apiRef).forEach(rowId => {
-        if (rowTree[rowId].isPinned) {
-          return;
-        }
-
-        if (rowTree[rowId].position === 'footer') {
-          footerRowIds.push(rowId);
-        } else {
-          bodyRowIds.push(rowId);
-        }
-      });
-      return [...bodyRowIds, ...footerRowIds];
+    if (rootGroupNode.footerId != null) {
+      sortedChildren.push(rootGroupNode.footerId);
     }
 
-    const bodyRows = [];
-    const footerRowIds = [];
-    Object.values(rowTree).forEach(rowNode => {
-      if (rowNode.isPinned) {
-        return;
-      }
-
-      if (rowNode.position === 'footer') {
-        footerRowIds.push(rowNode.id);
-      } else {
-        bodyRows.push(rowNode);
-      }
-    });
-    return [...params.sortRowList(bodyRows), ...footerRowIds];
+    return sortedChildren;
   }, [apiRef]);
   (0, _pipeProcessing.useGridRegisterPipeProcessor)(apiRef, 'exportState', stateExportPreProcessing);
   (0, _pipeProcessing.useGridRegisterPipeProcessor)(apiRef, 'restoreState', stateRestorePreProcessing);