ux - tweak status locations including copilot to be more aligned with our UX standards (microsoft#242154)

bpasero · web-flow · commit c202fb0bcfc7 · 2025-02-27T10:14:21.000+01:00
diff --git a/build/lib/stylelint/vscode-known-variables.json b/build/lib/stylelint/vscode-known-variables.json
@@ -656,10 +656,6 @@
 		"--vscode-statusBar-noFolderForeground",
 		"--vscode-statusBarItem-activeBackground",
 		"--vscode-statusBarItem-compactHoverBackground",
-		"--vscode-statusBarItem-copilotBackground",
-		"--vscode-statusBarItem-copilotForeground",
-		"--vscode-statusBarItem-copilotHoverBackground",
-		"--vscode-statusBarItem-copilotHoverForeground",
 		"--vscode-statusBarItem-errorBackground",
 		"--vscode-statusBarItem-errorForeground",
 		"--vscode-statusBarItem-errorHoverBackground",
diff --git a/src/vs/workbench/api/browser/mainThreadOutputService.ts b/src/vs/workbench/api/browser/mainThreadOutputService.ts
@@ -106,7 +106,7 @@ export class MainThreadOutputService extends Disposable implements MainThreadOut
 				statusProperties,
 				'status.view.showQuietly',
 				StatusbarAlignment.RIGHT,
-				{ location: { id: 'status.notifications', priority: -Number.MAX_VALUE }, alignment: StatusbarAlignment.LEFT }
+				{ location: { id: 'status.notifications', priority: Number.NEGATIVE_INFINITY }, alignment: StatusbarAlignment.LEFT }
 			);
 		} else {
 			this._outputStatusItem.value.update(statusProperties);
diff --git a/src/vs/workbench/browser/parts/editor/editorStatus.ts b/src/vs/workbench/browser/parts/editor/editorStatus.ts
@@ -994,9 +994,10 @@ class ShowCurrentMarkerInStatusbarContribution extends Disposable {
 				const line = splitLines(this.currentMarker.message)[0];
 				const text = `${this.getType(this.currentMarker)} ${line}`;
 				if (!this.statusBarEntryAccessor.value) {
-					this.statusBarEntryAccessor.value = this.statusbarService.addEntry({ name: localize('currentProblem', "Current Problem"), text: '', ariaLabel: '' }, 'statusbar.currentProblem', StatusbarAlignment.LEFT);
+					this.statusBarEntryAccessor.value = this.statusbarService.addEntry({ name: localize('currentProblem', "Current Problem"), text, ariaLabel: text }, 'statusbar.currentProblem', StatusbarAlignment.LEFT, { location: { id: 'status.problems', priority: 50 }, alignment: StatusbarAlignment.RIGHT });
+				} else {
+					this.statusBarEntryAccessor.value.update({ name: localize('currentProblem', "Current Problem"), text, ariaLabel: text });
 				}
-				this.statusBarEntryAccessor.value.update({ name: localize('currentProblem', "Current Problem"), text, ariaLabel: text });
 			} else {
 				this.statusBarEntryAccessor.clear();
 			}
diff --git a/src/vs/workbench/browser/parts/notifications/notificationsStatus.ts b/src/vs/workbench/browser/parts/notifications/notificationsStatus.ts
@@ -97,7 +97,7 @@ export class NotificationsStatus extends Disposable {
 				statusProperties,
 				'status.notifications',
 				StatusbarAlignment.RIGHT,
-				-Number.MAX_VALUE /* towards the far end of the right hand side */
+				Number.NEGATIVE_INFINITY /* last entry */
 			);
 		} else {
 			this.notificationsCenterStatusItem.update(statusProperties);
@@ -200,7 +200,7 @@ export class NotificationsStatus extends Disposable {
 				},
 				'status.message',
 				StatusbarAlignment.LEFT,
-				-Number.MAX_VALUE /* far right on left hand side */
+				Number.NEGATIVE_INFINITY /* last entry */
 			);
 			showHandle = null;
 		}, showAfter);
diff --git a/src/vs/workbench/browser/parts/statusbar/media/statusbarpart.css b/src/vs/workbench/browser/parts/statusbar/media/statusbarpart.css
@@ -239,13 +239,3 @@
 	color: var(--vscode-statusBarItem-offlineHoverForeground);
 	background-color: var(--vscode-statusBarItem-offlineHoverBackground) !important;
 }
