Browse Source

perf(discover): Disable resize observer on cell dropdown (#59251)

Scott Cooper 1 year ago
parent
commit
a9bdd4a1f7

+ 5 - 1
static/app/components/compactSelect/control.tsx

@@ -473,7 +473,11 @@ export function Control({
     setTriggerWidth(triggerRef.current?.offsetWidth ?? 0);
   }, [menuWiderThanTrigger, triggerRef]);
 
-  useResizeObserver({ref: triggerRef, onResize: updateTriggerWidth});
+  useResizeObserver({
+    // Passing undefined disables ResizeObserver
+    ref: menuWiderThanTrigger ? triggerRef : undefined,
+    onResize: updateTriggerWidth,
+  });
   // If ResizeObserver is not available, manually update the width
   // when any of [trigger, triggerLabel, triggerProps] changes.
   useEffect(() => {

+ 5 - 1
static/app/components/dropdownMenu/index.tsx

@@ -209,7 +209,11 @@ function DropdownMenu({
     setTriggerWidth(triggerRef.current?.offsetWidth ?? 0);
   }, [menuWiderThanTrigger, triggerRef]);
 
-  useResizeObserver({ref: triggerRef, onResize: updateTriggerWidth});
+  useResizeObserver({
+    // Passing undefined disables ResizeObserver
+    ref: menuWiderThanTrigger ? triggerRef : undefined,
+    onResize: updateTriggerWidth,
+  });
   // If ResizeObserver is not available, manually update the width
   // when any of [trigger, triggerLabel, triggerProps] changes.
   useEffect(() => {

+ 1 - 0
static/app/views/discover/table/cellAction.tsx

@@ -272,6 +272,7 @@ class CellAction extends Component<Props, State> {
                 'left-end',
               ],
             }}
+            menuWiderThanTrigger={false}
             trigger={triggerProps => (
               <ActionMenuTrigger
                 {...triggerProps}