refactor(useNestedRows): implement types (#5460)

carbon-design-system · Jun 14, 2024 · 8929392 · 8929392
1 parent df4eac8
commit 8929392
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 24 deletions.
diff --git a/packages/ibm-products/src/components/Datagrid/types/index.ts b/packages/ibm-products/src/components/Datagrid/types/index.ts
@@ -264,6 +264,7 @@ export interface DataGridState<T extends object = any>
   onVirtualScroll?: (evt?: boolean) => void;
   fetchMoreData?: () => void;
   loadMoreThreshold?: number;
+  expandedRowIds?: object;
   onRowClick?: (row, event) => void;
   onSort?: boolean;
 }

diff --git a/.../src/components/Datagrid/useNestedRows.js → .../src/components/Datagrid/useNestedRows.ts b/.../src/components/Datagrid/useNestedRows.js → .../src/components/Datagrid/useNestedRows.ts
@@ -9,39 +9,27 @@ import cx from 'classnames';
 import { pkg } from '../../settings';
 import useNestedRowExpander from './useNestedRowExpander';
 import { useEffect } from 'react';
+import { Hooks, TableInstance } from 'react-table';
+import { DataGridState, DatagridRow } from './types';
 
 const blockClass = `${pkg.prefix}--datagrid`;
 
-const useNestedRows = (hooks) => {
+const useNestedRows = (hooks: Hooks) => {
   useNestedRowExpander(hooks);
-  const useInstance = (instance) => {
-    useEffect(() => {
-      const { rows } = instance;
-      const defaultExpandedRows = rows.filter(
-        (row) => row?.original?.defaultExpanded
-      );
-      if (defaultExpandedRows?.length) {
-        defaultExpandedRows.map((defaultExpandedRow) => {
-          if (
-            !defaultExpandedRow.isExpanded &&
-            !defaultExpandedRow.hasExpanded
-          ) {
-            defaultExpandedRow?.toggleRowExpanded?.();
-            defaultExpandedRow.hasExpanded = true;
-            return;
-          }
-        });
-      }
-    }, [instance, instance.rows]);
+  const useInstance = (instance: TableInstance) => {
     // This useEffect will expand rows if they exist in the initialState obj
     useEffect(() => {
       const { rows, initialState } = instance;
-      const { expandedRowIds } = initialState;
+      const { expandedRowIds } = initialState as DataGridState;
+
       if (expandedRowIds) {
         Object.keys(expandedRowIds).forEach((key) => {
-          const row = rows.filter((r) => r.id.toString() === key.toString());
-          if (row.length && key.toString() === row[0].id.toString()) {
-            row[0].toggleRowExpanded();
+          const row = rows.filter(
+            (r) => r.id.toString() === key.toString()
+          ) as DatagridRow[];
+
+          if (row?.length && key.toString() === row[0].id.toString()) {
+            row[0]?.toggleRowExpanded();
           }
         });
       }