[DataGrid] Make rows an optional prop (#12478)

mui · Mar 20, 2024 · ce28aa1 · ce28aa1
1 parent dd1ef3b
commit ce28aa1
Show file tree

Hide file tree

Showing 11 changed files with 35 additions and 27 deletions.
diff --git a/docs/pages/x/api/data-grid/data-grid-premium.json b/docs/pages/x/api/data-grid/data-grid-premium.json
@@ -4,10 +4,6 @@
       "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
       "required": true
     },
-    "rows": {
-      "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
-      "required": true
-    },
     "aggregationFunctions": {
       "type": { "name": "object" },
       "default": "GRID_AGGREGATION_FUNCTIONS"
@@ -563,6 +559,10 @@
     "rowModesModel": { "type": { "name": "object" } },
     "rowPositionsDebounceMs": { "type": { "name": "number" }, "default": "166" },
     "rowReordering": { "type": { "name": "bool" }, "default": "false" },
+    "rows": {
+      "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
+      "default": "[]"
+    },
     "rowSelection": { "type": { "name": "bool" }, "default": "true" },
     "rowSelectionModel": {
       "type": {

diff --git a/docs/pages/x/api/data-grid/data-grid-pro.json b/docs/pages/x/api/data-grid/data-grid-pro.json
@@ -4,10 +4,6 @@
       "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
       "required": true
     },
-    "rows": {
-      "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
-      "required": true
-    },
     "apiRef": { "type": { "name": "shape", "description": "{ current: object }" } },
     "aria-label": { "type": { "name": "string" } },
     "aria-labelledby": { "type": { "name": "string" } },
@@ -501,6 +497,10 @@
     "rowModesModel": { "type": { "name": "object" } },
     "rowPositionsDebounceMs": { "type": { "name": "number" }, "default": "166" },
     "rowReordering": { "type": { "name": "bool" }, "default": "false" },
+    "rows": {
+      "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
+      "default": "[]"
+    },
     "rowSelection": { "type": { "name": "bool" }, "default": "true" },
     "rowSelectionModel": {
       "type": {

diff --git a/docs/pages/x/api/data-grid/data-grid.json b/docs/pages/x/api/data-grid/data-grid.json
@@ -4,10 +4,6 @@
       "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
       "required": true
     },
-    "rows": {
-      "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
-      "required": true
-    },
     "apiRef": { "type": { "name": "shape", "description": "{ current: object }" } },
     "aria-label": { "type": { "name": "string" } },
     "aria-labelledby": { "type": { "name": "string" } },
@@ -417,6 +413,10 @@
     "rowHeight": { "type": { "name": "number" }, "default": "52" },
     "rowModesModel": { "type": { "name": "object" } },
     "rowPositionsDebounceMs": { "type": { "name": "number" }, "default": "166" },
+    "rows": {
+      "type": { "name": "arrayOf", "description": "Array&lt;object&gt;" },
+      "default": "[]"
+    },
     "rowSelection": { "type": { "name": "bool" }, "default": "true" },
     "rowSelectionModel": {
       "type": {

diff --git a/packages/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx b/packages/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx
@@ -926,8 +926,9 @@ DataGridPremiumRaw.propTypes = {
   rowReordering: PropTypes.bool,
   /**
    * Set of rows of type [[GridRowsProp]].
+   * @default []
    */
-  rows: PropTypes.arrayOf(PropTypes.object).isRequired,
+  rows: PropTypes.arrayOf(PropTypes.object),
   /**
    * If `false`, the row selection mode is disabled.
    * @default true

diff --git a/packages/x-data-grid-premium/src/models/dataGridPremiumProps.ts b/packages/x-data-grid-premium/src/models/dataGridPremiumProps.ts
@@ -38,7 +38,7 @@ export interface DataGridPremiumPropsWithComplexDefaultValueBeforeProcessing
  */
 export interface DataGridPremiumProps<R extends GridValidRowModel = any>
   extends Omit<
-    Partial<DataGridPremiumPropsWithDefaultValue> &
+    Partial<DataGridPremiumPropsWithDefaultValue<R>> &
       DataGridPremiumPropsWithComplexDefaultValueBeforeProcessing &
       DataGridPremiumPropsWithoutDefaultValue<R>,
     DataGridPremiumForcedPropsKey
@@ -64,7 +64,8 @@ export type DataGridPremiumForcedPropsKey = 'signature';
  * None of the entry of this interface should be optional, they all have default values and `DataGridProps` already applies a `Partial<DataGridSimpleOptions>` for the public interface.
  * The controlled model do not have a default value at the prop processing level, so they must be defined in `DataGridOtherProps`.
  */
-export interface DataGridPremiumPropsWithDefaultValue extends DataGridProPropsWithDefaultValue {
+export interface DataGridPremiumPropsWithDefaultValue<R extends GridValidRowModel = any>
+  extends DataGridProPropsWithDefaultValue<R> {
   /**
    * If `true`, the cell selection mode is enabled.
    * @default false

diff --git a/packages/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx b/packages/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx
@@ -818,8 +818,9 @@ DataGridProRaw.propTypes = {
   rowReordering: PropTypes.bool,
   /**
    * Set of rows of type [[GridRowsProp]].
+   * @default []
    */
-  rows: PropTypes.arrayOf(PropTypes.object).isRequired,
+  rows: PropTypes.arrayOf(PropTypes.object),
   /**
    * If `false`, the row selection mode is disabled.
    * @default true

diff --git a/packages/x-data-grid-pro/src/models/dataGridProProps.ts b/packages/x-data-grid-pro/src/models/dataGridProProps.ts
@@ -41,7 +41,7 @@ interface DataGridProPropsWithComplexDefaultValueBeforeProcessing
  */
 export interface DataGridProProps<R extends GridValidRowModel = any>
   extends Omit<
-    Partial<DataGridProPropsWithDefaultValue> &
+    Partial<DataGridProPropsWithDefaultValue<R>> &
       DataGridProPropsWithComplexDefaultValueBeforeProcessing &
       DataGridProPropsWithoutDefaultValue<R>,
     DataGridProForcedPropsKey
@@ -56,7 +56,7 @@ interface DataGridProPropsWithComplexDefaultValueAfterProcessing
  * The props of the `DataGridPro` component after the pre-processing phase.
  */
 export interface DataGridProProcessedProps<R extends GridValidRowModel = any>
-  extends DataGridProPropsWithDefaultValue,
+  extends DataGridProPropsWithDefaultValue<R>,
     DataGridProPropsWithComplexDefaultValueAfterProcessing,
     Omit<DataGridProPropsWithoutDefaultValue<R>, 'componentsProps'> {}
 
@@ -67,7 +67,8 @@ export type DataGridProForcedPropsKey = 'signature';
  * None of the entry of this interface should be optional, they all have default values and `DataGridProps` already applies a `Partial<DataGridSimpleOptions>` for the public interface
  * The controlled model do not have a default value at the prop processing level, so they must be defined in `DataGridOtherProps`
  */
-export interface DataGridProPropsWithDefaultValue extends DataGridPropsWithDefaultValues {
+export interface DataGridProPropsWithDefaultValue<R extends GridValidRowModel = any>
+  extends DataGridPropsWithDefaultValues<R> {
   /**
    * Set the area in `px` at the bottom of the grid viewport where onRowsScrollEnd is called.
    * @default 80

diff --git a/packages/x-data-grid-pro/src/tests/rows.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/rows.DataGridPro.test.tsx
@@ -21,13 +21,14 @@ import {
   GridApi,
   gridFocusCellSelector,
   gridClasses,
+  GridValidRowModel,
 } from '@mui/x-data-grid-pro';
 import { useBasicDemoData, getBasicGridData } from '@mui/x-data-grid-generator';
 
 const isJSDOM = /jsdom/.test(window.navigator.userAgent);
 
 describe('<DataGridPro /> - Rows', () => {
-  let baselineProps: DataGridProProps;
+  let baselineProps: DataGridProProps & { rows: GridValidRowModel };
 
   const { clock, render } = createRenderer({ clock: 'fake' });
 

diff --git a/packages/x-data-grid/src/DataGrid/DataGrid.tsx b/packages/x-data-grid/src/DataGrid/DataGrid.tsx
@@ -680,8 +680,9 @@ DataGridRaw.propTypes = {
   rowPositionsDebounceMs: PropTypes.number,
   /**
    * Set of rows of type [[GridRowsProp]].
+   * @default []
    */
-  rows: PropTypes.arrayOf(PropTypes.object).isRequired,
+  rows: PropTypes.arrayOf(PropTypes.object),
   /**
    * If `false`, the row selection mode is disabled.
    * @default true

diff --git a/packages/x-data-grid/src/DataGrid/useDataGridProps.ts b/packages/x-data-grid/src/DataGrid/useDataGridProps.ts
@@ -33,6 +33,7 @@ export const DATA_GRID_PROPS_DEFAULT_VALUES: DataGridPropsWithDefaultValues = {
   checkboxSelectionVisibleOnly: false,
   columnBufferPx: 150,
   rowBufferPx: 150,
+  rows: [],
   rowSelection: true,
   disableColumnFilter: false,
   disableColumnMenu: false,

diff --git a/packages/x-data-grid/src/models/props/DataGridProps.ts b/packages/x-data-grid/src/models/props/DataGridProps.ts
@@ -45,7 +45,7 @@ export interface GridExperimentalFeatures {
  * The props users can give to the `DataGrid` component.
  */
 export type DataGridProps<R extends GridValidRowModel = any> = Omit<
-  Partial<DataGridPropsWithDefaultValues> &
+  Partial<DataGridPropsWithDefaultValues<R>> &
     DataGridPropsWithComplexDefaultValueBeforeProcessing &
     DataGridPropsWithoutDefaultValue<R>,
   DataGridForcedPropsKey
@@ -105,7 +105,7 @@ export interface DataGridPropsWithComplexDefaultValueBeforeProcessing {
  * The controlled model do not have a default value at the prop processing level, so they must be defined in `DataGridOtherProps`
  * TODO: add multiSortKey
  */
-export interface DataGridPropsWithDefaultValues {
+export interface DataGridPropsWithDefaultValues<R extends GridValidRowModel = any> {
   /**
    * If `true`, the Data Grid height is dynamic and follow the number of rows in the Data Grid.
    * @default false
@@ -275,6 +275,11 @@ export interface DataGridPropsWithDefaultValues {
    * @default "client"
    */
   paginationMode: GridFeatureMode;
+  /**
+   * Set of rows of type [[GridRowsProp]].
+   * @default []
+   */
+  rows: GridRowsProp<R>;
   /**
    * Sets the height in pixel of a row in the Data Grid.
    * @default 52
@@ -723,10 +728,6 @@ export interface DataGridPropsWithoutDefaultValue<R extends GridValidRowModel =
    * Nonce of the inline styles for [Content Security Policy](https://www.w3.org/TR/2016/REC-CSP2-20161215/#script-src-the-nonce-attribute).
    */
   nonce?: string;
-  /**
-   * Set of rows of type [[GridRowsProp]].
-   */
-  rows: GridRowsProp<R>;
   /**
    * The initial state of the DataGrid.
    * The data in it will be set in the state on initialization but will not be controlled.