agent status + unified agents bar

[eli-w-king]

03.05.Session.Management.Phase.1.mov

[Copilot]

Pull request overview

This PR updates the titlebar “unified agents bar” + “agent status” UI to support a compact, unified layout and refines the agent status widget’s rendering/ordering behavior.

Changes:

• Add a compact mode for the unified agents bar when agent status is enabled (left-aligned label, inline status sections, adjusted hover behavior).
• Refactor the agent status badge rendering to split “needs input” vs “in progress” and control section ordering based on configuration.
• Adjust titlebar command center rendering/CSS to support the compact presentation.

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
src/vs/workbench/contrib/chat/common/constants.ts	Updates ChatAgentLocation enum (currently introduces a breaking rename).
src/vs/workbench/contrib/chat/browser/agentSessions/experiments/media/agenttitlebarstatuswidget.css	Styles for compact mode, hover targeting, sparkle button, and attention text animation.
src/vs/workbench/contrib/chat/browser/agentSessions/experiments/agentTitleBarStatusWidget.ts	Implements compact mode layout + refactors status badge sections and ordering.
src/vs/workbench/browser/parts/titlebar/media/titlebarpart.css	Adds titlebar layout rules to make the compact command center item stretch/align correctly.
src/vs/workbench/browser/parts/titlebar/commandCenterControl.ts	Toggles compact rendering for the command center quick pick item based on chat config.

Comments suppressed due to low confidence (2)

src/vs/workbench/contrib/chat/browser/agentSessions/experiments/agentTitleBarStatusWidget.ts:731

• sparkleContainer is given tabIndex = 0 but no role/ARIA label, while the nested sparkleButton is also tabbable. This results in an extra tab stop and a focusable element with no semantic role for assistive tech. Prefer a single focus target: either make the container the button (role/label + handlers) and remove the inner tab stop, or remove tabIndex/keydown handling from the container and make only the inner button focusable/keyboard-activatable.

		const sparkleContainer = $('span.agent-status-badge-section.sparkle');
		sparkleContainer.tabIndex = 0;
		if (!this._firstFocusableElement) {
			this._firstFocusableElement = sparkleContainer;
		}

src/vs/workbench/contrib/chat/browser/agentSessions/experiments/agentTitleBarStatusWidget.ts:443

• label.classList.remove('has-progress') is now dead code: this class is no longer added anywhere in the widget, and the only remaining reference is the CSS selector .agent-status-label.has-progress. Either reintroduce the logic that adds has-progress when needed, or remove the class toggle (and the corresponding CSS) to avoid leaving unused styling hooks behind.

			reset(leftIcon, renderIcon(Codicon.searchSparkle));
			leftIcon.classList.remove('has-attention');
			label.textContent = hoverLabel;
			label.classList.remove('has-progress');
		}));

[Copilot]

ChatAgentLocation enum now defines canTerminal = 'terminal', but the rest of the codebase (including ChatAgentLocation.fromRaw below and many call sites) references ChatAgentLocation.Terminal. This will not compile and will break terminal chat routing. Rename the enum member back to Terminal (keeping the 'terminal' raw value) and update any intended rename consistently.

Suggested change

	canTerminal = 'terminal',
	Terminal = 'terminal',

[Copilot]

In compact mode you render status badge sections inline into pill (via _renderStatusBadge(..., inlineContainer: pill)), but pill remains role="button"/focusable. This creates nested interactive elements (badge sections are also role="button"/tabbable) inside another button role, which is invalid for accessibility and can confuse screen readers/keyboard users. Consider making the outer pill non-interactive in compact mode (move role/tabIndex + handlers to inputArea) or render inline badges into a non-button wrapper instead of the button element.

This issue also appears on line 727 of the same file.

See below for a potential fix:

		// When agent status is also enabled, use compact mode (no icon, left-aligned label)
		const isCompactMode = this.configurationService.getValue<boolean>(ChatConfiguration.AgentStatusEnabled) === true;
		pill.classList.toggle('compact-mode', isCompactMode);
		if (!isCompactMode) {
			pill.setAttribute('role', 'button');
			pill.setAttribute('aria-label', localize('openQuickAccess', "Open Quick Access"));
			pill.tabIndex = 0;
			this._firstFocusableElement = pill;
		}
		this._container.appendChild(pill);