[OPIK-1487] [FE] Fix long legends in Metrics tab charts with scrollbar #3201

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Merged

YarivHashaiComet merged 3 commits into main from yariv/OPIK-1487-fix-long-legends-metrics-charts

Sep 5, 2025

Collaborator

YarivHashaiComet commented Sep 4, 2025 •

edited

Loading

Details

Add max-h-20 overflow-y-auto to horizontal chart legends
Constrains legends to ~80px height with scrollbar when needed
Fixes overwhelming UI when charts have 25+ legend items

Change checklist

User facing
Documentation update

Issues

Resolves #
OPIK-1487

Testing

Screenshot 2025-09-04 at 21 39 31

Documentation


          [OPIK-1487] [FE] Fix long legends in Metrics tab charts with scrollbar

58d3a08

- Add max-h-20 overflow-y-auto to horizontal chart legends
- Constrains legends to ~80px height with scrollbar when needed
- Fixes overwhelming UI when charts have 25+ legend items

github-actions bot assigned YarivHashaiComet

Contributor

github-actions bot commented Sep 4, 2025

📋 PR Linter Failed

❌ Incomplete Details Section. The ## Details section cannot be empty.

❌ Incomplete Issues Section. You must reference at least one GitHub issue (#xxxx) or Jira ticket (OPIK-xxxx) under the ## Issues section.

1 similar comment

Contributor

github-actions bot commented Sep 4, 2025

📋 PR Linter Failed

❌ Incomplete Details Section. The ## Details section cannot be empty.

❌ Incomplete Issues Section. You must reference at least one GitHub issue (#xxxx) or Jira ticket (OPIK-xxxx) under the ## Issues section.

Contributor

github-actions bot commented Sep 4, 2025

📋 PR Linter Failed

❌ Incomplete Issues Section. You must reference at least one GitHub issue (#xxxx) or Jira ticket (OPIK-xxxx) under the ## Issues section.

1 similar comment

Contributor

github-actions bot commented Sep 4, 2025

📋 PR Linter Failed

❌ Incomplete Issues Section. You must reference at least one GitHub issue (#xxxx) or Jira ticket (OPIK-xxxx) under the ## Issues section.


          [OPIK-1487] [FE] Fix long legends in Metrics tab charts with scrollbar

a4559da

- Add max-h-20 overflow-y-auto to horizontal chart legends
- Constrains legends to ~80px height with scrollbar when needed
- Fixes overwhelming UI when charts have 25+ legend items

Contributor

github-actions bot commented Sep 4, 2025

📋 PR Linter Failed

❌ Incomplete Issues Section. You must reference at least one GitHub issue (#xxxx) or Jira ticket (OPIK-xxxx) under the ## Issues section.

YarivHashaiComet marked this pull request as ready for review

September 4, 2025 18:45

Copilot AI review requested due to automatic review settings

September 4, 2025 18:45

YarivHashaiComet requested a review from a team as a code owner

September 4, 2025 18:45

Copilot AI reviewed

View reviewed changes

Contributor

Copilot AI left a comment

Pull Request Overview

This PR addresses UI overflow issues in chart legends by adding scroll constraints when there are many legend items (25+). The fix prevents overwhelming UI by limiting legend height to approximately 80px with a scrollbar when needed.

Add scroll constraints to horizontal chart legends
Replace gap spacing with more consistent gap-y-1 for vertical spacing
Maintain existing horizontal spacing while adding overflow handling


          Merge branch 'main' into yariv/OPIK-1487-fix-long-legends-metrics-charts

b6639b0

andriidudar approved these changes

View reviewed changes

Contributor

andriidudar left a comment

LGTM!

YarivHashaiComet merged commit 61ec962 into main

7 checks passed

YarivHashaiComet deleted the yariv/OPIK-1487-fix-long-legends-metrics-charts branch

September 5, 2025 07:59

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet