Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Nov 11, 2025

Nested dropdowns in the navigation menu couldn't accept dragged items because cdkDropList containers were only partially connected. Angular CDK requires all interacting drop lists to be mutually aware through cdkDropListConnectedTo for nested drag-drop to function.

Changes

Component (navigation-menu-page.component.ts)

  • Added allConnectedDropListIds getter that aggregates all drop list IDs (template menu, actual menu, and dynamic dropdown IDs)

Template (navigation-menu-page.component.html)

  • Updated all three cdkDropListConnectedTo bindings to reference allConnectedDropListIds instead of partial ID arrays
// Before: each drop list had limited connections
[cdkDropListConnectedTo]="['mainMenu']"  // actualMenuList
[cdkDropListConnectedTo]="['mainMenu']"  // dropdown children

// After: all drop lists share complete connection list
get allConnectedDropListIds(): string[] {
  return ['mainMenu', 'actualMenuList', ...this.connectedDropdownIds];
}
[cdkDropListConnectedTo]="allConnectedDropListIds"  // everywhere

This enables dragging items from the actual menu into dropdown children and between dropdown children, which were previously blocked.

Original prompt

This section details on the original issue you should resolve

<issue_title>nested drag and drop as the dropdown is in navigation does not work</issue_title>
<issue_description>In order for the nested drop target to work in eform-client/src/app/modules/advanced/modules/navigation-menu/components/navigation-menu-page, it needs to follow this answer https://stackoverflow.com/a/67337935/2144807</issue_description>

Comments on the Issue (you are @copilot in this section)


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

@CLAassistant
Copy link

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.
You have signed the CLA already but the status is still pending? Let us recheck it.

Co-authored-by: renemadsen <76994+renemadsen@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix nested drag and drop in navigation menu Fix nested drag and drop in navigation menu by connecting all cdkDropLists Nov 11, 2025
Copilot AI requested a review from renemadsen November 11, 2025 18:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

nested drag and drop as the dropdown is in navigation does not work

3 participants