Active state for navigation in sidebar

[db-ot]

Initial Checklist

• I understand this is a user story and questions should be posted in the Community Discussions
• I searched issues and couldn’t find anything (or linked relevant results below)

User Story

As a user, I want navigation icons to clearly reflect the active state, so that I can easily understand which section I am currently in.

Description

AS-IS:

• The “Personal” icon stays in a filled (active) state even after the user leaves the tab
• All other icons do not show a filled state when their corresponding tab is active
• This leads to inconsistent and unclear navigation state indication

TO-BE:

• Only the currently active tab shows its icon in a filled state
• When leaving a tab, its icon automatically switches back to the outline state
• All inactive tabs consistently display the outline style
• The active state behavior is consistent across all navigation icons, including “Personal”

Acceptance Criteria

• The icon of the currently active tab is displayed in a filled style
• When switching to another tab, the previously active icon reverts to the outline style
• All inactive tabs always display the outline style
• The active state behavior is implemented consistently across all navigation icons
• The “Personal” tab behaves the same as all other tabs (no persistent active state after leaving)
• Same status is also for preferences sidebar