[USER HUB] Add counters to mobile select menu

[melyndav]

Specification

This is a low priority pick up, and other big fixes/ enhancements should be prioritized over this enhancement.

Description

Currently, when the user pill displays the blue circle notification on mobile, there is no indication of what triggered it. Users must manually check each option in the select menu to locate the source.

To improve the mobile user experience in the user hub, adding counters to the select dropdown menu will help users quickly identify the trigger for the blue circle notification. This enhancement will make navigation more efficient.

Design

Figma component link: https://www.figma.com/design/l1dOM5qiQYwF0ElvKDqqjg/Design-System---Colony-v3?node-id=6601-3553&t=tu0gdDEAQnGuwmxG-4

]

Implementation

1. Scope
   • This update applies only to mobile screen sizes where the select menu is triggered in the navigation.

2. Reusing Components
   • The existing counter component in the user hub should be reused for this functionality. The counter copy should match the design.

3. Counter Behaviour
   • Counters should display for the following:
   • Stakes
   • Notifications