Make FilterNavigatorBar scrollable

[arai-a]

Fixed #5724

This makes the FilterNavigatorBar scrollable.

• FilterNavigatorBarListItem no longer shrinks.
• When items overflows, left/right scroll buttons are shown
• Items can be scrolled with the following:
  • mouse wheel
  • clicking the left/right scroll buttons
    • with mouse, it scrolls while the button is pressed
    • with keyboard etc, it performs one-shot scroll
  • scroll to the focused item
  • scroll to the last item when items are added/removed
• If the user prefers reduced motion, the scroll happens immediately
• In order to avoid shifting the items when buttons are added/removed, 24px horizontal paddings are added to the bar
• The button state and the scroll position is updated when the bar is resized
• The scroll position is synced between Call Tree, Flame Graph, and Stack Chart as much as possible
  • Given they can have different width (due to the sidebar), this is done as best-effort
• The profileViewerSpacer is removed, and the navigation bar is now flex:1 and it fills the entire space

Demo on the call tree

nav1.mp4

Demo on the profile filter

nav2.mp4

Problems:

• Given the items don't shrink, it shows less items in given width, and it requires either scroll or more clicks for going up multiple filters
  • Maybe we can make it shrink to fixed width, like the Firefox's tabs, and make it scrollable only when the shrinked items overflow

[codecov]

Codecov Report

❌ Patch coverage is 96.94915% with 9 lines in your changes missing coverage. Please review.
✅ Project coverage is 85.80%. Comparing base (0dd124f) to head (f505b59).
⚠️ Report is 3 commits behind head on main.

Files with missing lines	Patch %	Lines
src/components/shared/FilterNavigatorBar.tsx	97.09%	8 Missing ⚠️
src/components/app/Details.tsx	75.00%	1 Missing ⚠️

Additional details and impacted files

@@ Coverage Diff @@ ## main #5739 +/- ## ========================================== + Coverage 85.67% 85.80% +0.13%  ========================================== Files 315 316 +1 Lines 31110 31408 +298 Branches 8472 8627 +155 ========================================== + Hits 26654 26951 +297  - Misses 4026 4027 +1  Partials 430 430 

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.