feat(database): add global menu open listener (#9032)

toeverything · Dec 19, 2024 · 2213c04 · 2213c04
1 parent 08a9d51
commit 2213c04
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 6 deletions.
diff --git a/packages/affine/components/src/context-menu/menu-renderer.ts b/packages/affine/components/src/context-menu/menu-renderer.ts
@@ -502,11 +502,12 @@ const popMobileMenu = (options: MenuOptions): MenuHandler => {
   };
   return {
     close: () => {
-      closePopup();
+      menu.close();
     },
     menu,
     reopen: () => {
-      options.onClose?.();
+      menu.close();
+      popMobileMenu(options);
     },
   };
 };
@@ -526,15 +527,16 @@ export const popMenu = (
   const onClose = () => {
     props.options.onClose?.();
     popupEnd();
+    closePopup();
   };
   const menu = new Menu({
     ...props.options,
-    onClose: () => {
-      closePopup();
-    },
+    onClose: onClose,
   });
   const closePopup = createPopup(target, menu.menuElement, {
-    onClose: onClose,
+    onClose: () => {
+      menu.close();
+    },
     middleware: props.middleware ?? [
       autoPlacement({
         allowedPlacements: [

diff --git a/packages/affine/components/src/context-menu/menu.ts b/packages/affine/components/src/context-menu/menu.ts
@@ -40,11 +40,30 @@ export type MenuOptions = {
   items: MenuConfig[];
 };
 
+// Global menu open listener type
+type MenuOpenListener = (menu: Menu) => (() => void) | void;
+
+// Global menu open listeners
+const menuOpenListeners = new Set<MenuOpenListener>();
+
+// Add global menu open listener
+export function onMenuOpen(listener: MenuOpenListener) {
+  menuOpenListeners.add(listener);
+  // Return cleanup function
+  return () => {
+    menuOpenListeners.delete(listener);
+  };
+}
+
 export class Menu {
+  private _cleanupFns: Array<() => void> = [];
+
   private _currentFocused$ = signal<MenuFocusable>();
 
   private _subMenu$ = signal<Menu>();
 
+  closed = false;
+
   readonly currentFocused$ = computed(() => this._currentFocused$.value);
 
   menuElement: MenuComponentInterface;
@@ -68,9 +87,25 @@ export class Menu {
       ? new MobileMenuComponent()
       : new MenuComponent();
     this.menuElement.menu = this;
+
+    // Call global menu open listeners
+    menuOpenListeners.forEach(listener => {
+      const cleanup = listener(this);
+      if (cleanup) {
+        this._cleanupFns.push(cleanup);
+      }
+    });
   }
 
   close() {
+    if (this.closed) {
+      return;
+    }
+    this.closed = true;
+    // Execute cleanup functions
+    this._cleanupFns.forEach(cleanup => cleanup());
+    this._cleanupFns = [];
+
     this.menuElement.remove();
     this.options.onClose?.();
   }