Fix microsoft#138233

Author: sandy081

src/vs/workbench/contrib/extensions/browser/extensionEditor.ts

@@ -23,7 +23,7 @@ import { KeyMod, KeyCode } from 'vs/base/common/keyCodes';
 import { ResolvedKeybinding } from 'vs/base/common/keybindings';
 import { ExtensionsInput, IExtensionEditorOptions } from 'vs/workbench/contrib/extensions/common/extensionsInput';
 import { IExtensionsWorkbenchService, IExtensionsViewPaneContainer, VIEWLET_ID, IExtension, ExtensionContainers, ExtensionEditorTab, ExtensionState } from 'vs/workbench/contrib/extensions/common/extensions';
-import { RatingsWidget, InstallCountWidget, RemoteBadgeWidget, PreReleaseIndicatorWidget, ExtensionHoverWidget } from 'vs/workbench/contrib/extensions/browser/extensionsWidgets';
+import { RatingsWidget, InstallCountWidget, RemoteBadgeWidget, ExtensionHoverWidget } from 'vs/workbench/contrib/extensions/browser/extensionsWidgets';
 import { IEditorOpenContext } from 'vs/workbench/common/editor';
 import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
 import {
@@ -72,6 +72,7 @@ import { errorIcon, infoIcon, preReleaseIcon, starEmptyIcon, verifiedPublisherIc
 import { MarkdownString } from 'vs/base/common/htmlContent';
 import { IPaneCompositePartService } from 'vs/workbench/services/panecomposite/browser/panecomposite';
 import { ViewContainerLocation } from 'vs/workbench/common/views';
+import { IExtensionGalleryService, IGalleryExtension } from 'vs/platform/extensionManagement/common/extensionManagement';
 
 class NavBar extends Disposable {
 
@@ -164,6 +165,10 @@ const enum WebviewIndex {
 
 const CONTEXT_SHOW_PRE_RELEASE_VERSION = new RawContextKey<boolean>('showPreReleaseVersion', false);
 
+interface IExtensionEditorWidget extends IDisposable {
+	updateInput(extension: IExtension, gallery: IGalleryExtension | undefined, preserveFocus?: boolean): void;
+}
+
 export class ExtensionEditor extends EditorPane {
 
 	static readonly ID: string = 'workbench.editor.extension';
@@ -189,12 +194,14 @@ export class ExtensionEditor extends EditorPane {
 	private dimension: Dimension | undefined;
 
 	private showPreReleaseVersionContextKey: IContextKey<boolean> | undefined;
+	private readonly extensionEditorWidget: IExtensionEditorWidget;
 
 	constructor(
 		@ITelemetryService telemetryService: ITelemetryService,
 		@IInstantiationService private readonly instantiationService: IInstantiationService,
 		@IPaneCompositePartService private readonly paneCompositeService: IPaneCompositePartService,
 		@IExtensionsWorkbenchService private readonly extensionsWorkbenchService: IExtensionsWorkbenchService,
+		@IExtensionGalleryService private readonly extensionGalleryService: IExtensionGalleryService,
 		@IThemeService themeService: IThemeService,
 		@IKeybindingService private readonly keybindingService: IKeybindingService,
 		@INotificationService private readonly notificationService: INotificationService,
@@ -213,6 +220,29 @@ export class ExtensionEditor extends EditorPane {
 		this.extensionReadme = null;
 		this.extensionChangelog = null;
 		this.extensionManifest = null;
+		const that = this;
+		this.extensionEditorWidget = this._register(new class extends Disposable implements IExtensionEditorWidget {
+			private gallery: IGalleryExtension | undefined = undefined;
+			private extension: IExtension | undefined = undefined;
+			constructor() {
+				super();
+				this._register(that.extensionsWorkbenchService.onChange(e => {
+					if (e && this.extension
+						&& areSameExtensions(this.extension.identifier, e?.identifier)
+						&& (!this.extension.server || this.extension.server === e.server)
+						&& this.extension.latestVersion !== e.latestVersion) {
+						this.updateInput(e, this.gallery);
+					}
+				}));
+			}
+			updateInput(extension: IExtension, gallery: IGalleryExtension | undefined, preserveFocus?: boolean): void {
+				this.extension = extension;
+				this.gallery = gallery;
+				if (that.template) {
+					that.updateTemplate(this.extension, this.gallery, that.template, !!preserveFocus);
+				}
+			}
+		}());
 	}
 
 	override get scopedContextKeyService(): IContextKeyService | undefined {
@@ -242,6 +272,7 @@ export class ExtensionEditor extends EditorPane {
 		preview.textContent = localize('preview', "Preview");
 
 		const preRelease = append(title, $('span.pre-release'));
+		preRelease.textContent = localize('preRelease', "Pre-Release");
 		const builtin = append(title, $('span.builtin'));
 		builtin.textContent = localize('builtin', "Built-in");
 
@@ -329,17 +360,34 @@ export class ExtensionEditor extends EditorPane {
 		await super.setInput(input, options, context, token);
 		this.updatePreReleaseVersionContext();
 		if (this.template) {
-			await this.updateTemplate(input.extension, this.template, !!options?.preserveFocus);
+			const gallery = await this.getGallery(input.extension, options?.showPreReleaseVersion);
+			this.extensionEditorWidget.updateInput(input.extension, gallery, options?.preserveFocus);
 		}
 	}
 
 	override setOptions(options: IExtensionEditorOptions | undefined): void {
 		const currentOptions: IExtensionEditorOptions | undefined = this.options;
 		super.setOptions(options);
 		this.updatePreReleaseVersionContext();
-		if (currentOptions?.showPreReleaseVersion !== options?.showPreReleaseVersion) {
-			this.openTab(ExtensionEditorTab.Readme);
+		if (this.input && currentOptions?.showPreReleaseVersion !== options?.showPreReleaseVersion) {
+			this.getGallery((<ExtensionsInput>this.input).extension, !!options?.showPreReleaseVersion).then(gallery => this.extensionEditorWidget.updateInput((<ExtensionsInput>this.input).extension, gallery));
+		}
+	}
+
+	private async getGallery(extension: IExtension, preRelease?: boolean): Promise<IGalleryExtension | undefined> {
+		if (isUndefined(preRelease)) {
+			return undefined;
+		}
+		if (preRelease === extension.gallery?.properties.isPreReleaseVersion) {
+			return undefined;
+		}
+		if (preRelease && !extension.hasPreReleaseVersion) {
+			return undefined;
+		}
+		if (!preRelease && !extension.hasReleaseVersion) {
+			return undefined;
 		}
+		return (await this.extensionGalleryService.query({ includePreRelease: preRelease, names: [extension.identifier.id] }, CancellationToken.None)).firstPage[0];
 	}
 
 	private updatePreReleaseVersionContext(): void {
@@ -363,7 +411,7 @@ export class ExtensionEditor extends EditorPane {
 		}
 	}
 
-	private async updateTemplate(extension: IExtension, template: IExtensionEditorTemplate, preserveFocus: boolean): Promise<void> {
+	private async updateTemplate(extension: IExtension, gallery: IGalleryExtension | undefined, template: IExtensionEditorTemplate, preserveFocus: boolean): Promise<void> {
 		this.activeElement = null;
 		this.editorLoadComplete = false;
 
@@ -383,8 +431,9 @@ export class ExtensionEditor extends EditorPane {
 		template.icon.src = extension.iconUrl;
 
 		template.name.textContent = extension.displayName;
-		template.version.textContent = `v${extension.version}`;
+		template.version.textContent = `v${gallery ? gallery.version : extension.version}`;
 		template.preview.style.display = extension.preview ? 'inherit' : 'none';
+		template.preRelease.style.display = (gallery ? gallery.properties.isPreReleaseVersion : (extension.local?.isPreReleaseVersion || extension.gallery?.properties.isPreReleaseVersion)) ? 'inherit' : 'none';
 		template.builtin.style.display = extension.isBuiltin ? 'inherit' : 'none';
 
 		template.description.textContent = extension.description;
@@ -429,7 +478,6 @@ export class ExtensionEditor extends EditorPane {
 		}
 
 		const widgets = [
-			this.instantiationService.createInstance(PreReleaseIndicatorWidget, template.preRelease, { label: true, icon: false, enableOnlyForInstalled: false }),
 			remoteBadge,
 			this.instantiationService.createInstance(InstallCountWidget, template.installCount, false),
 			this.instantiationService.createInstance(RatingsWidget, template.rating, false)

src/vs/workbench/contrib/extensions/browser/extensions.contribution.ts

@@ -1208,6 +1208,7 @@ class ExtensionsContributions extends Disposable implements IWorkbenchContributi
 				const extensionWorkbenchService = accessor.get(IExtensionsWorkbenchService);
 				const extension = extensionWorkbenchService.local.find(e => areSameExtensions(e.identifier, { id }));
 				if (extension) {
+					extensionWorkbenchService.open(extension, { showPreReleaseVersion: true });
 					await extensionWorkbenchService.install(extension, { installPreReleaseVersion: true });
 				}
 			}
@@ -1225,6 +1226,7 @@ class ExtensionsContributions extends Disposable implements IWorkbenchContributi
 				const extensionWorkbenchService = accessor.get(IExtensionsWorkbenchService);
 				const extension = extensionWorkbenchService.local.find(e => areSameExtensions(e.identifier, { id }));
 				if (extension) {
+					extensionWorkbenchService.open(extension, { showPreReleaseVersion: false });
 					await extensionWorkbenchService.install(extension, { installPreReleaseVersion: false });
 				}
 			}

src/vs/workbench/contrib/extensions/browser/extensionsList.ts

@@ -138,7 +138,7 @@ export class Renderer implements IPagedRenderer<IExtension, ITemplateData> {
 			extensionPackBadgeWidget,
 			headerRemoteBadgeWidget,
 			extensionHoverWidget,
-			this.instantiationService.createInstance(PreReleaseIndicatorWidget, preRelease, { icon: true, label: false, enableOnlyForInstalled: true }),
+			this.instantiationService.createInstance(PreReleaseIndicatorWidget, preRelease),
 			this.instantiationService.createInstance(SyncIgnoredWidget, syncIgnore),
 			this.instantiationService.createInstance(ExtensionActivationStatusWidget, activationStatus, true),
 			this.instantiationService.createInstance(InstallCountWidget, installCount, true),

src/vs/workbench/contrib/extensions/browser/extensionsWidgets.ts

@@ -162,7 +162,6 @@ export class PreReleaseIndicatorWidget extends ExtensionWidget {
 
 	constructor(
 		private readonly container: HTMLElement,
-		private readonly options: { label: boolean, icon: boolean, enableOnlyForInstalled: boolean },
 	) {
 		super();
 		container.classList.add('extension-pre-release');
@@ -180,16 +179,11 @@ export class PreReleaseIndicatorWidget extends ExtensionWidget {
 			return;
 		}
 
-		if (this.options.enableOnlyForInstalled && this.extension.state !== ExtensionState.Installed) {
+		if (this.extension.state !== ExtensionState.Installed) {
 			return;
 		}
 
-		if (this.options?.icon) {
-			append(this.container, $('span' + ThemeIcon.asCSSSelector(preReleaseIcon)));
-		}
-		if (this.options?.label) {
-			append(this.container, $('span.pre-releaselabel', undefined, localize('pre-release-label', "Pre-Release")));
-		}
+		append(this.container, $('span' + ThemeIcon.asCSSSelector(preReleaseIcon)));
 	}
 }
 
@@ -593,8 +587,7 @@ export class ExtensionHoverWidget extends ExtensionWidget {
 		if (extension.local?.isPreReleaseVersion || extension.gallery?.properties.isPreReleaseVersion) {
 			return undefined;
 		}
-		const preReleaseVersionLink = `[${localize('Show prerelease version', "Pre-Release version")}](${URI.parse(`command:workbench.extensions.action.showPreReleaseVersion?${encodeURIComponent(JSON.stringify([extension.identifier.id]))}`)})`;
-		return localize('has prerelease', "This extension has a {0} available", preReleaseVersionLink);
+		return localize('has prerelease', "This extension has a Pre-Release version available");
 	}
 
 }

src/vs/workbench/contrib/extensions/browser/media/extensionEditor.css

@@ -88,8 +88,7 @@
 	margin-left: 10px;
 }
 
-.extension-editor > .header > .details > .title > .pre-release:not(:empty) {
-	display: flex;
+.extension-editor > .header > .details > .title > .pre-release {
 	font-size: 10px;
 	margin-left: 10px;
 	padding: 0px 4px;