Truncate namespace in Usage Overview panel in Value Streams Dashboard
What does this MR do and why?
Makes several UX improvements to the Usage overview panel in the Value Streams Dashboard, chief among them the truncation of long namespaces with a tooltip containing the full name that appears on hover. Longer namespaces in the panel were pushing the metrics outside of the container and were thus no longer visible due to the panel's hidden overflow. In addition, the visibility level icon is now wrapped in a button for accessibility purposes. While the mobile experience still leaves much to be desired (will be addressed in #438448), this MR at least fixes the main issue when namespaces are really long.
References
Screenshots or screen recordings
| Before | After |
|---|---|
| Screen Recording 2025-06-27 at 4.19.45 PM.mov | Screen Recording 2025-06-27 at 4.17.39 PM.mov |
How to set up and validate locally
- Please make sure that you're on the GitLab Ultimate plan (if necessary, request a license).
- Create a new top-level group, and then a subgroup with a really long name.
- Visit the subgroup, then navigate to
Analyze > Analytics dashboardsin the menu - Select Value Streams Dashboard from the list
- Scale down your browser window, and verify that the namespace is being truncated and that a tooltip with the full name appears upon hover.
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Related to #467997 (closed)