-
-.monaco-workbench .part.statusbar > .items-container > .statusbar-item.copilot-kind {
-	color: var(--vscode-statusBarItem-copilotForeground);
-	background-color: var(--vscode-statusBarItem-copilotBackground);
-}
-
-.monaco-workbench .part.statusbar > .items-container > .statusbar-item.copilot-kind a:hover:not(.disabled) {
-	color: var(--vscode-statusBarItem-copilotHoverForeground);
-	background-color: var(--vscode-statusBarItem-copilotHoverBackground) !important;
-}
diff --git a/src/vs/workbench/common/theme.ts b/src/vs/workbench/common/theme.ts
@@ -599,17 +599,6 @@ export const EXTENSION_BADGE_REMOTE_BACKGROUND = registerColor('extensionBadge.r
 export const EXTENSION_BADGE_REMOTE_FOREGROUND = registerColor('extensionBadge.remoteForeground', ACTIVITY_BAR_BADGE_FOREGROUND, localize('extensionBadge.remoteForeground', "Foreground color for the remote badge in the extensions view."));
 
 
-// < --- Copilot --- >
-
-export const STATUS_BAR_COPILOT_ITEM_BACKGROUND = registerColor('statusBarItem.copilotBackground', STATUS_BAR_REMOTE_ITEM_BACKGROUND, localize('statusBarItemCopilotBackground', "Background color for the Copilot indicator on the status bar."));
-
-export const STATUS_BAR_COPILOT_ITEM_FOREGROUND = registerColor('statusBarItem.copilotForeground', STATUS_BAR_REMOTE_ITEM_FOREGROUND, localize('statusBarItemCopilotForeground', "Foreground color for the Copilot indicator on the status bar."));
-
-export const STATUS_BAR_COPILOT_ITEM_HOVER_FOREGROUND = registerColor('statusBarItem.copilotHoverForeground', STATUS_BAR_REMOTE_ITEM_HOVER_FOREGROUND, localize('statusBarCopilotItemHoverForeground', "Foreground color for the Copilot indicator on the status bar when hovering."));
-
-export const STATUS_BAR_COPILOT_ITEM_HOVER_BACKGROUND = registerColor('statusBarItem.copilotHoverBackground', STATUS_BAR_REMOTE_ITEM_HOVER_BACKGROUND, localize('statusBarAiItemHoverBackground', "Background color for the Copilot indicator on the status bar when hovering."));
-
-
 // < --- Side Bar --- >
 
 export const SIDE_BAR_BACKGROUND = registerColor('sideBar.background', {
diff --git a/src/vs/workbench/contrib/chat/browser/chatStatus.ts b/src/vs/workbench/contrib/chat/browser/chatStatus.ts
@@ -11,7 +11,7 @@ import { localize } from '../../../../nls.js';
 import { ContextKeyExpr, IContextKeyService } from '../../../../platform/contextkey/common/contextkey.js';
 import { IKeybindingService } from '../../../../platform/keybinding/common/keybinding.js';
 import { IWorkbenchContribution } from '../../../common/contributions.js';
-import { IStatusbarEntry, IStatusbarEntryAccessor, IStatusbarService, ShowTooltipCommand, StatusbarAlignment, TooltipContent } from '../../../services/statusbar/browser/statusbar.js';
+import { IStatusbarEntry, IStatusbarEntryAccessor, IStatusbarService, ShowTooltipCommand, StatusbarAlignment, StatusbarEntryKind, TooltipContent } from '../../../services/statusbar/browser/statusbar.js';
 import { ChatContextKeys } from '../common/chatContextKeys.js';
 import { IChatQuotasService } from '../common/chatQuotasService.js';
 import { quotaToButtonMessage, OPEN_CHAT_QUOTA_EXCEEDED_DIALOG, CHAT_SETUP_ACTION_LABEL, TOGGLE_CHAT_ACTION_ID, CHAT_OPEN_ACTION_ID } from './actions/chatActions.js';
@@ -119,7 +119,7 @@ export class ChatStatusBarEntry extends Disposable implements IWorkbenchContribu
 
 	private async create(): Promise<void> {
 		if (this.configurationService.getValue<boolean>('chat.experimental.statusIndicator.enabled') === true) {
-			this.entry ||= this.statusbarService.addEntry(this.getEntryProps(), ChatStatusBarEntry.ID, StatusbarAlignment.RIGHT, Number.NEGATIVE_INFINITY /* the end of the right hand side */);
+			this.entry ||= this.statusbarService.addEntry(this.getEntryProps(), ChatStatusBarEntry.ID, StatusbarAlignment.RIGHT, { location: { id: 'status.editor.mode', priority: 100.1 }, alignment: StatusbarAlignment.RIGHT });
 			this.statusbarService.updateEntryVisibility(`${this.productService.defaultChatAgent?.extensionId}.status`, false); // TODO@bpasero: remove this eventually
 		} else {
 			this.entry?.dispose();
@@ -161,6 +161,7 @@ export class ChatStatusBarEntry extends Disposable implements IWorkbenchContribu
 		let ariaLabel = localize('chatStatus', "Copilot Status");
 		let command: string | Command = TOGGLE_CHAT_ACTION_ID;
 		let tooltip: TooltipContent = localize('openChat', "Open Chat ({0})", this.keybindingService.lookupKeybinding(command)?.getLabel() ?? '');
+		let kind: StatusbarEntryKind | undefined;
 
 		// Quota Exceeded
 		const { chatQuotaExceeded, completionsQuotaExceeded } = this.chatQuotasService.quotas;
@@ -178,6 +179,7 @@ export class ChatStatusBarEntry extends Disposable implements IWorkbenchContribu
 			ariaLabel = quotaWarning;
 			command = OPEN_CHAT_QUOTA_EXCEEDED_DIALOG;
 			tooltip = quotaToButtonMessage({ chatQuotaExceeded, completionsQuotaExceeded });
+			kind = 'prominent';
 		}
 
 		// Copilot Not Installed
@@ -273,7 +275,7 @@ export class ChatStatusBarEntry extends Disposable implements IWorkbenchContribu
 			ariaLabel,
 			command,
 			showInAllWindows: true,
-			kind: 'copilot',
+			kind,
 			tooltip
 		};
 	}
diff --git a/src/vs/workbench/contrib/tasks/browser/task.contribution.ts b/src/vs/workbench/contrib/tasks/browser/task.contribution.ts
@@ -142,7 +142,7 @@ export class TaskStatusBarContributions extends Disposable implements IWorkbench
 			};
 
 			if (!this._runningTasksStatusItem) {
-				this._runningTasksStatusItem = this._statusbarService.addEntry(itemProps, 'status.runningTasks', StatusbarAlignment.LEFT, 49 /* Medium Priority, next to Markers */);
+				this._runningTasksStatusItem = this._statusbarService.addEntry(itemProps, 'status.runningTasks', StatusbarAlignment.LEFT, { location: { id: 'status.problems', priority: 50 }, alignment: StatusbarAlignment.RIGHT });
 			} else {
 				this._runningTasksStatusItem.update(itemProps);
 			}
diff --git a/src/vs/workbench/contrib/workspace/browser/workspace.contribution.ts b/src/vs/workbench/contrib/workspace/browser/workspace.contribution.ts
@@ -627,7 +627,7 @@ export class WorkspaceTrustUXHandler extends Disposable implements IWorkbenchCon
 
 		if (!trusted && !this.statusbarEntryAccessor.value) {
 			const entry = this.getRestrictedModeStatusbarEntry();
-			this.statusbarEntryAccessor.value = this.statusbarService.addEntry(entry, this.entryId, StatusbarAlignment.LEFT, 0.99 * Number.MAX_VALUE /* Right of remote indicator */);
+			this.statusbarEntryAccessor.value = this.statusbarService.addEntry(entry, this.entryId, StatusbarAlignment.LEFT, { location: { id: 'status.host', priority: Number.POSITIVE_INFINITY }, alignment: StatusbarAlignment.RIGHT });
 		}
 	}
 
