From da95b3843b9767fbfecc16670e7c8224fbae0a44 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kr=C3=A6n=20Hansen?= <kraen.hansen@mongodb.com>
Date: Tue, 1 Jul 2025 09:26:46 +0200
Subject: [PATCH] Simplify ContextMenuItemGroup by removing originListener

---
 .../src/components/context-menu.tsx           | 69 +++++++++----------
 packages/compass-context-menu/src/types.ts    |  5 +-
 .../src/use-context-menu.tsx                  |  5 +-
 3 files changed, 34 insertions(+), 45 deletions(-)

diff --git a/packages/compass-components/src/components/context-menu.tsx b/packages/compass-components/src/components/context-menu.tsx
index bf1b4773e52..08c0ab13d3f 100644
--- a/packages/compass-components/src/components/context-menu.tsx
+++ b/packages/compass-components/src/components/context-menu.tsx
@@ -23,8 +23,7 @@ export function ContextMenuProvider({
 export function ContextMenu({ menu }: ContextMenuWrapperProps) {
   const menuRef = useRef(null);
 
-  const position = menu.position;
-  const itemGroups = menu.itemGroups;
+  const { position, itemGroups } = menu;
 
   useEffect(() => {
     if (!menu.isOpen) {
@@ -50,42 +49,38 @@ export function ContextMenu({ menu }: ContextMenuWrapperProps) {
         setOpen={menu.close}
         justify="start"
       >
-        {itemGroups.map(
-          (itemGroup: ContextMenuItemGroup, groupIndex: number) => {
-            return (
-              <div
-                key={`menu-group-${groupIndex}`}
-                data-testid={`menu-group-${groupIndex}`}
-              >
-                {itemGroup.items.map(
-                  (item: ContextMenuItem, itemIndex: number) => {
-                    return (
-                      <MenuItem
-                        key={`menu-group-${groupIndex}-item-${itemIndex}`}
-                        data-text={item.label}
-                        data-testid={`menu-group-${groupIndex}-item-${itemIndex}`}
-                        onClick={(evt: React.MouseEvent) => {
-                          item.onAction?.(evt);
-                          menu.close();
-                        }}
-                      >
-                        {item.label}
-                      </MenuItem>
-                    );
-                  }
-                )}
-                {groupIndex < itemGroups.length - 1 && (
-                  <div
-                    key={`menu-group-${groupIndex}-separator`}
-                    data-testid={`menu-group-${groupIndex}-separator`}
+        {itemGroups.map((items: ContextMenuItemGroup, groupIndex: number) => {
+          return (
+            <div
+              key={`menu-group-${groupIndex}`}
+              data-testid={`menu-group-${groupIndex}`}
+            >
+              {items.map((item: ContextMenuItem, itemIndex: number) => {
+                return (
+                  <MenuItem
+                    key={`menu-group-${groupIndex}-item-${itemIndex}`}
+                    data-text={item.label}
+                    data-testid={`menu-group-${groupIndex}-item-${itemIndex}`}
+                    onClick={(evt: React.MouseEvent) => {
+                      item.onAction?.(evt);
+                      menu.close();
+                    }}
                   >
-                    <MenuSeparator />
-                  </div>
-                )}
-              </div>
-            );
-          }
-        )}
+                    {item.label}
+                  </MenuItem>
+                );
+              })}
+              {groupIndex < itemGroups.length - 1 && (
+                <div
+                  key={`menu-group-${groupIndex}-separator`}
+                  data-testid={`menu-group-${groupIndex}-separator`}
+                >
+                  <MenuSeparator />
+                </div>
+              )}
+            </div>
+          );
+        })}
       </Menu>
     </div>
   );
diff --git a/packages/compass-context-menu/src/types.ts b/packages/compass-context-menu/src/types.ts
index 163abe56132..1b342f9a3da 100644
--- a/packages/compass-context-menu/src/types.ts
+++ b/packages/compass-context-menu/src/types.ts
@@ -1,7 +1,4 @@
-export interface ContextMenuItemGroup {
-  items: ContextMenuItem[];
-  originListener: (event: MouseEvent) => void;
-}
+export type ContextMenuItemGroup = ContextMenuItem[];
 
 export type ContextMenuState = {
   isOpen: boolean;
diff --git a/packages/compass-context-menu/src/use-context-menu.tsx b/packages/compass-context-menu/src/use-context-menu.tsx
index a0b874b656c..1ff36305487 100644
--- a/packages/compass-context-menu/src/use-context-menu.tsx
+++ b/packages/compass-context-menu/src/use-context-menu.tsx
@@ -36,10 +36,7 @@ export function useContextMenu<
        */
       registerItems(items: ContextMenuItem[]) {
         function listener(event: MouseEvent): void {
-          appendContextMenuContent(event, {
-            items,
-            originListener: listener,
-          });
+          appendContextMenuContent(event, items);
         }
 
         return (trigger: HTMLElement | null) => {