Polish agent sessions list UI

[daviddossett]

• Show description alongside diff badge with dot separator
• Use regular foreground color for active selection, descriptionForeground for inactive
• Remove background/outlines from diff badge
• Bump read indicator opacity to 20%

[Copilot]

Pull request overview

UI polish for the Agent Sessions list in the Chat workbench contribution, aiming to tighten spacing, improve visual hierarchy, and refine selection/read-indicator styling.

Changes:

• Updates list layout/typography (padding, row height, icon sizing), and adjusts how title/status/description/diff/badge are arranged and displayed.
• Adds “mouse vs keyboard focus” tracking to suppress focus outlines on mouse interaction while preserving keyboard navigation affordances.
• Tweaks color tokens/usage (read indicator opacity; theme disabledForeground change).

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
src/vs/workbench/contrib/chat/browser/widgetHosts/viewPane/media/chatViewPane.css	Adjusts padding for the sessions “new” button container and section.
src/vs/workbench/contrib/chat/browser/agentSessions/media/agentsessionsviewer.css	Refines list row styling (padding, border radius), toolbar/status visibility rules, and details row layout (separator + fade mask).
src/vs/workbench/contrib/chat/browser/agentSessions/agentSessionsViewer.ts	Updates rendering layout (status moved), row height, section labels, and introduces compact time/duration formatting helpers.
src/vs/workbench/contrib/chat/browser/agentSessions/agentSessionsControl.ts	Adds DOM listeners to toggle a mouse-focused class for focus-outline behavior.
src/vs/workbench/contrib/chat/browser/agentSessions/agentSessions.ts	Increases read-indicator opacity from 15% to 20%.
extensions/theme-2026/themes/2026-dark.json	Changes disabledForeground color token value.

Comments suppressed due to low confidence (1)

src/vs/workbench/contrib/chat/browser/agentSessions/agentSessionsViewer.ts:823

• compactTimeAgo returns months as '{0}m', which is ambiguous with minutes (also m) and contradicts the doc comment examples (“3mo”, “4wk”, “1yr”). Please use distinct units for months/weeks/years (or update the comment), so the UI can’t display confusing values like 2m that could mean minutes or months.

/**
 * Returns a compact relative time string without spaces between number and unit.
 * e.g. "1m", "2h", "1d", "4wk", "3mo", "1yr"
 */
function compactTimeAgo(date: number): string {
	const seconds = Math.round((Date.now() - date) / 1000);
	if (seconds < MINUTE) {
		return localize('compact.now', 'now');
	}
	if (seconds < HOUR) {
		const value = Math.round(seconds / MINUTE);
		return localize('compact.minutes', '{0}m', value);
	}
	if (seconds < COMPACT_DAY) {
		const value = Math.round(seconds / HOUR);
		return localize('compact.hours', '{0}h', value);
	}
	if (seconds < COMPACT_WEEK) {
		const value = Math.round(seconds / COMPACT_DAY);
		return localize('compact.days', '{0}d', value);
	}
	if (seconds < COMPACT_MONTH) {
		const value = Math.round(seconds / COMPACT_WEEK);
		return localize('compact.weeks', '{0}w', value);
	}
	if (seconds < COMPACT_YEAR) {
		const value = Math.round(seconds / COMPACT_MONTH);
		return localize('compact.months', '{0}m', value);
	}
	const value = Math.round(seconds / COMPACT_YEAR);
	return localize('compact.years', '{0}y', value);

[vs-code-engineering]

📬 CODENOTIFY

The following users are being notified based on files changed in this PR:

@bpasero

Matched files:

• src/vs/workbench/contrib/chat/browser/agentSessions/agentSessions.ts
• src/vs/workbench/contrib/chat/browser/agentSessions/agentSessionsControl.ts
• src/vs/workbench/contrib/chat/browser/agentSessions/agentSessionsViewer.ts
• src/vs/workbench/contrib/chat/browser/agentSessions/media/agentsessionsviewer.css

[TylerLeonhardt]

I'd probably have:

• combined useFullTimeWords?: boolean, useCompactUnits?: boolean into a displayOptions object
• then do this instead of a separate section for useCompactUnits:

	if (seconds < 1) {
		return useFullTimeWords
			? localize('duration.m.full', '{0} minutes', Math.round(ms / (1000 * minute)))
			:  useCompactUnits
				? localize('duration.compact.m', '{0}m', Math.round(ms / (1000 * minute)))
				: localize('duration.m', '{0} mins', Math.round(ms / (1000 * minute)));
	}

(or use an if/else instead of nested ternary)

esp since there is some overlap like ms & s

but this is fine.

[TylerLeonhardt]

Also please please please add tests since this is in base.

[daviddossett]

I ended up pulling out the date stuff to minimize PR scope. I'll try this in a follow up!

[bpasero]

Recorded some findings/regressions in #293602