[Proposed refactors]

cee-chen · cee-chen · commit 6b870fd52599 · 2021-10-21T10:12:03.000-07:00
- Rename `recalculateRowHeight` to `setAutoRowHeight`

- DRY out setAutoRowHeight to be reusable by both the resize observer and during props update (NB: This leads to some repetition with the height being obtained twice, but will not be an issue shortly as I'll be refactoring/removing the cell wrapper observer in a future PR)

- Refactor rowHeightUtils.isAutoHeight to accept an undefined rowHeightsOptions
diff --git a/src/components/datagrid/body/data_grid_cell.tsx b/src/components/datagrid/body/data_grid_cell.tsx
@@ -194,28 +194,24 @@ export class EuiDataGridCell extends Component<
     }
   };
 
-  recalculateRowHeight() {
-    const cellRef = this.cellRef.current;
-    const { getRowHeight, rowHeightUtils, rowHeightsOptions } = this.props;
-
-    if (cellRef && getRowHeight && rowHeightUtils && rowHeightsOptions) {
-      const { rowIndex, colIndex, visibleRowIndex } = this.props;
+  setAutoRowHeight = () => {
+    const { rowHeightUtils, rowHeightsOptions, rowIndex } = this.props;
+    if (
+      this.cellContentsRef &&
+      rowHeightUtils &&
+      rowHeightUtils.isAutoHeight(rowIndex, rowHeightsOptions)
+    ) {
+      const { colIndex, visibleRowIndex } = this.props;
+      const rowHeight = this.cellContentsRef.offsetHeight;
 
-      const isAutoHeight = rowHeightUtils.isAutoHeight(
+      rowHeightUtils.setRowHeight(
         rowIndex,
-        rowHeightsOptions
+        colIndex,
+        rowHeight,
+        visibleRowIndex
       );
-
-      if (isAutoHeight) {
-        rowHeightUtils.setRowHeight(
-          rowIndex,
-          colIndex,
-          this.cellContentsRef?.offsetHeight,
-          visibleRowIndex
-        );
-      }
     }
-  }
+  };
 
   componentDidMount() {
     this.unsubscribeCell = this.context.onFocusUpdate(
@@ -240,7 +236,7 @@ export class EuiDataGridCell extends Component<
   }
 
   componentDidUpdate(prevProps: EuiDataGridCellProps) {
-    this.recalculateRowHeight();
+    this.setAutoRowHeight();
 
     if (this.props.columnId !== prevProps.columnId) {
       this.setCellProps({});
@@ -291,27 +287,10 @@ export class EuiDataGridCell extends Component<
 
   setCellContentsRef = (ref: HTMLDivElement | null) => {
     this.cellContentsRef = ref;
-    const { rowHeightUtils, rowHeightsOptions, rowIndex } = this.props;
-    if (
-      hasResizeObserver &&
-      rowHeightUtils &&
-      rowHeightsOptions &&
-      rowHeightUtils.isAutoHeight(rowIndex, rowHeightsOptions)
-    ) {
-      if (ref) {
-        const { colIndex, visibleRowIndex } = this.props;
-
-        const setRowHeight = (rowHeight: number) =>
-          rowHeightUtils.setRowHeight(
-            rowIndex,
-            colIndex,
-            rowHeight,
-            visibleRowIndex
-          );
-        this.contentObserver = this.observeHeight(ref, setRowHeight);
-      } else if (this.contentObserver) {
-        this.contentObserver.disconnect();
-      }
+    if (ref && hasResizeObserver) {
+      this.contentObserver = this.observeHeight(ref, this.setAutoRowHeight);
+    } else if (this.contentObserver) {
+      this.contentObserver.disconnect();
     }
     this.preventTabbing();
   };
diff --git a/src/components/datagrid/row_height_utils.ts b/src/components/datagrid/row_height_utils.ts
@@ -109,13 +109,13 @@ export class RowHeightUtils {
 
   isAutoHeight(
     rowIndex: number,
-    rowHeightsOptions: EuiDataGridRowHeightsOptions
+    rowHeightsOptions?: EuiDataGridRowHeightsOptions
   ) {
-    if (rowHeightsOptions.rowHeights?.[rowIndex] === AUTO_HEIGHT) {
+    if (rowHeightsOptions?.rowHeights?.[rowIndex] === AUTO_HEIGHT) {
       return true;
     }
 
-    if (rowHeightsOptions.defaultHeight === AUTO_HEIGHT) {
+    if (rowHeightsOptions?.defaultHeight === AUTO_HEIGHT) {
       return true;
     }
 

Original file line number	Diff line number	Diff line change
`@@ -109,13 +109,13 @@ export class RowHeightUtils {`
`109`	`109`
`110`	`110`	`isAutoHeight(`
`111`	`111`	`rowIndex: number,`
`112`		`- rowHeightsOptions: EuiDataGridRowHeightsOptions`
	`112`	`+ rowHeightsOptions?: EuiDataGridRowHeightsOptions`
`113`	`113`	`) {`
`114`		`- if (rowHeightsOptions.rowHeights?.[rowIndex] === AUTO_HEIGHT) {`
	`114`	`+ if (rowHeightsOptions?.rowHeights?.[rowIndex] === AUTO_HEIGHT) {`
`115`	`115`	`return true;`
`116`	`116`	`}`
`117`	`117`
`118`		`- if (rowHeightsOptions.defaultHeight === AUTO_HEIGHT) {`
	`118`	`+ if (rowHeightsOptions?.defaultHeight === AUTO_HEIGHT) {`
`119`	`119`	`return true;`
`120`	`120`	`}`
`121`	`121`