diff --git a/src/vs/workbench/services/progress/browser/progressService.ts b/src/vs/workbench/services/progress/browser/progressService.ts
@@ -190,7 +190,7 @@ export class ProgressService extends Disposable implements IProgressService {
 			if (this.windowProgressStatusEntry) {
 				this.windowProgressStatusEntry.update(statusEntryProperties);
 			} else {
-				this.windowProgressStatusEntry = this.statusbarService.addEntry(statusEntryProperties, 'status.progress', StatusbarAlignment.LEFT);
+				this.windowProgressStatusEntry = this.statusbarService.addEntry(statusEntryProperties, 'status.progress', StatusbarAlignment.LEFT, Number.NEGATIVE_INFINITY /* last entry */);
 			}
 		}
 
diff --git a/src/vs/workbench/services/statusbar/browser/statusbar.ts b/src/vs/workbench/services/statusbar/browser/statusbar.ts
@@ -113,8 +113,8 @@ export interface IStatusbarStyleOverride {
 	readonly border?: ColorIdentifier;
 }
 
-export type StatusbarEntryKind = 'standard' | 'warning' | 'error' | 'prominent' | 'remote' | 'offline' | 'copilot';
-export const StatusbarEntryKinds: StatusbarEntryKind[] = ['standard', 'warning', 'error', 'prominent', 'remote', 'offline', 'copilot'];
+export type StatusbarEntryKind = 'standard' | 'warning' | 'error' | 'prominent' | 'remote' | 'offline';
+export const StatusbarEntryKinds: StatusbarEntryKind[] = ['standard', 'warning', 'error', 'prominent', 'remote', 'offline'];
 
 export type TooltipContent = IMarkdownString | IManagedHoverContentOrFactory;
 

