Fix drag and drop for menu items into dropdown bodies

Co-authored-by: renemadsen <[email protected]>

Author: Copilot

eform-client/src/app/modules/advanced/modules/navigation-menu/components/navigation-menu-page/navigation-menu-page.component.html

@@ -33,7 +33,7 @@
         class="dragula-template"
         cdkDropList
         [cdkDropListData]="menuTemplate.items"
-        [cdkDropListConnectedTo]="['actualMenuList']"
+        [cdkDropListConnectedTo]="['actualMenuList'].concat(connectedDropdownIds)"
         id="mainMenu"
       >
         <app-navigation-menu-template-item
@@ -98,6 +98,7 @@
         <div
           class="dropdownBody"
           cdkDropList
+          [id]="getDropdownId(firstLevelIndex)"
           [cdkDropListData]="menuItem.children"
           [cdkDropListConnectedTo]="['mainMenu']"
           (cdkDropListDropped)="dropMenuItemChild($event, firstLevelIndex)"

eform-client/src/app/modules/advanced/modules/navigation-menu/components/navigation-menu-page/navigation-menu-page.component.ts

@@ -63,6 +63,16 @@ export class NavigationMenuPageComponent implements OnInit, OnDestroy {
     return NavigationMenuItemTypeEnum;
   }
 
+  getDropdownId(index: number): string {
+    return `dropdown-${index}`;
+  }
+
+  get connectedDropdownIds(): string[] {
+    return this.navigationMenuModel.actualMenu
+      .map((item, index) => item.type === NavigationMenuItemTypeEnum.Dropdown ? this.getDropdownId(index) : null)
+      .filter(id => id !== null) as string[];
+  }
+
   constructor() {
   }