@mui/x-data-grid-generator 7.21.0 → 7.22.1

package/node/hooks/useMockServer.js

@@ -11,15 +11,48 @@ var React = _interopRequireWildcard(require("react"));
 var _lruCache = require("lru-cache");
 var _xDataGridPro = require("@mui/x-data-grid-pro");
 var _useDemoData = require("./useDemoData");
+var _commodities = require("../columns/commodities.columns");
+var _employees = require("../columns/employees.columns");
 var _realDataService = require("../services/real-data-service");
 var _treeDataGenerator = require("../services/tree-data-generator");
 var _serverUtils = require("./serverUtils");
 var _services = require("../services");
+var _useMovieData = require("./useMovieData");
 const dataCache = new _lruCache.LRUCache({
   max: 10,
   ttl: 60 * 5 * 1e3 // 5 minutes
 });
 const BASE_URL = exports.BASE_URL = 'https://mui.com/x/api/data-grid';
+const GET_DEFAULT_DATASET_OPTIONS = isRowGrouping => ({
+  dataSet: isRowGrouping ? 'Movies' : 'Commodity',
+  rowLength: isRowGrouping ? (0, _useMovieData.getMovieRows)().length : 100,
+  maxColumns: 6
+});
+const getColumnsFromOptions = options => {
+  let columns;
+  switch (options.dataSet) {
+    case 'Commodity':
+      columns = (0, _commodities.getCommodityColumns)(options.editable);
+      break;
+    case 'Employee':
+      columns = (0, _employees.getEmployeeColumns)();
+      break;
+    case 'Movies':
+      columns = (0, _useMovieData.getMovieColumns)();
+      break;
+    default:
+      throw new Error('Unknown dataset');
+  }
+  if (options.visibleFields) {
+    columns = columns.map(col => options.visibleFields?.includes(col.field) ? col : (0, _extends2.default)({}, col, {
+      hide: true
+    }));
+  }
+  if (options.maxColumns) {
+    columns = columns.slice(0, options.maxColumns);
+  }
+  return columns;
+};
 function decodeParams(url) {
   const params = new URL(url).searchParams;
   const decodedParams = {};
@@ -50,6 +83,14 @@ const getInitialState = (columns, groupingField) => {
   };
 };
 const defaultColDef = (0, _xDataGridPro.getGridDefaultColumnTypes)();
+function sendEmptyResponse() {
+  return new Promise(resolve => {
+    resolve({
+      rows: [],
+      rowCount: 0
+    });
+  });
+}
 const useMockServer = (dataSetOptions, serverOptions, shouldRequestsFail) => {
   const [data, setData] = React.useState();
   const [index, setIndex] = React.useState(0);
@@ -59,9 +100,11 @@ const useMockServer = (dataSetOptions, serverOptions, shouldRequestsFail) => {
       shouldRequestsFailRef.current = shouldRequestsFail;
     }
   }, [shouldRequestsFail]);
