Implement static plot zoom

Author: timtmok

src/vs/workbench/contrib/positronPlots/browser/components/plotsContainer.tsx

@@ -180,12 +180,12 @@ export const PlotsContainer = (props: PlotContainerProps) => {
 				height={plotHeight}
 				plotClient={plotInstance}
 				width={plotWidth}
-				zoom={plotInstance.metadata.zoom_level} />;
+				zoom={plotInstance.zoomLevel} />;
 		} else if (plotInstance instanceof StaticPlotClient) {
 			return <StaticPlotInstance
 				key={plotInstance.id}
 				plotClient={plotInstance}
-				zoom={plotInstance.metadata.zoom_level} />;
+				zoom={plotInstance.zoomLevel} />;
 		} else if (plotInstance instanceof WebviewPlotClient) {
 			return <WebviewPlotInstance
 				key={plotInstance.id}

src/vs/workbench/contrib/positronPlots/browser/components/staticPlotInstance.tsx

@@ -8,8 +8,8 @@ import React, { useEffect, useRef, useState } from 'react';
 
 // Other dependencies.
 import { PanZoomImage } from './panZoomImage.js';
-import { ZoomLevel } from './zoomPlotMenuButton.js';
 import { StaticPlotClient } from '../../../../services/positronPlots/common/staticPlotClient.js';
+import { ZoomLevel } from '../../../../services/positronPlots/common/positronPlots.js';
 
 /**
  * StaticPlotInstanceProps interface.

src/vs/workbench/contrib/positronPlots/browser/positronPlotsService.ts

@@ -10,7 +10,7 @@ import { ILanguageRuntimeMessageOutput, LanguageRuntimeSessionMode, RuntimeOutpu
 import { ILanguageRuntimeSession, IRuntimeClientInstance, IRuntimeSessionService, RuntimeClientType } from '../../../services/runtimeSession/common/runtimeSessionService.js';
 import { HTMLFileSystemProvider } from '../../../../platform/files/browser/htmlFileSystemProvider.js';
 import { IFileService } from '../../../../platform/files/common/files.js';
-import { createSuggestedFileNameForPlot, DarkFilter, HistoryPolicy, IPositronPlotClient, IPositronPlotsService, PlotRenderFormat, PlotRenderSettings, POSITRON_PLOTS_VIEW_ID, ZoomLevel } from '../../../services/positronPlots/common/positronPlots.js';
+import { createSuggestedFileNameForPlot, DarkFilter, HistoryPolicy, IPositronPlotClient, IPositronPlotsService, isZoomablePlotClient, PlotRenderFormat, PlotRenderSettings, POSITRON_PLOTS_VIEW_ID, ZoomLevel } from '../../../services/positronPlots/common/positronPlots.js';
 import { Emitter, Event } from '../../../../base/common/event.js';
 import { StaticPlotClient } from '../../../services/positronPlots/common/staticPlotClient.js';
 import { IStorageService, StorageTarget, StorageScope } from '../../../../platform/storage/common/storage.js';
@@ -566,11 +566,13 @@ export class PositronPlotsService extends Disposable implements IPositronPlotsSe
 
 	setEditorPlotZoom(plotId: string, zoomLevel: ZoomLevel): void {
 		const plot = this._editorPlots.get(plotId);
-		if (plot instanceof PlotClientInstance) {
+
+		if (isZoomablePlotClient(plot)) {
 			plot.zoomLevel = zoomLevel;
 			this.storePlotMetadata(plot.metadata);
 		} else {
-			this._notificationService.error(localize('positronPlots.zoom.setInvalidPlotType', 'Cannot set zoom for this plot type'));
+			// plot not found, show an error
+			this._notificationService.error(localize('positronPlots.zoom.invalidPlotId', 'Plot not found: {0}', plotId));
 		}
 	}
 

src/vs/workbench/contrib/positronPlotsEditor/browser/editorPlotsContainer.tsx

@@ -13,7 +13,7 @@ import React, { useEffect, useState } from 'react';
 import { DynamicPlotInstance } from '../../positronPlots/browser/components/dynamicPlotInstance.js';
 import { StaticPlotInstance } from '../../positronPlots/browser/components/staticPlotInstance.js';
 import { PlotClientInstance } from '../../../services/languageRuntime/common/languageRuntimePlotClient.js';
-import { IPositronPlotClient, IPositronPlotsService, ZoomLevel } from '../../../services/positronPlots/common/positronPlots.js';
+import { IPositronPlotClient, IPositronPlotsService, ZoomLevel, isZoomablePlotClient } from '../../../services/positronPlots/common/positronPlots.js';
 import { StaticPlotClient } from '../../../services/positronPlots/common/staticPlotClient.js';
 import { DisposableStore } from '../../../../base/common/lifecycle.js';
 
@@ -66,15 +66,14 @@ export const EditorPlotsContainer = (props: EditorPlotsContainerProps) => {
 		// Create the disposable store for cleanup.
 		const disposableStore = new DisposableStore();
 
-		// listen to the plots service for zoom level changes
-		if (props.plotClient instanceof PlotClientInstance) {
+		if (isZoomablePlotClient(props.plotClient)) {
+			// listen to the plots service for zoom level changes
 			disposableStore.add(props.plotClient.onDidChangeZoomLevel((zoomLevel) => {
 				setZoom(zoomLevel);
 			}));
 			setZoom(props.plotClient.zoomLevel);
 		}
 
-
 		// Return the cleanup function that will dispose of the event handlers.
 		return () => disposableStore.dispose();
 	}, [props.plotClient]);

src/vs/workbench/services/languageRuntime/common/languageRuntimePlotClient.ts

@@ -5,7 +5,7 @@
 
 import { Disposable, IDisposable } from '../../../../base/common/lifecycle.js';
 import { Event, Emitter } from '../../../../base/common/event.js';
-import { IPositronPlotClient, ZoomLevel } from '../../positronPlots/common/positronPlots.js';
+import { IPositronPlotClient, IZoomablePlotClient, ZoomLevel } from '../../positronPlots/common/positronPlots.js';
 import { IntrinsicSize, PlotResult, PlotRenderFormat } from './positronPlotComm.js';
 import { IPlotSize, IPositronPlotSizingPolicy } from '../../positronPlots/common/sizingPolicy.js';
 import { PositronPlotCommProxy } from './positronPlotCommProxy.js';
@@ -82,7 +82,7 @@ export interface IPositronPlotMetadata {
  * An instance of a plot client widget generated by a language runtime. A plot can be rendered
  * by calling the `render` method, which returns a promise that resolves to the rendered plot.
  */
-export class PlotClientInstance extends Disposable implements IPositronPlotClient {
+export class PlotClientInstance extends Disposable implements IPositronPlotClient, IZoomablePlotClient {
 	/**
 	 * The currently active render request, if any.
 	 */

src/vs/workbench/services/positronPlots/common/positronPlots.ts

@@ -21,6 +21,12 @@ export interface IPositronPlotClient extends IDisposable {
 	readonly metadata: IPositronPlotMetadata;
 }
 
+export interface IZoomablePlotClient {
+	zoomLevel: ZoomLevel;
+
+	onDidChangeZoomLevel: Event<ZoomLevel>;
+}
+
 export enum ZoomLevel {
 	Fit = 0,
 	Fifty = 0.5,
@@ -76,6 +82,11 @@ export enum DarkFilter {
 	Auto = 'auto'
 }
 
+export const isZoomablePlotClient = (obj: any): obj is IZoomablePlotClient => {
+	return 'zoomLevel' in obj && typeof obj.zoomLevel === 'number' &&
+		'onDidChangeZoomLevel' in obj && typeof obj.onDidChangeZoomLevel === 'function';
+};
+
 /**
  * Creates a suggested file name for a plot.
  * @param storageService The storage service to use.

src/vs/workbench/services/positronPlots/common/staticPlotClient.ts

@@ -3,20 +3,26 @@
  *  Licensed under the Elastic License 2.0. See LICENSE.txt for license information.
  *--------------------------------------------------------------------------------------------*/
 
+import { Emitter, Event } from '../../../../base/common/event.js';
 import { Disposable } from '../../../../base/common/lifecycle.js';
 import { IStorageService } from '../../../../platform/storage/common/storage.js';
 import { IPositronPlotMetadata } from '../../languageRuntime/common/languageRuntimePlotClient.js';
 import { ILanguageRuntimeMessageOutput } from '../../languageRuntime/common/languageRuntimeService.js';
-import { createSuggestedFileNameForPlot, IPositronPlotClient, ZoomLevel } from './positronPlots.js';
+import { createSuggestedFileNameForPlot, IPositronPlotClient, IZoomablePlotClient, ZoomLevel } from './positronPlots.js';
 
 /**
  * Creates a static plot client from a language runtime message.
  */
-export class StaticPlotClient extends Disposable implements IPositronPlotClient {
+export class StaticPlotClient extends Disposable implements IPositronPlotClient, IZoomablePlotClient {
 	public readonly metadata: IPositronPlotMetadata;
 	public readonly mimeType;
 	public readonly data;
 
+	// Zoom level emitter
+	public onDidChangeZoomLevel: Event<ZoomLevel>;
+
+	private readonly _zoomLevelEventEmitter = new Emitter<ZoomLevel>();
+
 	constructor(storageService: IStorageService, sessionId: string, message: ILanguageRuntimeMessageOutput,
 		public readonly code?: string) {
 		super();
@@ -48,6 +54,9 @@ export class StaticPlotClient extends Disposable implements IPositronPlotClient
 		// Save the MIME type and data for the image.
 		this.mimeType = imageKey;
 		this.data = data;
+
+		// Set up the zoom level event emitter.
+		this.onDidChangeZoomLevel = this._zoomLevelEventEmitter.event;
 	}
 
 	get uri() {
@@ -61,4 +70,13 @@ export class StaticPlotClient extends Disposable implements IPositronPlotClient
 	get id() {
 		return this.metadata.id;
 	}
+
+	set zoomLevel(zoom: ZoomLevel) {
+		this.metadata.zoom_level = zoom;
+		this._zoomLevelEventEmitter.fire(zoom);
+	}
+
+	get zoomLevel(): ZoomLevel {
+		return this.metadata.zoom_level ?? ZoomLevel.Fit;
+	}
 }