Enable click event on ix-menu-category

[katjaKoppensteiner]

Prerequisites

• [X] I have read the Contributing Guidelines.
• [X] I have not leaked any internal/restricted information like screenshots, videos, code snippets, links etc.

What happened?

Usually there is an overview page for subpages available. But this overview page can't be linked to the "overview-item". In collapsed state it is expanding the submenu, in expanded state it is collapsing/expanding submenu.

Proposal: in collapsed state on desktop: hover on ix-menu-category item makes submenu visible & everything is clickable click on ix-menu-category item navigates to overview page

in collapsed state on mobile: click on ix-menu-category item makes submenu visible & everything is clickable click on ix-menu-category item navigates to overview page

in expanded state desktop/mobile: directly show submenu items without collapse/expand toggling

What type of frontend framework are you seeing the problem on?

Angular

Which version of iX do you use?

v2.0.4

Code to produce this issue.

<ix-menu-category
      [label]="'Overview'"
      routerLink="/myOverviewPage"
      icon="applications"
    >
      <ix-menu-item
        icon="./assets/images/empty.svg"
        routerLink="/firstSubpage"
        routerLinkActive
        #rlaCatalog="routerLinkActive"
        [active]="rlaCatalog.isActive"
      >
        first submenu item
      </ix-menu-item>

      <ix-menu-item
        icon="./assets/images/empty.svg"
        routerLink="/secondSubpage"
        routerLinkActive
        #rlaIemApps="routerLinkActive"
        [active]="rlaIemApps.isActive"
      >
        second submenu item
      </ix-menu-item>
    </ix-menu-category>

[HemendraSinghRathore]

+1 I am facing same issue.

[neunteufelflorian]

+1

[nareshtailor]

+1

[github-actions[bot]]

🤖 Hello @katjaKoppensteiner

Your issue will be analyzed and is part of our internal workflow. To get informed about our workflow please checkout the Contributing Guidelines

JIRA: IX-1210

[silviowolf]

We have analyzed the feature from an UX perspective and found a few conflicts that prevents us from providing a quick solution.

For example: in an expanded app menu, a click on the category is already associated with expanding/collapsing the sub items. So it would require to split up the category item into 2 areas, one for the selection and one for the expand/collapse action to specifically trigger each action. From a technical point we need further investigations regarding the compatibility and possible breaking changes of such changes.

I don’t know your specific usecase, but the most obvious workaround is to create an additional item with the same name as the category or insert an item like "overview" or "summary" or maybe it is possible to find a more generic name for the category itself.