Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

nested / hierarchical menu items #2249

Closed
sleidig opened this issue Feb 20, 2024 · 3 comments · Fixed by #2609
Closed

nested / hierarchical menu items #2249

sleidig opened this issue Feb 20, 2024 · 3 comments · Fixed by #2609
Assignees
Labels
Client: by X Client: _GE released on @master managed by CI (semantic-release) released managed by CI (semantic-release) Type: Feature new user-facing feature Type: UX concerning user interface and in a broader sense user experience

Comments

@sleidig
Copy link
Member

sleidig commented Feb 20, 2024

When there are a lot of different menu items on the left (many different entities), the menu becomes hard to navigate. Nested items, expanding upon hovering on an entry, will be useful.

image

  • work in NavigationComponent
  • maybe create a storybook file for this component for easier testing and design
  • check Angular Material menu and nav-list components and experiment with them to figure out the best way to handle this
  • adapt MenuItem config structure to allow nested items (in a backwards-compatible way; see comments below in discussion)
  • implement code for nested items
@sleidig sleidig added Type: Feature new user-facing feature Type: UX concerning user interface and in a broader sense user experience labels Feb 20, 2024
@github-project-automation github-project-automation bot moved this to Triage / Analysis in All Tasks & Issues Feb 20, 2024
@sleidig
Copy link
Member Author

sleidig commented Aug 8, 2024

For the config format, I would suggest the following:

interface NavigationMenuConfig {
  items: MenuItem[];
}

interface MenuItem {
  label: string;
  icon?: string;
  target: string | MenuItem[]; // allow recursively an expanded menu
}

if the recursion makes things too difficult, we could also restrict to maximum one level of indentation. But I would love a generic approach.

--> need to add a config migration to rename "link" to "target" (which would sound more general)


currently existing format:

interface NavigationMenuConfig {
  items: MenuItem[];
}

interface MenuItem {
  label: string;
  icon?: string;
  link: string;
}

@sleidig sleidig added Status: Community Help Wanted (good first issue) simple tasks that don't require understanding every last detail of our platform and removed Client: by X labels Aug 8, 2024
@sleidig sleidig moved this from Triage / Analysis to Todo (ready for work) in All Tasks & Issues Aug 8, 2024
@sleidig sleidig removed the Status: Community Help Wanted (good first issue) simple tasks that don't require understanding every last detail of our platform label Oct 14, 2024
@sleidig sleidig self-assigned this Oct 29, 2024
@sleidig sleidig linked a pull request Nov 15, 2024 that will close this issue
@sleidig sleidig moved this from In Review to In Progress in All Tasks & Issues Nov 20, 2024
@aam-digital-ci
Copy link
Collaborator

🎉 This issue has been resolved in version 3.43.0-master.7 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

@aam-digital-ci aam-digital-ci added the released on @master managed by CI (semantic-release) label Nov 25, 2024
@aam-digital-ci
Copy link
Collaborator

🎉 This issue has been resolved in version 3.43.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

@aam-digital-ci aam-digital-ci added the released managed by CI (semantic-release) label Nov 25, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Client: by X Client: _GE released on @master managed by CI (semantic-release) released managed by CI (semantic-release) Type: Feature new user-facing feature Type: UX concerning user interface and in a broader sense user experience
Projects
Archived in project
Development

Successfully merging a pull request may close this issue.

3 participants