Merge pull request #12187 from lokanandaprabhu/feature/OCPBUGS-47470

Bug 2115265: Search page: LazyActionMenus are shown below Add/Remove from navigation button
openshift · Feb 15, 2023 · 106dab4 · 106dab4
2 parents 32cef52 + 0900c40
commit 106dab4
Showing 1 changed file with 2 additions and 7 deletions.
diff --git a/frontend/packages/console-shared/src/components/actions/LazyActionMenu.tsx b/frontend/packages/console-shared/src/components/actions/LazyActionMenu.tsx
@@ -12,15 +12,13 @@ import { ActionMenuVariant } from './types';
 type LazyMenuRendererProps = {
   isOpen: boolean;
   actions: Action[];
-  containerRef: React.RefObject<HTMLDivElement>;
   menuRef: React.RefObject<HTMLDivElement>;
   toggleRef: React.RefObject<HTMLButtonElement>;
 } & React.ComponentProps<typeof ActionMenuContent>;
 
 const LazyMenuRenderer: React.FC<LazyMenuRendererProps> = ({
   isOpen,
   actions,
-  containerRef,
   menuRef,
   toggleRef,
   ...restProps
@@ -54,7 +52,6 @@ const LazyMenuRenderer: React.FC<LazyMenuRendererProps> = ({
       popper={menu}
       placement="bottom-end"
       isVisible={isOpen}
-      appendTo={containerRef.current}
       popperMatchesTriggerWidth={false}
     />
   );
@@ -71,7 +68,6 @@ const LazyActionMenu: React.FC<LazyActionMenuProps> = ({
   const [initActionLoader, setInitActionLoader] = React.useState<boolean>(false);
   const menuRef = React.useRef<HTMLDivElement>(null);
   const toggleRef = React.useRef<HTMLButtonElement>(null);
-  const containerRef = React.useRef<HTMLDivElement>(null);
 
   const hideMenu = () => {
     setIsOpen(false);
@@ -82,7 +78,7 @@ const LazyActionMenu: React.FC<LazyActionMenuProps> = ({
   }, []);
 
   return (
-    <div ref={containerRef}>
+    <>
       <ActionMenuToggle
         isOpen={isOpen}
         isDisabled={isDisabled}
@@ -104,7 +100,6 @@ const LazyActionMenu: React.FC<LazyActionMenuProps> = ({
                   isOpen={isOpen}
                   actions={extra ? menuActions : actions}
                   options={extra ? menuOptions : options}
-                  containerRef={containerRef}
                   menuRef={menuRef}
                   toggleRef={toggleRef}
                   onClick={hideMenu}
@@ -115,7 +110,7 @@ const LazyActionMenu: React.FC<LazyActionMenuProps> = ({
           }}
         </ActionServiceProvider>
       )}
-    </div>
+    </>
   );
 };