Merge pull request #520 from H7GhosT/fix/delayed-submenu-opening

morethanwords · web-flow · commit 834ff11099a6 · 2025-11-05T22:23:17.000+07:00
Fix opening submenu when there is a delay
diff --git a/src/components/chat/contextMenu.ts b/src/components/chat/contextMenu.ts
@@ -81,7 +81,7 @@ import {getFullDate} from '../../helpers/date/getFullDate';
 import PaidMessagesInterceptor, {PAYMENT_REJECTED} from './paidMessagesInterceptor';
 import {MySponsoredPeer} from '../../lib/appManagers/appChatsManager';
 import {PopupChecklist} from '../popups/checklist';
-import createSubmenuTrigger from '../createSubmenuTrigger';
+import createSubmenuTrigger, {CreateSubmenuArgs} from '../createSubmenuTrigger';
 import noop from '../../helpers/noop';
 import {isSensitive} from '../../helpers/restrictions';
 import {hasSensitiveSpoiler} from '../wrappers/mediaSpoiler';
@@ -998,7 +998,7 @@ export default class ChatContextMenu {
     }];
   }
 
-  private createChecklistItemSubmenu = async() => {
+  private createChecklistItemSubmenu = async({middleware}: CreateSubmenuArgs) => {
     const {item, completion} = this.checklistItem;
     const message = this.message as Message.message & {media: MessageMedia.messageMediaToDo};
     const canEdit = await this.managers.appMessagesManager.canEditMessage(message, 'text');
@@ -1058,10 +1058,14 @@ export default class ChatContextMenu {
           });
         }
       }
-    ]
+    ];
+
+    const filteredButtons = await filterAsync(buttons, (button) => button.verify?.() ?? true);
+
+    if(!middleware()) return;
 
     return ButtonMenu({
-      buttons: await filterAsync(buttons, (button) => button.verify?.() ?? true)
+      buttons: filteredButtons
     })
   }
 
diff --git a/src/components/createSubmenuTrigger.ts b/src/components/createSubmenuTrigger.ts
@@ -1,4 +1,5 @@
 import {CLICK_EVENT_NAME} from '../helpers/dom/clickEvent';
+import {getMiddleware, Middleware, MiddlewareHelper} from '../helpers/middleware';
 import noop from '../helpers/noop';
 import pause from '../helpers/schedulers/pause';
 import {i18n} from '../lib/langPack';
@@ -9,14 +10,22 @@ import Icon from './icon';
 
 let submenuHelperIdSeed = 0;
 