Original file line number	Diff line number	Diff line change
`@@ -994,9 +994,10 @@ class ShowCurrentMarkerInStatusbarContribution extends Disposable {`
`994`	`994`	`const line = splitLines(this.currentMarker.message)[0];`
`995`	`995`	const text = `${this.getType(this.currentMarker)} ${line}`;
`996`	`996`	`if (!this.statusBarEntryAccessor.value) {`
`997`		`- this.statusBarEntryAccessor.value = this.statusbarService.addEntry({ name: localize('currentProblem', "Current Problem"), text: '', ariaLabel: '' }, 'statusbar.currentProblem', StatusbarAlignment.LEFT);`
	`997`	`+ this.statusBarEntryAccessor.value = this.statusbarService.addEntry({ name: localize('currentProblem', "Current Problem"), text, ariaLabel: text }, 'statusbar.currentProblem', StatusbarAlignment.LEFT, { location: { id: 'status.problems', priority: 50 }, alignment: StatusbarAlignment.RIGHT });`
	`998`	`+ } else {`
	`999`	`+ this.statusBarEntryAccessor.value.update({ name: localize('currentProblem', "Current Problem"), text, ariaLabel: text });`
`998`	`1000`	`}`
`999`		`- this.statusBarEntryAccessor.value.update({ name: localize('currentProblem', "Current Problem"), text, ariaLabel: text });`
`1000`	`1001`	`} else {`
`1001`	`1002`	`this.statusBarEntryAccessor.clear();`
`1002`	`1003`	`}`
Original file line number	Diff line number	Diff line change
`@@ -142,7 +142,7 @@ export class TaskStatusBarContributions extends Disposable implements IWorkbench`
`142`	`142`	`};`
`143`	`143`
`144`	`144`	`if (!this._runningTasksStatusItem) {`
`145`		`- this._runningTasksStatusItem = this._statusbarService.addEntry(itemProps, 'status.runningTasks', StatusbarAlignment.LEFT, 49 /* Medium Priority, next to Markers */);`
	`145`	`+ this._runningTasksStatusItem = this._statusbarService.addEntry(itemProps, 'status.runningTasks', StatusbarAlignment.LEFT, { location: { id: 'status.problems', priority: 50 }, alignment: StatusbarAlignment.RIGHT });`
`146`	`146`	`} else {`
`147`	`147`	`this._runningTasksStatusItem.update(itemProps);`
`148`	`148`	`}`
Original file line number	Diff line number	Diff line change
`@@ -627,7 +627,7 @@ export class WorkspaceTrustUXHandler extends Disposable implements IWorkbenchCon`
`627`	`627`
`628`	`628`	`if (!trusted && !this.statusbarEntryAccessor.value) {`
`629`	`629`	`const entry = this.getRestrictedModeStatusbarEntry();`
`630`		`- this.statusbarEntryAccessor.value = this.statusbarService.addEntry(entry, this.entryId, StatusbarAlignment.LEFT, 0.99 * Number.MAX_VALUE /* Right of remote indicator */);`
	`630`	`+ this.statusbarEntryAccessor.value = this.statusbarService.addEntry(entry, this.entryId, StatusbarAlignment.LEFT, { location: { id: 'status.host', priority: Number.POSITIVE_INFINITY }, alignment: StatusbarAlignment.RIGHT });`
`631`	`631`	`}`
`632`	`632`	`}`
`633`	`633`
Original file line number	Diff line number	Diff line change
`@@ -190,7 +190,7 @@ export class ProgressService extends Disposable implements IProgressService {`
`190`	`190`	`if (this.windowProgressStatusEntry) {`
`191`	`191`	`this.windowProgressStatusEntry.update(statusEntryProperties);`
`192`	`192`	`} else {`
`193`		`- this.windowProgressStatusEntry = this.statusbarService.addEntry(statusEntryProperties, 'status.progress', StatusbarAlignment.LEFT);`
	`193`	`+ this.windowProgressStatusEntry = this.statusbarService.addEntry(statusEntryProperties, 'status.progress', StatusbarAlignment.LEFT, Number.NEGATIVE_INFINITY /* last entry */);`
`194`	`194`	`}`
`195`	`195`	`}`
`196`	`196`