fix(web): keep sidebar session tabs from overflowing on narrow widths

[da-luce]

Related issue

N/A

Summary

On a narrow sidebar, the "My sessions" and "Shared with me" tabs overflowed past their rounded background strip. This PR adds min-w-0 to each trigger and truncates the label so the tabs stay inside the strip instead of overflowing.

Test Plan

• npm run type-check: clean
• npx vitest run src/shell/Sidebar.test.tsx src/shell/Sidebar.rowActions.test.tsx src/shell/Sidebar.stop.test.tsx: 64/64 pass
• Added an e2e_ui test (tests/e2e_ui/sessions/test_sidebar_tab_overflow.py) that pins the sidebar to its minimum width and asserts each tab stays within its TabsList background. Fails before fix, passes after
• Manual: dragged the sidebar to its minimum width and confirmed the tabs now stay inside the background strip and truncate instead of overflowing (see Demo)

Demo

Before:

After:

Type of change

• Bug fix
• Feature
• UI / frontend change
• Refactor / chore
• Docs
• Test / CI
• Breaking change

Test coverage

• Unit tests added / updated
• Integration tests added / updated
• E2E tests added / updated
• Manual verification completed
• Existing tests cover this change
• Not applicable

Coverage notes

Adds an e2e_ui test that reproduces the overflow at the sidebar's minimum width and asserts each tab stays within its TabsList background (geometry, not class names). Existing Sidebar unit tests cover the multi-user tab rendering and pass unchanged. Also verified manually (see Demo).

Changelog

Sidebar session tabs no longer overflow their background on narrow widths.

[hzub]

looks good, thanks!

[omnigent-ci]

Polly AI Review

Blocking issues

None. The fix is correct: TabsTrigger is a flex-1 flex item whose default min-width: auto prevents it from shrinking below its whitespace-nowrap content, so the two nowrap labels overflow the w-full TabsList at narrow widths. Adding min-w-0 to each trigger lets it shrink, and the inner <span className="min-w-0 truncate"> provides the overflow-hidden/ellipsis so the label degrades gracefully instead of clipping abruptly. This matches the underlying tabs.tsx (flex-1 ... whitespace-nowrap) behavior.

Security vulnerabilities

None. Purely presentational change. No lockfile or dependency changes.

Non-blocking notes

• The active-tab underline/after: pseudo-element in TabsTrigger spans inset-x-0, so at the truncated width the indicator correctly shrinks with the tab — worth a manual glance in the "After" state, but no code concern.
• The e2e test asserts the geometric invariant (right edge within the TabsList box) rather than class names, and scopes the lookup via closest('[data-slot="tabs-list"]') to avoid the workspace-rail TabsList. This is a robust approach. One minor fragility: the test pins the sidebar to the 220px floor via a hardcoded literal that mirrors useResizableSidebar; if that floor changes, the test could stop exercising the tightest case silently (it would still pass, just not at min width). Not blocking.

Summary

A clean, minimal fix for a real flexbox overflow bug, with a clear rationale, a geometry-based regression test that fails-before/passes-after, and before/after screenshots included in the description. Type-check and existing unit suites are reported green. No correctness, contract, or security concerns. Ready to merge.

---

_{Automated review by Polly · workflow run}

[da-luce]

@hzub force-pushed to drop an accidental merge main, sorry for the churn