mcp: allow dnd on tool-generated resources (microsoft#250128)

Author: connor4312

src/vs/workbench/contrib/chat/browser/chatContentParts/chatAttachmentsContentPart.ts

@@ -28,6 +28,7 @@ export class ChatAttachmentsContentPart extends Disposable {
 	private readonly _contextResourceLabels: ResourceLabels;
 
 	public contextMenuHandler?: (attachment: IChatRequestVariableEntry, event: MouseEvent) => void;
+	public dragStartHandler?: (attachment: IChatRequestVariableEntry, event: DragEvent, element: HTMLElement) => void;
 
 	constructor(
 		private readonly variables: IChatRequestVariableEntry[],
@@ -93,6 +94,7 @@ export class ChatAttachmentsContentPart extends Disposable {
 			}
 
 			this._register(dom.addDisposableListener(widget.element, 'contextmenu', e => this.contextMenuHandler?.(attachment, e)));
+			this._register(dom.addDisposableListener(widget.element, 'dragstart', e => this.dragStartHandler?.(attachment, e, widget.element)));
 
 			if (this.attachedContextDisposables.isDisposed) {
 				widget.dispose();

src/vs/workbench/contrib/chat/browser/chatContentParts/chatToolInputOutputContentPart.ts

@@ -3,8 +3,10 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
+import { DataTransfers } from '../../../../../base/browser/dnd.js';
 import * as dom from '../../../../../base/browser/dom.js';
 import { ButtonWithIcon } from '../../../../../base/browser/ui/button/button.js';
+import { applyDragImage } from '../../../../../base/browser/ui/dnd/dnd.js';
 import { assertNever } from '../../../../../base/common/assert.js';
 import { VSBuffer } from '../../../../../base/common/buffer.js';
 import { Codicon } from '../../../../../base/common/codicons.js';
@@ -32,6 +34,7 @@ import { ILabelService } from '../../../../../platform/label/common/label.js';
 import { INotificationService } from '../../../../../platform/notification/common/notification.js';
 import { IProgressService, ProgressLocation } from '../../../../../platform/progress/common/progress.js';
 import { IWorkspaceContextService } from '../../../../../platform/workspace/common/workspace.js';
+import { fillEditorsDragData } from '../../../../browser/dnd.js';
 import { REVEAL_IN_EXPLORER_COMMAND_ID } from '../../../files/browser/fileConstants.js';
 import { getAttachableImageExtension, IChatRequestVariableEntry, OmittedState } from '../../common/chatModel.js';
 import { IChatRendererContent } from '../../common/chatViewModel.js';
@@ -55,6 +58,7 @@ export interface IChatCollapsibleIODataPart {
 	kind: 'data';
 	value: Uint8Array;
 	mimeType: string;
+	uri?: URI;
 }
 
 export interface IChatCollapsibleIOResourcePart {
@@ -211,7 +215,7 @@ export class ChatCollapsibleInputOutputContentPart extends Disposable {
 
 		const entries = parts.map((part): IChatRequestVariableEntry => {
 			if (part.kind === 'data' && getAttachableImageExtension(part.mimeType)) {
-				return { kind: 'image', id: generateUuid(), name: `image.${getAttachableImageExtension(part.mimeType)}`, value: part.value, mimeType: part.mimeType, isURL: false };
+				return { kind: 'image', id: generateUuid(), name: part.uri ? basename(part.uri) : `image.${getAttachableImageExtension(part.mimeType)}`, value: part.value, mimeType: part.mimeType, isURL: false };
 			} else if (part.kind === 'resource') {
 				return { kind: 'file', id: generateUuid(), name: basename(part.uri), fullName: part.uri.path, value: part.uri };
 			} else if (part.kind === 'data') {
@@ -244,6 +248,23 @@ export class ChatCollapsibleInputOutputContentPart extends Disposable {
 			}
 		};
 
+		attachments.dragStartHandler = (attachment, event, element) => {
+			if (!event.dataTransfer) {
+				return;
+			}
+
+			const index = entries.indexOf(attachment);
+			const part = parts[index];
+			if (!part.uri) {
+				return;
+			}
+
+			applyDragImage(event, element, attachment.name);
+			event.dataTransfer.effectAllowed = 'copy';
+			event.dataTransfer.setData(DataTransfers.TEXT, part.uri.toString());
+			this._instantiationService.invokeFunction(accessor => fillEditorsDragData(accessor, [part.uri!], event));
+		};
+
 		el.items.appendChild(attachments.domNode!);
 
 		const toolbar = this._register(this._instantiationService.createInstance(MenuWorkbenchToolBar, el.actions, MenuId.ChatToolOutputResourceToolbar, {
@@ -317,7 +338,7 @@ class SaveResourcesAction extends Action2 {
 		const defaultFilepath = await fileDialog.defaultFilePath();
 
 		const partBasename = (part: IChatCollapsibleIODataPart | IChatCollapsibleIOResourcePart) =>
-			part.kind === 'resource' ? basename(part.uri) : ('file' + (getExtensionForMimeType(part.mimeType) || ''));
+			(part.kind === 'resource' || part.uri) ? basename(part.uri!) : ('file' + (getExtensionForMimeType(part.mimeType) || ''));
 
 		const savePart = async (part: IChatCollapsibleIODataPart | IChatCollapsibleIOResourcePart, isFolder: boolean, uri: URI) => {
 			const target = isFolder ? joinPath(uri, partBasename(part)) : uri;

src/vs/workbench/contrib/chat/browser/chatContentParts/toolInvocationParts/chatInputOutputMarkdownProgressPart.ts

@@ -101,7 +101,7 @@ export class ChatInputOutputMarkdownProgressPart extends BaseChatToolInvocationS
 					if (o.type === 'data') {
 						const decoded = decodeBase64(o.value64).buffer;
 						if (getAttachableImageExtension(o.mimeType)) {
-							return { kind: 'data', value: decoded, mimeType: o.mimeType };
+							return { kind: 'data', value: decoded, mimeType: o.mimeType, uri: o.uri };
 						} else {
 							return toCodePart(localize('toolResultData', "Data of type {0} ({1} bytes)", o.mimeType, decoded.byteLength));
 						}

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

@@ -125,7 +125,7 @@ export function isToolInvocationContext(obj: any): obj is IToolInvocationContext
 
 export interface IToolResultInputOutputDetails {
 	readonly input: string;
-	readonly output: ({ type: 'text'; value: string } | { type: 'data'; mimeType: string; value64: string } | { type: 'resource'; uri: URI })[];
+	readonly output: ({ type: 'text'; value: string } | { type: 'data'; mimeType: string; value64: string; uri?: URI } | { type: 'resource'; uri: URI })[];
 	readonly isError?: boolean;
 }
 

src/vs/workbench/contrib/mcp/common/mcpResourceFilesystem.ts

@@ -41,7 +41,8 @@ export class McpResourceFilesystem extends Disposable implements IWorkbenchContr
 		| FileSystemProviderCapabilities.Readonly
 		| FileSystemProviderCapabilities.PathCaseSensitive
 		| FileSystemProviderCapabilities.FileReadStream
-		| FileSystemProviderCapabilities.FileAtomicRead;
+		| FileSystemProviderCapabilities.FileAtomicRead
+		| FileSystemProviderCapabilities.FileReadWrite;
 
 	constructor(
 		@IInstantiationService private readonly _instantiationService: IInstantiationService,

src/vs/workbench/contrib/mcp/common/mcpService.ts

@@ -11,6 +11,7 @@ import { markdownCommandLink, MarkdownString } from '../../../../base/common/htm
 import { Disposable, DisposableStore, IReference, toDisposable } from '../../../../base/common/lifecycle.js';
 import { equals } from '../../../../base/common/objects.js';
 import { autorun, IObservable, observableValue, transaction } from '../../../../base/common/observable.js';
+import { URI } from '../../../../base/common/uri.js';
 import { localize } from '../../../../nls.js';
 import { IInstantiationService } from '../../../../platform/instantiation/common/instantiation.js';
 import { ILogService } from '../../../../platform/log/common/log.js';
@@ -280,7 +281,7 @@ class McpToolImplementation implements IToolImpl {
 			isError: callResult.isError === true,
 		};
 
-		for (let item of callResult.content) {
+		for (const item of callResult.content) {
 			const audience = item.annotations?.audience || ['assistant'];
 			if (audience.includes('user')) {
 				if (item.type === 'text') {
@@ -289,9 +290,15 @@ class McpToolImplementation implements IToolImpl {
 			}
 
 			// Rewrite image rsources to images so they are inlined nicely
-			if (item.type === 'resource' && item.resource.mimeType && getAttachableImageExtension(item.resource.mimeType) && 'blob' in item.resource) {
-				item = { type: 'image', mimeType: item.resource.mimeType, data: item.resource.blob };
-			}
+			const addAsInlineData = (mimeType: string, value64: string, uri?: URI) => {
+				details.output.push({ type: 'data', mimeType, value64, uri });
+				if (isForModel) {
+					result.content.push({
+						kind: 'data',
+						value: { mimeType, data: decodeBase64(value64) }
+					});
+				}
+			};
 
 			const isForModel = audience.includes('assistant');
 			if (item.type === 'text') {
@@ -303,21 +310,19 @@ class McpToolImplementation implements IToolImpl {
 					});
 				}
 			} else if (item.type === 'image' || item.type === 'audio') {
-				details.output.push({ type: 'data', mimeType: item.mimeType, value64: item.data });
-				if (isForModel) {
-					result.content.push({
-						kind: 'data',
-						value: { mimeType: item.mimeType, data: decodeBase64(item.data) }
-					});
-				}
+				addAsInlineData(item.mimeType, item.data);
 			} else if (item.type === 'resource') {
 				const uri = McpResourceURI.fromServer(this._server.definition, item.resource.uri);
-				details.output.push({ type: 'resource', uri });
-				if (isForModel) {
-					result.content.push({
-						kind: 'text',
-						value: 'text' in item.resource ? item.resource.text : `The tool returns a resource which can be read from the URI ${uri}`,
-					});
+				if (item.resource.mimeType && getAttachableImageExtension(item.resource.mimeType) && 'blob' in item.resource) {
+					addAsInlineData(item.resource.mimeType, item.resource.blob, uri);
+				} else {
+					details.output.push({ type: 'resource', uri });
+					if (isForModel) {
+						result.content.push({
+							kind: 'text',
+							value: 'text' in item.resource ? item.resource.text : `The tool returns a resource which can be read from the URI ${uri}`,
+						});
+					}
 				}
 			}
 		}