+export type CreateSubmenuArgs = {
+  middleware: Middleware;
+};
+
 export default function createSubmenuTrigger(
   options: Pick<ButtonMenuItemOptionsVerifiable, 'text' | 'regularText' | 'icon' | 'verify' | 'separator' | 'separatorDown' | 'onClose'>,
-  createSubmenu: () => MaybePromise<HTMLElement>
+  createSubmenu: (args: CreateSubmenuArgs) => MaybePromise<HTMLElement>
 ) {
-  let isDisabled = false;
+  let
+    isDisabled = false,
+    currentMiddleware: MiddlewareHelper
+  ;
 
   const onOpen = () => {
     if(!menuBtnOptions.element) return;
+    currentMiddleware = getMiddleware();
 
     menuBtnOptions.element.addEventListener(CLICK_EVENT_NAME, (e) => {
       e.stopPropagation();
@@ -26,7 +35,7 @@ export default function createSubmenuTrigger(
     attachFloatingButtonMenu({
       element: menuBtnOptions.element,
       direction: 'right-start',
-      createMenu: createSubmenu,
+      createMenu: () => createSubmenu({middleware: currentMiddleware.get()}),
       offset: [-5, -5],
       level: 2,
       triggerEvent: 'mouseenter',
@@ -36,6 +45,7 @@ export default function createSubmenuTrigger(
   };
 
   const onClose = async() => {
+    currentMiddleware?.destroy();
     // Prevents hover from triggering when the menu is closing
     isDisabled = true;
     await pause(200);
diff --git a/src/components/dialogsContextMenu.ts b/src/components/dialogsContextMenu.ts
@@ -22,11 +22,9 @@ import createContextMenu from '../helpers/dom/createContextMenu';
 import PopupElement from './popups';
 import cancelEvent from '../helpers/dom/cancelEvent';
 import IS_SHARED_WORKER_SUPPORTED from '../environment/sharedWorkerSupport';
-import wrapEmojiText from '../lib/richTextProcessor/wrapEmojiText';
 import appImManager from '../lib/appManagers/appImManager';
-import assumeType from '../helpers/assumeType';
 import {isDialog, isForumTopic, isMonoforumDialog, isSavedDialog} from '../lib/appManagers/utils/dialogs/isDialog';
-import createSubmenuTrigger from './createSubmenuTrigger';
+import createSubmenuTrigger, {CreateSubmenuArgs} from './createSubmenuTrigger';
 import type AddToFolderDropdownMenu from './addToFolderDropdownMenu';
 import memoizeAsyncWithTTL from '../helpers/memoizeAsyncWithTTL';
 import {MonoforumDialog} from '../lib/storages/monoforumDialogs';
@@ -240,15 +238,19 @@ export default class DialogsContextMenu {
     return this.buttons = this.buttons.filter(Boolean);
   }
 
-  private createAddToFolderSubmenu = async() => {
+  private createAddToFolderSubmenu = async({middleware}: CreateSubmenuArgs) => {
     if(!isDialog(this.dialog)) return;
 
     const {default: AddToFolderDropdownMenu, fetchDialogFilters} = await import('./addToFolderDropdownMenu');
 
+    const filters = await fetchDialogFilters();
+
+    if(!middleware()) return;
+
     const menu = new AddToFolderDropdownMenu;
     menu.feedProps({
       dialog: this.dialog,
-      filters: await fetchDialogFilters(),
+      filters,
       currentFilter: () => appDialogsManager.filterId,
       onNewDialog: (dialog) => {
         this.dialog = dialog;
diff --git a/src/components/floatingButtonMenu.ts b/src/components/floatingButtonMenu.ts
@@ -30,7 +30,16 @@ export default function attachFloatingButtonMenu({
 
     const triggerBcr = element.getBoundingClientRect();
 
-    const menu = await createMenu();
+    let menu: HTMLElement;
+    try {
+      menu = await createMenu();
+    } catch{}
+
+    if(!menu) {
+      opened = false;
+      onCloseArg?.();
+      return;
+    }
 
     const onClose = async() => {
       opened = false;
diff --git a/src/components/sidebarLeft/index.ts b/src/components/sidebarLeft/index.ts
@@ -99,7 +99,7 @@ import DeferredIsUsingPasscode from '../../lib/passcode/deferredIsUsingPasscode'
 import EncryptionKeyStore from '../../lib/passcode/keyStore';
 import createLockButton from './lockButton';
 import {MAX_SIDEBAR_WIDTH, MIN_SIDEBAR_WIDTH, SIDEBAR_COLLAPSE_FACTOR} from './constants';
-import createSubmenuTrigger from '../createSubmenuTrigger';
+import createSubmenuTrigger, {CreateSubmenuArgs} from '../createSubmenuTrigger';
 import ChatTypeMenu from '../chatTypeMenu';
 import {RequestHistoryOptions} from '../../lib/appManagers/appMessagesManager';
 import EmptySearchPlaceholder from '../emptySearchPlaceholder';
@@ -734,7 +734,7 @@ export class AppSidebarLeft extends SidebarSlider {
     const moreSubmenu = createSubmenuTrigger({
       text: 'MultiAccount.More',
       icon: 'more'
-    }, () => this.createMoreSubmenu(moreSubmenu, closeTabsBefore));
+    }, (args) => this.createMoreSubmenu(args, closeTabsBefore));
 
     const newSubmenu = createSubmenuTrigger({
       text: 'CreateANew',
@@ -963,7 +963,7 @@ export class AppSidebarLeft extends SidebarSlider {
 
 
   private async createMoreSubmenu(
-    submenu: ReturnType<typeof createSubmenuTrigger>,
+    {middleware}: CreateSubmenuArgs,
     closeTabsBefore: (clb: () => void) => void
   ) {
     const toggleTheme = () => {
@@ -1089,6 +1089,8 @@ export class AppSidebarLeft extends SidebarSlider {
 
     initAnimationsToggleIcon();
 
+    if(!middleware()) return;
+
     return menu;
   }
 
