#248 open only one menu on keyboard shortcut

Author: joepio

data-browser/src/components/Dropdown/index.tsx

@@ -26,6 +26,8 @@ interface DropdownMenuProps {
   /** The list of menu items */
   items: Item[];
   trigger: DropdownTriggerRenderFunction;
+  /** Enables the keyboard shortcut */
+  isMainMenu?: boolean;
 }
 
 /** Gets the index of an array and loops around when at the beginning or end */
@@ -88,6 +90,7 @@ function normalizeItems(items: Item[]) {
 export function DropdownMenu({
   items,
   trigger,
+  isMainMenu,
 }: DropdownMenuProps): JSX.Element {
   const menuId = useId();
   const dropdownRef = useRef<HTMLDivElement>(null);
@@ -167,7 +170,7 @@ export function DropdownMenu({
       handleToggle();
       setUseKeys(true);
     },
-    {},
+    { enabled: !!isMainMenu },
     [isActive],
   );
   // Click / open the item

data-browser/src/components/Navigation.tsx

@@ -136,6 +136,7 @@ function NavBar(): JSX.Element {
 
       {showButtons && subject && (
         <ResourceContextMenu
+          isMainMenu
           subject={subject}
           trigger={MenuBarDropdownTrigger}
         />

data-browser/src/components/ResourceContextMenu/index.tsx

@@ -31,6 +31,8 @@ export interface ResourceContextMenuProps {
   hide?: string[];
   trigger?: DropdownTriggerRenderFunction;
   simple?: boolean;
+  /** If it's the primary menu in the navbar. Used for triggering keyboard shortcut */
+  isMainMenu?: boolean;
 }
 
 /** Dropdown menu that opens a bunch of actions for some resource */
@@ -39,6 +41,7 @@ function ResourceContextMenu({
   hide,
   trigger,
   simple,
+  isMainMenu,
 }: ResourceContextMenuProps) {
   const store = useStore();
   const navigate = useNavigate();
@@ -149,7 +152,13 @@ function ResourceContextMenu({
 
   const triggerComp = trigger ?? buildDefaultTrigger(<FaEllipsisV />);
 
-  return <DropdownMenu items={filteredItems} trigger={triggerComp} />;
+  return (
+    <DropdownMenu
+      items={filteredItems}
+      trigger={triggerComp}
+      isMainMenu={isMainMenu}
+    />
+  );
 }
 
 export default ResourceContextMenu;