-  const options = (0, _extends2.default)({}, _serverUtils.DEFAULT_DATASET_OPTIONS, dataSetOptions);
+  const isRowGrouping = dataSetOptions?.rowGrouping ?? false;
+  const options = (0, _extends2.default)({}, GET_DEFAULT_DATASET_OPTIONS(isRowGrouping), dataSetOptions);
+  const isTreeData = options.treeData?.groupingField != null;
   const columns = React.useMemo(() => {
-    return (0, _useDemoData.getColumnsFromOptions)({
+    return getColumnsFromOptions({
       dataSet: options.dataSet,
       editable: options.editable,
       maxColumns: options.maxColumns,
@@ -70,7 +113,6 @@ const useMockServer = (dataSetOptions, serverOptions, shouldRequestsFail) => {
   }, [options.dataSet, options.editable, options.maxColumns, options.visibleFields]);
   const initialState = React.useMemo(() => getInitialState(columns, options.treeData?.groupingField), [columns, options.treeData?.groupingField]);
   const columnsWithDefaultColDef = React.useMemo(() => columns.map(column => (0, _extends2.default)({}, defaultColDef[column.type || 'string'], column)), [columns]);
-  const isTreeData = options.treeData?.groupingField != null;
   const getGroupKey = React.useMemo(() => {
     if (isTreeData) {
       return row => row[options.treeData.groupingField];
@@ -94,6 +136,15 @@ const useMockServer = (dataSetOptions, serverOptions, shouldRequestsFail) => {
       setData(newData);
       return undefined;
     }
+    if (options.dataSet === 'Movies') {
+      const rowsData = {
+        rows: (0, _useMovieData.getMovieRows)(),
+        columns
+      };
+      setData(rowsData);
+      dataCache.set(cacheKey, rowsData);
+      return undefined;
+    }
     let active = true;
     (async () => {
       let rowData;
@@ -125,13 +176,8 @@ const useMockServer = (dataSetOptions, serverOptions, shouldRequestsFail) => {
     };
   }, [columns, isTreeData, options.rowLength, options.treeData?.maxDepth, options.treeData?.groupingField, options.treeData?.averageChildren, options.dataSet, options.maxColumns, index]);
   const fetchRows = React.useCallback(async requestUrl => {
-    if (!data || !requestUrl) {
-      return new Promise(resolve => {
-        resolve({
-          rows: [],
-          rowCount: 0
-        });
-      });
+    if (!requestUrl || !data?.rows) {
+      return sendEmptyResponse();
     }
     const params = decodeParams(requestUrl);
     const verbose = serverOptions?.verbose ?? true;
@@ -159,11 +205,22 @@ const useMockServer = (dataSetOptions, serverOptions, shouldRequestsFail) => {
         setTimeout(() => reject(new Error('Could not fetch the data')), delay);
       });
     }
-    if (isTreeData /* || TODO: `isRowGrouping` */) {
+    if (isTreeData) {
+      const {
+        rows,
+        rootRowCount
+      } = await (0, _serverUtils.processTreeDataRows)(data?.rows ?? [], params, serverOptionsWithDefault, columnsWithDefaultColDef);
+      getRowsResponse = {
+        rows: rows.slice().map(row => (0, _extends2.default)({}, row, {
+          path: undefined
+        })),
+        rowCount: rootRowCount
+      };
+    } else if (isRowGrouping) {
       const {
         rows,
         rootRowCount
-      } = await (0, _serverUtils.processTreeDataRows)(data.rows, params, serverOptionsWithDefault, columnsWithDefaultColDef);
+      } = await (0, _serverUtils.processRowGroupingRows)(data?.rows ?? [], params, serverOptionsWithDefault, columnsWithDefaultColDef);
       getRowsResponse = {
         rows: rows.slice().map(row => (0, _extends2.default)({}, row, {
           path: undefined
@@ -171,12 +228,11 @@ const useMockServer = (dataSetOptions, serverOptions, shouldRequestsFail) => {
         rowCount: rootRowCount
       };
     } else {
-      // plain data
       const {
         returnedRows,
         nextCursor,
         totalRowCount
-      } = await (0, _serverUtils.loadServerRows)(data.rows, (0, _extends2.default)({}, params, params.paginationModel), serverOptionsWithDefault, columnsWithDefaultColDef);
+      } = await (0, _serverUtils.loadServerRows)(data?.rows ?? [], (0, _extends2.default)({}, params, params.paginationModel), serverOptionsWithDefault, columnsWithDefaultColDef);
       getRowsResponse = {
         rows: returnedRows,
         rowCount: totalRowCount,
@@ -191,10 +247,10 @@ const useMockServer = (dataSetOptions, serverOptions, shouldRequestsFail) => {
       }
       resolve(getRowsResponse);
     });
-  }, [data, serverOptions?.verbose, serverOptions?.minDelay, serverOptions?.maxDelay, serverOptions?.useCursorPagination, isTreeData, columnsWithDefaultColDef]);
+  }, [data, serverOptions?.verbose, serverOptions?.minDelay, serverOptions?.maxDelay, serverOptions?.useCursorPagination, isTreeData, columnsWithDefaultColDef, isRowGrouping]);
   return {
     columns: columnsWithDefaultColDef,
-    initialState,
+    initialState: options.dataSet === 'Movies' ? {} : initialState,
     getGroupKey,
     getChildrenCount,
     fetchRows,

package/node/hooks/useMovieData.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useMovieData = void 0;
+exports.useMovieData = exports.getMovieRows = exports.getMovieColumns = void 0;
 const currencyFormatter = new Intl.NumberFormat('en-US', {
   style: 'currency',
   currency: 'USD',
@@ -496,6 +496,10 @@ const ROWS = [{
     name: 'Randy Newman'
   }
 }];
+const getMovieColumns = () => COLUMNS;
+exports.getMovieColumns = getMovieColumns;
+const getMovieRows = () => ROWS;
+exports.getMovieRows = getMovieRows;
 const useMovieData = () => {
   return {
     rows: ROWS,

package/node/hooks/useQuery.js

@@ -12,8 +12,13 @@ var _xDataGridPro = require("@mui/x-data-grid-pro");
 var _internals = require("@mui/x-data-grid/internals");
 var _useDemoData = require("./useDemoData");
 var _serverUtils = require("./serverUtils");
+const DEFAULT_DATASET_OPTIONS = {
+  dataSet: 'Commodity',
+  rowLength: 100,
+  maxColumns: 6
+};
 const createFakeServer = (dataSetOptions, serverOptions) => {
-  const dataSetOptionsWithDefault = (0, _extends2.default)({}, _serverUtils.DEFAULT_DATASET_OPTIONS, dataSetOptions);
+  const dataSetOptionsWithDefault = (0, _extends2.default)({}, DEFAULT_DATASET_OPTIONS, dataSetOptions);
   const serverOptionsWithDefault = (0, _extends2.default)({}, _serverUtils.DEFAULT_SERVER_OPTIONS, serverOptions);
   const columns = (0, _useDemoData.getColumnsFromOptions)(dataSetOptionsWithDefault);
   const initialState = (0, _useDemoData.getInitialState)(dataSetOptionsWithDefault, columns);

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-generator v7.21.0
+ * @mui/x-data-grid-generator v7.22.1
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-generator",
-  "version": "7.21.0",
+  "version": "7.22.1",
   "description": "Generate fake data for demo purposes only.",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -27,7 +27,7 @@
     "chance": "^1.1.12",
     "clsx": "^2.1.1",
     "lru-cache": "^11.0.1",
-    "@mui/x-data-grid-premium": "7.21.0"
+    "@mui/x-data-grid-premium": "7.22.1"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",