Improve sessions list rendering on phone layout

[osortega]

Improves the readability and tap-friendliness of the agent sessions list under the phone layout. No new components, no new data — only a phone-aware row height and CSS changes scoped to .agent-sessions-workbench.phone-layout.

Changes

• Phone-aware row height (SessionsTreeDelegate): 76px on phone vs 54px on desktop. Heights refresh reactively when IsPhoneLayoutContext changes.
• Larger fonts and roomier rows: 15px title / 12.5px details, 10px padding, vertically centered icon + main column.
• Card-style rows: margin: 2px 8px, 10px border radius for a phone-native press feel.
• Inline actions on touch: the per-row toolbar is always visible (no hover/focus dependency), pulled out of the title-row flow with position: absolute; right: 6px; top: 50% so 44px tap targets don't inflate the title line-height or push the details row down. .session-main reserves padding-right: 96px to keep titles from sliding under the icons. Action labels are flex-centered so the icon sits in the middle of the 44×44 tap area.
• Action taps no longer collapse the list: the toolbar container stops pointerdown / pointerup / click / dblclick propagation, so the row's onDidOpen handler doesn't fire when a tap lands on an action. This applies on desktop and mobile — semantically actions on the row toolbar are not "open the row".

Architecture notes

• All visual changes live behind .agent-sessions-workbench.phone-layout ancestor selectors, so desktop rendering is byte-identical.
• Phone branching uses the existing IsPhoneLayoutContext reactive signal (per MOBILE.md guidance) for the height refresh — no new branching infrastructure.
• The propagation fix is unconditional. Actions never imply "open the row", on any platform.

Out of scope

The HTML mock that inspired this also showed colored status pills, a filter chip row, a FAB, and a bottom tab bar. Those are not implemented here — this PR is strictly about making the existing list readable and tappable on a phone.

Verification

• npm run compile-check-ts-native clean.
• Manually verified in vscode.dev/agents at iPhone 14 Pro viewport: rows render at 76px, actions tap correctly, list does not collapse on action tap, desktop layout unchanged above the phone breakpoint.

[Copilot]

Pull request overview

This PR targets the Agents window phone layout by making the sessions list more readable and touch-friendly, primarily through a taller row height and phone-scoped CSS adjustments.

Changes:

• Adjusts SessionsTreeDelegate row height based on phone layout and attempts to refresh heights when IsPhoneLayoutContext changes.
• Updates phone-scoped CSS to increase padding/font sizes and reposition the per-row action toolbar for touch.
• Adds event propagation stops on the title toolbar container to prevent row “open” behavior when interacting with actions.

Show a summary per file

File	Description
src/vs/sessions/contrib/sessions/browser/views/sessionsList.ts	Adds phone-aware row height logic, reactive height refresh on context changes, and event propagation handling for the inline toolbar.
src/vs/sessions/contrib/sessions/browser/media/sessionsList.css	Adds .agent-sessions-workbench.phone-layout styling for roomier “card-style” rows and always-visible inline actions.

Copilot's findings

• Files reviewed: 2/2 changed files
• Comments generated: 6

[osortega]

Triage of the Copilot review:

Addressed in bf8562b

1. ✅ Stale "6px padding" arithmetic in the row-height doc comment — simplified to describe the intent without a stale formula.
2. ✅ Gesture.ignoreTarget for touch — correct catch. The list opens rows from list.onTap (a Gesture event), which doesn't bubble through DOM, so my pointer/click stopPropagation only handled mouse. Added Gesture.ignoreTarget(titleToolbarContainer) alongside the existing pointer/click stops.
3. ✅ "Cheap O(visible)" comment — fixed; we iterate this.sessions (all known sessions). Phone↔desktop transitions are rare, so the wording now reflects the real cost rather than over-claiming.
4. ✅ "title that wraps to 2 lines" — stale; the line-clamp was dropped earlier in the iteration. Comment rewritten.
5. ✅ Vertical margin on .monaco-list-row — removed. Rows are absolutely positioned with JS-set top/height, so the 2px vertical was a visual no-op at best and overlap-prone at worst. Now horizontal-only (margin: 0 8px); any row spacing lives inside the row via padding.

Not changing

6. ❌ Move phone branching into a separate phone delegate / view registration. The MOBILE.md guidance applies to Parts (and to desktop code that should remain phone-agnostic). Here the phone variance is a single tree-row height tightly coupled to the same file's .phone-layout CSS. Splitting SessionsList / SessionsTreeDelegate into desktop and phone variants would duplicate approval-row plumbing, section/show-more handling, and the entire constructor wiring purely to externalize one constant. The current implementation reads IsPhoneLayoutContext reactively in one place, with the height refresh confined to a context-key listener that ignores anything but the phone key. It stays.