From ea74d6c7fd86229896a78e7b63ccf2b83f873283 Mon Sep 17 00:00:00 2001 From: Remi Schnekenburger Date: Tue, 12 Sep 2023 10:56:01 +0200 Subject: [PATCH] vscode support iconPath in QuickPickItem fixes #12883 VS Code 1.81 finalized the support for the iconPath in QuickPickItem. This is a partial support: full API support and the display of the ThemeIcon, but the display of the URI based icons is not yet available. This last part requires an update in monaco editor core Contributed on behalf of STMicroelectronics --- CHANGELOG.md | 1 + packages/core/src/common/quick-pick-service.ts | 1 + .../monaco/src/browser/monaco-quick-input-service.ts | 12 +++++++++++- packages/plugin-ext/src/plugin/quick-open.ts | 1 + packages/plugin-ext/src/plugin/type-converters.ts | 3 ++- packages/plugin/src/theia.d.ts | 5 +++++ 6 files changed, 21 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 6d7ec86fcf408..b2aee9e9981ef 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,7 @@ ## v1.42.0 - [core] fixed logger level propagation when log config file changes at runtime [#12566](https://github.com/eclipse-theia/theia/pull/12566) - Contributed on behalf of STMicroelectronics +- [vscode] support iconPath in QuickPickItem [#12945](https://github.com/eclipse-theia/theia/pull/12945) - Contributed by STMicroelectronics - [vsx-registry] added a hint to extension fetching ENOTFOUND errors [#12858](https://github.com/eclipse-theia/theia/pull/12858) - Contributed by STMicroelectronics ## v1.41.0 - 08/31/2023 diff --git a/packages/core/src/common/quick-pick-service.ts b/packages/core/src/common/quick-pick-service.ts index 847e1b16de583..f87b6bfb27797 100644 --- a/packages/core/src/common/quick-pick-service.ts +++ b/packages/core/src/common/quick-pick-service.ts @@ -54,6 +54,7 @@ export interface QuickPickItem { description?: string; detail?: string; keySequence?: KeySequence; + iconPath?: URI | Uri | { light?: URI | Uri; dark: URI | Uri } | { id: string }; iconClasses?: string[]; alwaysShow?: boolean; highlights?: QuickPickItemHighlights; diff --git a/packages/monaco/src/browser/monaco-quick-input-service.ts b/packages/monaco/src/browser/monaco-quick-input-service.ts index 0fddf71d686c8..b640237e05f11 100644 --- a/packages/monaco/src/browser/monaco-quick-input-service.ts +++ b/packages/monaco/src/browser/monaco-quick-input-service.ts @@ -18,7 +18,7 @@ import { ApplicationShell, InputBox, InputOptions, KeybindingRegistry, NormalizedQuickInputButton, PickOptions, QuickInputButton, QuickInputHideReason, QuickInputService, QuickPick, QuickPickItem, - QuickPickItemButtonEvent, QuickPickItemHighlights, QuickPickOptions, QuickPickSeparator + QuickPickItemButtonEvent, QuickPickItemHighlights, QuickPickOptions, QuickPickSeparator, codiconArray } from '@theia/core/lib/browser'; import { injectable, inject, postConstruct } from '@theia/core/shared/inversify'; import { @@ -42,6 +42,7 @@ import { Event } from '@theia/core'; import { MonacoColorRegistry } from './monaco-color-registry'; import { ThemeService } from '@theia/core/lib/browser/theming'; import { IStandaloneThemeService } from '@theia/monaco-editor-core/esm/vs/editor/standalone/common/standaloneTheme'; +import { ThemeIcon } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService'; // Copied from @vscode/src/vs/base/parts/quickInput/browser/quickInputList.ts export interface IListElement { @@ -316,6 +317,15 @@ export class MonacoQuickInputService implements QuickInputService { const monacoPicks: Promise[]> = new Promise(async resolve => { const updatedPicks = (await picks).map(pick => { if (pick.type !== 'separator') { + const icon = pick.iconPath; + if (ThemeIcon.isThemeIcon(icon)) { + const codicon = codiconArray(icon.id); + if (pick.iconClasses) { + pick.iconClasses.push(...codicon); + } else { + pick.iconClasses = codicon; + } + } pick.buttons &&= pick.buttons.map(QuickInputButton.normalize); } return pick as M; diff --git a/packages/plugin-ext/src/plugin/quick-open.ts b/packages/plugin-ext/src/plugin/quick-open.ts index ad2975571403d..82a564107a404 100644 --- a/packages/plugin-ext/src/plugin/quick-open.ts +++ b/packages/plugin-ext/src/plugin/quick-open.ts @@ -655,6 +655,7 @@ export class QuickPickExt extends QuickInputExt i pickItems.push({ kind: item.kind, label: item.label, + iconPath: item.iconPath ? getIconUris(item.iconPath) : undefined, description: item.description, handle, detail: item.detail, diff --git a/packages/plugin-ext/src/plugin/type-converters.ts b/packages/plugin-ext/src/plugin/type-converters.ts index 8dc7b11def8be..a109a68f489f2 100644 --- a/packages/plugin-ext/src/plugin/type-converters.ts +++ b/packages/plugin-ext/src/plugin/type-converters.ts @@ -1212,11 +1212,12 @@ export function convertToTransferQuickPickItems(items: rpc.Item[]): rpc.Transfer } else if (item.kind === QuickPickItemKind.Separator) { return { type: 'separator', label: item.label, handle: index }; } else { - const { label, description, detail, picked, alwaysShow, buttons } = item; + const { label, description, iconPath, detail, picked, alwaysShow, buttons } = item; return { type: 'item', label, description, + iconPath, detail, picked, alwaysShow, diff --git a/packages/plugin/src/theia.d.ts b/packages/plugin/src/theia.d.ts index 59c8d7374cdc4..c2b074bb20274 100644 --- a/packages/plugin/src/theia.d.ts +++ b/packages/plugin/src/theia.d.ts @@ -2140,6 +2140,11 @@ export module '@theia/plugin' { */ kind?: QuickPickItemKind; + /** + * The icon path or {@link ThemeIcon} for the QuickPickItem. + */ + iconPath?: Uri | { light: Uri; dark: Uri } | ThemeIcon; + /** * A human-readable string which is rendered less prominent in the same line. Supports rendering of * {@link ThemeIcon theme icons} via the `$()`-syntax.