fix(menu): handle selecting while loading sub items

Lundalogik · Mar 14, 2024 · 1a40362 · 1a40362
1 parent fa3906f
commit 1a40362
Showing 1 changed file with 11 additions and 0 deletions.
diff --git a/src/components/menu/menu.tsx b/src/components/menu/menu.tsx
@@ -190,6 +190,7 @@ export class Menu {
     private searchInput: HTMLLimelInputFieldElement;
     private portalId: string;
     private triggerElement: HTMLSlotElement;
+    private selectedMenuItem?: MenuItem;
 
     constructor() {
         this.portalId = createRandomString();
@@ -601,6 +602,7 @@ export class Menu {
         selectOnEmptyChildren: boolean = true,
     ) => {
         if (Array.isArray(menuItem?.items) && menuItem.items.length > 0) {
+            this.selectedMenuItem = menuItem;
             this.clearSearch();
             this.currentSubMenu = menuItem;
             this.navigateMenu.emit(menuItem);
@@ -610,8 +612,14 @@ export class Menu {
             return;
         } else if (isFunction(menuItem?.items)) {
             const menuLoader = menuItem.items as MenuLoader;
+            this.selectedMenuItem = menuItem;
             this.loadingSubItems = true;
             const subItems = await menuLoader(menuItem);
+
+            if (this.selectedMenuItem !== menuItem) {
+                return;
+            }
+
             menuItem.items = subItems;
             this.loadingSubItems = false;
 
@@ -630,6 +638,9 @@ export class Menu {
             return;
         }
 
+        this.selectedMenuItem = menuItem;
+        this.loadingSubItems = false;
+
         this.select.emit(menuItem);
         this.open = false;
         this.currentSubMenu = null;