Allow rendering a theme icon with a chat model (microsoft#264061)

Author: lramos15

src/vs/platform/actionWidget/browser/actionWidgetDropdown.ts

@@ -15,6 +15,7 @@ import { IListAccessibilityProvider } from '../../../base/browser/ui/list/listWi
 
 export interface IActionWidgetDropdownAction extends IAction {
 	category?: { label: string; order: number };
+	icon?: ThemeIcon;
 	description?: string;
 }
 
@@ -84,7 +85,7 @@ export class ActionWidgetDropdown extends BaseDropdown {
 					description: action.description,
 					kind: ActionListItemKind.Action,
 					canPreview: false,
-					group: { title: '', icon: ThemeIcon.fromId(action.checked ? Codicon.check.id : Codicon.blank.id) },
+					group: { title: '', icon: action.icon ?? ThemeIcon.fromId(action.checked ? Codicon.check.id : Codicon.blank.id) },
 					disabled: false,
 					hideIcon: false,
 					label: action.label,

src/vs/platform/extensions/common/extensionsApiProposals.ts

@@ -52,7 +52,7 @@ const _allApiProposals = {
 	},
 	chatProvider: {
 		proposal: 'https://raw.githubusercontent.com/microsoft/vscode/main/src/vscode-dts/vscode.proposed.chatProvider.d.ts',
-		version: 3
+		version: 4
 	},
 	chatReferenceBinaryData: {
 		proposal: 'https://raw.githubusercontent.com/microsoft/vscode/main/src/vscode-dts/vscode.proposed.chatReferenceBinaryData.d.ts',

src/vs/workbench/api/common/extHostLanguageModels.ts

@@ -194,6 +194,7 @@ export class ExtHostLanguageModels implements ExtHostLanguageModelsShape {
 					auth,
 					isDefault: m.isDefault,
 					isUserSelectable: m.isUserSelectable,
+					statusIcon: m.statusIcon,
 					modelPickerCategory: m.category ?? DEFAULT_MODEL_PICKER_CATEGORY,
 					capabilities: m.capabilities ? {
 						vision: m.capabilities.imageInput,

src/vs/workbench/contrib/chat/browser/media/chat.css

@@ -1130,6 +1130,12 @@ have to be updated for changes to the rules above, or to support more deeply nes
 				overflow: hidden;
 				text-overflow: ellipsis;
 			}
+			.codicon-warning {
+				color: var(--vscode-problemsWarningIcon-foreground);
+			}
+			span + .chat-model-label {
+				margin-left: 2px;
+			}
 		}
 
 		.codicon {

src/vs/workbench/contrib/chat/browser/modelPicker/modelPickerActionItem.ts

@@ -35,6 +35,7 @@ function modelDelegateToWidgetActionsProvider(delegate: IModelPickerDelegate): I
 				return {
 					id: model.metadata.id,
 					enabled: true,
+					icon: model.metadata.statusIcon,
 					checked: model.identifier === delegate.getCurrentModel()?.identifier,
 					category: model.metadata.modelPickerCategory || DEFAULT_MODEL_PICKER_CATEGORY,
 					class: undefined,
@@ -134,7 +135,14 @@ export class ModelPickerActionItem extends ActionWidgetDropdownActionViewItem {
 	}
 
 	protected override renderLabel(element: HTMLElement): IDisposable | null {
-		dom.reset(element, dom.$('span.chat-model-label', undefined, this.currentModel?.metadata.name ?? localize('chat.modelPicker.label', "Pick Model")), ...renderLabelWithIcons(`$(chevron-down)`));
+		const domChildren = [];
+		if (this.currentModel?.metadata.statusIcon) {
+			domChildren.push(...renderLabelWithIcons(`\$(${this.currentModel.metadata.statusIcon.id})`));
+		}
+		domChildren.push(dom.$('span.chat-model-label', undefined, this.currentModel?.metadata.name ?? localize('chat.modelPicker.label', "Pick Model")));
+		domChildren.push(...renderLabelWithIcons(`$(chevron-down)`));
+
+		dom.reset(element, ...domChildren);
 		this.setAriaLabelAttributes(element);
 		return null;
 	}

src/vs/workbench/contrib/chat/common/languageModels.ts

@@ -10,6 +10,7 @@ import { Iterable } from '../../../../base/common/iterator.js';
 import { IJSONSchema } from '../../../../base/common/jsonSchema.js';
 import { DisposableStore, IDisposable, toDisposable } from '../../../../base/common/lifecycle.js';
 import { isFalsyOrWhitespace } from '../../../../base/common/strings.js';
+import { ThemeIcon } from '../../../../base/common/themables.js';
 import { URI } from '../../../../base/common/uri.js';
 import { localize } from '../../../../nls.js';
 import { IContextKey, IContextKeyService } from '../../../../platform/contextkey/common/contextkey.js';
@@ -165,6 +166,7 @@ export interface ILanguageModelChatMetadata {
 
 	readonly isDefault?: boolean;
 	readonly isUserSelectable?: boolean;
+	readonly statusIcon?: ThemeIcon;
 	readonly modelPickerCategory: { label: string; order: number } | undefined;
 	readonly auth?: {
 		readonly providerLabel: string;

src/vscode-dts/vscode.proposed.chatProvider.d.ts

@@ -3,7 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-// version: 3
+// version: 4
 
 declare module 'vscode' {
 
@@ -52,6 +52,8 @@ declare module 'vscode' {
 		 * WONT BE FINALIZED
 		 */
 		readonly category?: { label: string; order: number };
+
+		readonly statusIcon?: ThemeIcon;
 	}
 
 	export type LanguageModelResponsePart2 = LanguageModelResponsePart | LanguageModelDataPart | LanguageModelThinkingPart;