Merge pull request #97347 from codeonline-io/master

Upload folders via D&D in the browser workbench

src/vs/workbench/contrib/files/browser/views/explorerViewer.ts

@@ -939,27 +939,53 @@ export class FileDragAndDrop implements ITreeDragAndDrop<ExplorerItem> {
 	}
 
 	private async handleWebExternalDrop(data: DesktopDragAndDropData, target: ExplorerItem, originalEvent: DragEvent): Promise<void> {
-		data.files.forEach(file => {
+		const items = (originalEvent as any).dataTransfer.items;
+		for (let item of items) {
+			const entry = item.webkitGetAsEntry();
+			await this.uploadFileEntry(entry, target.resource, target);
+
+			if (items.length === 1) {
+				await this.editorService.openEditor({ resource: joinPath(target.resource, entry.name), options: { pinned: true } });
+			}
+		}
+	}
+
+	private async uploadFileEntry(entry: any, parentResource: URI, target: ExplorerItem | undefined): Promise<void> {
+		const resource = joinPath(parentResource, entry.name);
+
+		if (entry.isFile) {
+			// Handle file upload
+			if (target && target.getChild(entry.name)) {
+				const { confirmed } = await this.dialogService.confirm(getFileOverwriteConfirm(resource.path));
+				if (!confirmed) {
+					return;
+				}
+			}
+
+			const file = await new Promise<File>((resolve, reject) => entry.file(resolve, reject));
 			const reader = new FileReader();
 			reader.readAsArrayBuffer(file);
 			reader.onload = async (event) => {
 				const name = file.name;
 				if (typeof name === 'string' && event.target?.result instanceof ArrayBuffer) {
-					if (target.getChild(name)) {
-						const { confirmed } = await this.dialogService.confirm(getFileOverwriteConfirm(name));
-						if (!confirmed) {
-							return;
-						}
-					}
 
-					const resource = joinPath(target.resource, name);
 					await this.fileService.writeFile(resource, VSBuffer.wrap(new Uint8Array(event.target.result)));
-					if (data.files.length === 1) {
-						await this.editorService.openEditor({ resource, options: { pinned: true } });
-					}
 				}
 			};
-		});
+		} else if (entry.isDirectory) {
+			// Handle folder upload
+			await this.fileService.createFolder(resource);
+
+			// Recursive upload files in this directory
+			const folderTarget = target && target.getChild(entry.name) || undefined;
+			const dirReader = entry.createReader();
+			const childEntries = await new Promise<any[]>((resolve, reject) => {
+				dirReader.readEntries(resolve, reject);
+			});
+			for (let childEntry of childEntries) {
+				await this.uploadFileEntry(childEntry, resource, folderTarget);
+			}
+		}
 	}
 
 	private async handleExternalDrop(data: DesktopDragAndDropData, target: ExplorerItem, originalEvent: DragEvent): Promise<void> {