[FEATURE] Main Navigation

Problem

Our main navigation hasn't been optimized for usability considering all the different personas we support in the product. It currently opens the group you click into letting you explore the navigation but doesn't navigate to the new target. Additionally, when the nav is collapsed, the user doesn't see the name of the group in the flyout so they lose context. Also, settings are kind of its own thing and would benefit from living in a separate area.

Goal

Incorporate a few usability improvement to our main navigation so all of our personas can reliably use it and find it usable. Namely: navigate to the first item in the group you click into if you hit the name or icon, but open the group if you click the caret to open the group, thus supporting both efficiency for powerusers and usability for content creators. Move settings to the bottom of the navigation panel to separate it from the rest of the day to day navigation.

Target Personas

• Developer teams
• Content teams
• DevOps teams
• System administrators (dotCMS)

Demo Expectations

Open the product.
Demo the old navigation: how when collapsed there is no group in the flyout.
Demo the new nav: how when collapsed now you see the group in the flyout.

Demo the old navigation: how settings is one more group in the navigation items.
Demo the new nav: how settings now lives at the bottom of the main nav, separate from the rest of the nav items.

Demo the old navigation: how clicking on a group opens the group and doesn't navigate.
Demo the new navigation:how when you click a certain hit area it only opens the group allowing you to explore the navigation and even right click on one of the items to open in another tab, but when you hit the other it navigates to the first item in the group and also opens the group.

Start at the product's main navigation and reproduce the current behavior in both expanded and collapsed states. Implement the specified group hit areas, collapsed flyout context, and separate settings placement; done means the navigation supports both exploration and direct navigation as shown in the demo expectations.