fix bug in suspense

mui · Apr 11, 2024 · ed31719 · ed31719
1 parent 4db77b1
commit ed31719
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 4 deletions.
diff --git a/packages/grid/x-data-grid-pro/src/components/headerFiltering/GridHeaderFilterCell.tsx b/packages/grid/x-data-grid-pro/src/components/headerFiltering/GridHeaderFilterCell.tsx
@@ -124,7 +124,9 @@ const GridHeaderFilterCell = React.forwardRef<HTMLDivElement, GridHeaderFilterCe
         }
         const elementToFocus = focusableElement || cellRef.current;
         elementToFocus?.focus();
-        apiRef.current.columnHeadersContainerElementRef!.current!.scrollLeft = 0;
+        if (apiRef.current.columnHeadersContainerElementRef?.current) {
+          apiRef.current.columnHeadersContainerElementRef.current.scrollLeft = 0;
+        }
       }
     }, [InputComponent, apiRef, hasFocus, isEditing, isMenuOpen]);
 

diff --git a/packages/grid/x-data-grid-pro/src/utils/domUtils.ts b/packages/grid/x-data-grid-pro/src/utils/domUtils.ts
@@ -58,7 +58,10 @@ export function findGridCellElementsFromCol(col: HTMLElement, api: GridPrivateAp
 }
 
 export function findGridHeader(api: GridPrivateApiPro, field: string) {
-  const headers = api.columnHeadersContainerElementRef!.current!;
+  const headers = api.columnHeadersContainerElementRef?.current;
+  if (!headers) {
+    return null;
+  }
   return headers.querySelector(`:scope > div > div > [data-field="${field}"][role="columnheader"]`);
 }
 

diff --git a/packages/grid/x-data-grid/src/components/columnHeaders/GridColumnHeaderItem.tsx b/packages/grid/x-data-grid/src/components/columnHeaders/GridColumnHeaderItem.tsx
@@ -221,7 +221,9 @@ function GridColumnHeaderItem(props: GridColumnHeaderItemProps) {
       const focusableElement = headerCellRef.current!.querySelector<HTMLElement>('[tabindex="0"]');
       const elementToFocus = focusableElement || headerCellRef.current;
       elementToFocus?.focus();
-      apiRef.current.columnHeadersContainerElementRef!.current!.scrollLeft = 0;
+      if (apiRef.current.columnHeadersContainerElementRef?.current) {
+        apiRef.current.columnHeadersContainerElementRef.current.scrollLeft = 0;
+      }
     }
   }, [apiRef, hasFocus]);
 

diff --git a/packages/grid/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx b/packages/grid/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
@@ -129,7 +129,9 @@ export const useGridColumnHeaders = (props: UseGridColumnHeadersProps) => {
   );
 
   React.useEffect(() => {
-    apiRef.current.columnHeadersContainerElementRef!.current!.scrollLeft = 0;
+    if (apiRef.current.columnHeadersContainerElementRef?.current) {
+      apiRef.current.columnHeadersContainerElementRef.current.scrollLeft = 0;
+    }
   }, [apiRef]);
 
   // memoize `getFirstColumnIndexToRender`, since it's called on scroll