Data workspace projects changes (#13466)

* Fix project context menu actions (#12541) * delete works again * make fewer changes * update all sql db project commands * cleanup * Remove old projects view (#12563) * remove old projects view from file explorer view * fix tests failing * remove projects in open folder opening up in old view * Update db reference dialog to show projects in the workspace (#12580) * update database reference dialog to show projects in the workspace in the project dropdown * remove workspace stuff from sql projects extension * undo change * add class that implements IExtension * undo a change * update DataWorkspaceExtension to take workspaceService as a parameter * add type * Update sql database project commands (#12595) * remove sql proj's open and create new project from comman palette * hook up create project from database to data workspace * rename the remaining import databases to create project from database * remove open, new, and close commands * expose addProjectsToWorkspace() in IExtension instead of calling command * Addressing comments * fix failing sql project tests (#12651) * update SSDT projects opened in projects viewlet (#12669) * fix action not refreshing the tree issue (#12692) * fix adding project references in new projects viewlet (#12688) * Remove old projects tree provider (#12702) * Remove old projects tree provider and fix tests * formatting * update refreshProjectsTree() to accept workspaceTreeItem() * Cleanup ProjectsController (#12718) * remove openProject from ProjectController and some cleanup * rename * add project and open project dialogs (#12729) * empty dialogs * wip * new project dialog implementation * revert gitattributes * open project dialog * implement add project * remove icon helper * refactor * revert script change * adjust views * more updates * make data-workspace a builtin extension * show the view only when project provider is detected (#12819) * only show the view when proj provider is available * update * fix sql project tests after merge (#12793) * Update dialogs to be closer to mockups (#12879) * small UI changes to dialogs * center radio card group text * Create workspace if needed when opening/new project (#12930) * empty dialogs * wip * new project dialog implementation * revert gitattributes * open project dialog * implement add project * remove icon helper * refactor * revert script change * create workspace * initial changes * create new workspace working * fix tests * cleanup * remove showWorkspaceRequiredNotification() * Add test for no workspace open * update blue buttons * move loading temp project to activate() instead of workspaceService constructor * move workspace creation warning message to before project is created * pass uri to createWorkspace * add tests Co-authored-by: Alan Ren <alanren@microsoft.com> * Additional create workspace changes (#13004) * Dialogs workspace updates (#13010) * adding workspace text boxes * match new project dialog to mockups * Add validation error message for workspace file * add enterWorkspace api * add warning message for opening workspace * cleanup * update commands to remove project so they're more generic * remove 'empty' from string * Move default project location setting to data workspace extension (#13022) * remove project location setting and notification from sql database projects extension * add default project location setting to data workspace extension * fix typo * Add back project name incrementing * other merge fixes * fix strings from other PR * default to last opened directory instead of home directory if no specified default location * A few small updates (#13092) * fix build error * update title for inputboxes * add missing file * Add tests for data workspace dialogs (#13324) * add tests for dialogs * create helper functions * New project dialog workspace inputbox fixes (#13407) * workspace inputbox fixes * fix folder icons * Update package.jsons and readme (#13451) * update package.jsons * update readme * add workspace information to open existing dialog (#13455) Co-authored-by: Alan Ren <alanren@microsoft.com>
2026-01-29 09:35:38 -05:00 · 2020-11-18 16:13:43 -08:00
parent 34170e7741
commit ddc8c00090
63 changed files with 1835 additions and 931 deletions
--- a/extensions/data-workspace/src/dialogs/dialogBase.ts
+++ b/extensions/data-workspace/src/dialogs/dialogBase.ts
@@ -0,0 +1,125 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+import * as azdata from 'azdata';
+import * as vscode from 'vscode';
+import * as path from 'path';
+import * as constants from '../common/constants';
+
+interface Deferred<T> {
+	resolve: (result: T | Promise<T>) => void;
+	reject: (reason: any) => void;
+}
+
+export abstract class DialogBase {
+	protected _toDispose: vscode.Disposable[] = [];
+	protected _dialogObject: azdata.window.Dialog;
+	protected initDialogComplete: Deferred<void> | undefined;
+	protected initDialogPromise: Promise<void> = new Promise<void>((resolve, reject) => this.initDialogComplete = { resolve, reject });
+	protected workspaceFormComponent: azdata.FormComponent | undefined;
+	protected workspaceInputBox: azdata.InputBoxComponent | undefined;
+
+	constructor(dialogTitle: string, dialogName: string, dialogWidth: azdata.window.DialogWidth = 600) {
+		this._dialogObject = azdata.window.createModelViewDialog(dialogTitle, dialogName, dialogWidth);
+		this._dialogObject.okButton.label = constants.OkButtonText;
+		this.register(this._dialogObject.cancelButton.onClick(() => this.onCancelButtonClicked()));
+		this.register(this._dialogObject.okButton.onClick(() => this.onOkButtonClicked()));
+		this._dialogObject.registerCloseValidator(async () => {
+			return this.validate();
+		});
+	}
+
+	protected abstract initialize(view: azdata.ModelView): Promise<void>;
+
+	protected async validate(): Promise<boolean> {
+		return Promise.resolve(true);
+	}
+
+	public async open(): Promise<void> {
+		const tab = azdata.window.createTab('');
+		tab.registerContent(async (view: azdata.ModelView) => {
+			return this.initialize(view);
+		});
+		this._dialogObject.content = [tab];
+		azdata.window.openDialog(this._dialogObject);
+		await this.initDialogPromise;
+	}
+
+	private onCancelButtonClicked(): void {
+		this.dispose();
+	}
+
+	private async onOkButtonClicked(): Promise<void> {
+		await this.onComplete();
+		this.dispose();
+	}
+
+	protected async onComplete(): Promise<void> {
+	}
+
+	protected dispose(): void {
+		this._toDispose.forEach(disposable => disposable.dispose());
+	}
+
+	protected register(disposable: vscode.Disposable): void {
+		this._toDispose.push(disposable);
+	}
+
+	protected showErrorMessage(message: string): void {
+		this._dialogObject.message = {
+			text: message,
+			level: azdata.window.MessageLevel.Error
+		};
+	}
+
+	protected createHorizontalContainer(view: azdata.ModelView, items: azdata.Component[]): azdata.FlexContainer {
+		return view.modelBuilder.flexContainer().withItems(items, { CSSStyles: { 'margin-right': '5px', 'margin-bottom': '10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
+	}
+
+	/**
+	 * Creates container with information on which workspace the project will be added to and where the workspace will be
+	 * created if no workspace is currently open
+	 * @param view
+	 */
+	protected createWorkspaceContainer(view: azdata.ModelView): azdata.FormComponent {
+		const workspaceDescription = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
+			value: vscode.workspace.workspaceFile ? constants.AddProjectToCurrentWorkspace : constants.NewWorkspaceWillBeCreated,
+			CSSStyles: { 'margin-top': '3px', 'margin-bottom': '10px' }
+		}).component();
+
+		this.workspaceInputBox = view.modelBuilder.inputBox().withProperties<azdata.InputBoxProperties>({
+			ariaLabel: constants.WorkspaceLocationTitle,
+			width: constants.DefaultInputWidth,
+			enabled: false,
+			value: vscode.workspace.workspaceFile?.fsPath ?? '',
+			title: vscode.workspace.workspaceFile?.fsPath ?? '' // hovertext for if file path is too long to be seen in textbox
+		}).component();
+
+		const container = view.modelBuilder.flexContainer()
+			.withItems([workspaceDescription, this.workspaceInputBox])
+			.withLayout({ flexFlow: 'column' })
+			.component();
+
+		this.workspaceFormComponent = {
+			title: constants.Workspace,
+			component: container
+		};
+
+		return this.workspaceFormComponent;
+	}
+
+	/**
+	 * Update the workspace inputbox based on the passed in location and name if there isn't a workspace currently open
+	 * @param location
+	 * @param name
+	 */
+	protected updateWorkspaceInputbox(location: string, name: string): void {
+		if (!vscode.workspace.workspaceFile) {
+			const fileLocation = location && name ? path.join(location, `${name}.code-workspace`) : '';
+			this.workspaceInputBox!.value = fileLocation;
+			this.workspaceInputBox!.title = fileLocation;
+		}
+	}
+}
--- a/extensions/data-workspace/src/dialogs/newProjectDialog.ts
+++ b/extensions/data-workspace/src/dialogs/newProjectDialog.ts
@@ -0,0 +1,171 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+import * as azdata from 'azdata';
+import * as vscode from 'vscode';
+import * as path from 'path';
+import { DialogBase } from './dialogBase';
+import { IWorkspaceService } from '../common/interfaces';
+import * as constants from '../common/constants';
+import { IProjectType } from 'dataworkspace';
+import { directoryExist } from '../common/utils';
+import { IconPathHelper } from '../common/iconHelper';
+import { defaultProjectSaveLocation } from '../common/projectLocationHelper';
+
+class NewProjectDialogModel {
+	projectTypeId: string = '';
+	projectFileExtension: string = '';
+	name: string = '';
+	location: string = '';
+}
+export class NewProjectDialog extends DialogBase {
+	public model: NewProjectDialogModel = new NewProjectDialogModel();
+
+	constructor(private workspaceService: IWorkspaceService) {
+		super(constants.NewProjectDialogTitle, 'NewProject');
+	}
+
+	async validate(): Promise<boolean> {
+		try {
+			// the selected location should be an existing directory
+			const parentDirectoryExists = await directoryExist(this.model.location);
+			if (!parentDirectoryExists) {
+				this.showErrorMessage(constants.ProjectParentDirectoryNotExistError(this.model.location));
+				return false;
+			}
+
+			// there shouldn't be an existing sub directory with the same name as the project in the selected location
+			const projectDirectoryExists = await directoryExist(path.join(this.model.location, this.model.name));
+			if (projectDirectoryExists) {
+				this.showErrorMessage(constants.ProjectDirectoryAlreadyExistError(this.model.name, this.model.location));
+				return false;
+			}
+
+			return true;
+		}
+		catch (err) {
+			this.showErrorMessage(err?.message ? err.message : err);
+			return false;
+		}
+	}
+
+	async onComplete(): Promise<void> {
+		try {
+			const validateWorkspace = await this.workspaceService.validateWorkspace();
+			if (validateWorkspace) {
+				await this.workspaceService.createProject(this.model.name, vscode.Uri.file(this.model.location), this.model.projectTypeId);
+			}
+		}
+		catch (err) {
+			vscode.window.showErrorMessage(err?.message ? err.message : err);
+		}
+	}
+
+	protected async initialize(view: azdata.ModelView): Promise<void> {
+		const allProjectTypes = await this.workspaceService.getAllProjectTypes();
+		const projectTypeRadioCardGroup = view.modelBuilder.radioCardGroup().withProperties<azdata.RadioCardGroupComponentProperties>({
+			cards: allProjectTypes.map((projectType: IProjectType) => {
+				return <azdata.RadioCard>{
+					id: projectType.id,
+					label: projectType.displayName,
+					icon: projectType.icon,
+					descriptions: [
+						{
+							textValue: projectType.displayName,
+							textStyles: {
+								'font-size': '13px',
+								'font-weight': 'bold'
+							}
+						}, {
+							textValue: projectType.description
+						}
+					]
+				};
+			}),
+			iconHeight: '50px',
+			iconWidth: '50px',
+			cardWidth: '170px',
+			cardHeight: '170px',
+			ariaLabel: constants.TypeTitle,
+			width: '500px',
+			iconPosition: 'top',
+			selectedCardId: allProjectTypes.length > 0 ? allProjectTypes[0].id : undefined
+		}).component();
+
+		this.register(projectTypeRadioCardGroup.onSelectionChanged((e) => {
+			this.model.projectTypeId = e.cardId;
+		}));
+
+		const projectNameTextBox = view.modelBuilder.inputBox().withProperties<azdata.InputBoxProperties>({
+			ariaLabel: constants.ProjectNameTitle,
+			placeHolder: constants.ProjectNamePlaceholder,
+			required: true,
+			width: constants.DefaultInputWidth
+		}).component();
+
+		this.register(projectNameTextBox.onTextChanged(() => {
+			this.model.name = projectNameTextBox.value!;
+			projectNameTextBox.updateProperty('title', projectNameTextBox.value);
+
+			this.updateWorkspaceInputbox(this.model.location, this.model.name);
+		}));
+
+		const locationTextBox = view.modelBuilder.inputBox().withProperties<azdata.InputBoxProperties>({
+			ariaLabel: constants.ProjectLocationTitle,
+			placeHolder: constants.ProjectLocationPlaceholder,
+			required: true,
+			width: constants.DefaultInputWidth
+		}).component();
+
+		this.register(locationTextBox.onTextChanged(() => {
+			this.model.location = locationTextBox.value!;
+			locationTextBox.updateProperty('title', locationTextBox.value);
+			this.updateWorkspaceInputbox(this.model.location, this.model.name);
+		}));
+
+		const browseFolderButton = view.modelBuilder.button().withProperties<azdata.ButtonProperties>({
+			ariaLabel: constants.BrowseButtonText,
+			iconPath: IconPathHelper.folder,
+			height: '16px',
+			width: '18px'
+		}).component();
+		this.register(browseFolderButton.onDidClick(async () => {
+			let folderUris = await vscode.window.showOpenDialog({
+				canSelectFiles: false,
+				canSelectFolders: true,
+				canSelectMany: false,
+				defaultUri: defaultProjectSaveLocation()
+			});
+			if (!folderUris || folderUris.length === 0) {
+				return;
+			}
+			const selectedFolder = folderUris[0].fsPath;
+			locationTextBox.value = selectedFolder;
+			this.model.location = selectedFolder;
+
+			this.updateWorkspaceInputbox(this.model.location, this.model.name);
+		}));
+
+		const form = view.modelBuilder.formContainer().withFormItems([
+			{
+				title: constants.TypeTitle,
+				required: true,
+				component: projectTypeRadioCardGroup
+			},
+			{
+				title: constants.ProjectNameTitle,
+				required: true,
+				component: this.createHorizontalContainer(view, [projectNameTextBox])
+			}, {
+				title: constants.ProjectLocationTitle,
+				required: true,
+				component: this.createHorizontalContainer(view, [locationTextBox, browseFolderButton])
+			},
+			this.createWorkspaceContainer(view)
+		]).component();
+		await view.initializeModel(form);
+		this.initDialogComplete?.resolve();
+	}
+}
--- a/extensions/data-workspace/src/dialogs/openExistingDialog.ts
+++ b/extensions/data-workspace/src/dialogs/openExistingDialog.ts
@@ -0,0 +1,208 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+import * as azdata from 'azdata';
+import * as vscode from 'vscode';
+import * as path from 'path';
+import { DialogBase } from './dialogBase';
+import * as constants from '../common/constants';
+import { IWorkspaceService } from '../common/interfaces';
+import { fileExist } from '../common/utils';
+import { IconPathHelper } from '../common/iconHelper';
+
+export class OpenExistingDialog extends DialogBase {
+	public _projectFile: string = '';
+	public _workspaceFile: string = '';
+	public _targetTypeRadioCardGroup: azdata.RadioCardGroupComponent | undefined;
+	public _filePathTextBox: azdata.InputBoxComponent | undefined;
+	public formBuilder: azdata.FormBuilder | undefined;
+
+	private _targetTypes = [
+		{
+			name: constants.Project,
+			icon: {
+				dark: this.extensionContext.asAbsolutePath('images/file_inverse.svg'),
+				light: this.extensionContext.asAbsolutePath('images/file.svg')
+			}
+		}, {
+			name: constants.Workspace,
+			icon: {
+				dark: this.extensionContext.asAbsolutePath('images/file_inverse.svg'), // temporary - still waiting for real icon from UX
+				light: this.extensionContext.asAbsolutePath('images/file.svg')
+			}
+		}
+	];
+
+	constructor(private workspaceService: IWorkspaceService, private extensionContext: vscode.ExtensionContext) {
+		super(constants.OpenExistingDialogTitle, 'OpenProject');
+	}
+
+	async validate(): Promise<boolean> {
+		try {
+			// the selected location should be an existing directory
+			if (this._targetTypeRadioCardGroup?.selectedCardId === constants.Project) {
+				const fileExists = await fileExist(this._projectFile);
+				if (!fileExists) {
+					this.showErrorMessage(constants.ProjectFileNotExistError(this._projectFile));
+					return false;
+				}
+			} else if (this._targetTypeRadioCardGroup?.selectedCardId === constants.Workspace) {
+				const fileExists = await fileExist(this._workspaceFile);
+				if (!fileExists) {
+					this.showErrorMessage(constants.WorkspaceFileNotExistError(this._workspaceFile));
+					return false;
+				}
+			}
+
+			return true;
+		}
+		catch (err) {
+			this.showErrorMessage(err?.message ? err.message : err);
+			return false;
+		}
+	}
+
+	async onComplete(): Promise<void> {
+		try {
+			if (this._targetTypeRadioCardGroup?.selectedCardId === constants.Workspace) {
+				await this.workspaceService.enterWorkspace(vscode.Uri.file(this._workspaceFile));
+			} else {
+				const validateWorkspace = await this.workspaceService.validateWorkspace();
+				if (validateWorkspace) {
+					await this.workspaceService.addProjectsToWorkspace([vscode.Uri.file(this._projectFile)]);
+				}
+			}
+		}
+		catch (err) {
+			vscode.window.showErrorMessage(err?.message ? err.message : err);
+		}
+	}
+
+	protected async initialize(view: azdata.ModelView): Promise<void> {
+		this._targetTypeRadioCardGroup = view.modelBuilder.radioCardGroup().withProperties<azdata.RadioCardGroupComponentProperties>({
+			cards: this._targetTypes.map((targetType) => {
+				return <azdata.RadioCard>{
+					id: targetType.name,
+					label: targetType.name,
+					icon: targetType.icon,
+					descriptions: [
+						{
+							textValue: targetType.name,
+							textStyles: {
+								'font-size': '13px'
+							}
+						}
+					]
+				};
+			}),
+			iconHeight: '50px',
+			iconWidth: '50px',
+			cardWidth: '170px',
+			cardHeight: '170px',
+			ariaLabel: constants.TypeTitle,
+			width: '500px',
+			iconPosition: 'top',
+			selectedCardId: constants.Project
+		}).component();
+
+		this._filePathTextBox = view.modelBuilder.inputBox().withProperties<azdata.InputBoxProperties>({
+			ariaLabel: constants.LocationSelectorTitle,
+			placeHolder: constants.ProjectFilePlaceholder,
+			required: true,
+			width: constants.DefaultInputWidth
+		}).component();
+		this.register(this._filePathTextBox.onTextChanged(() => {
+			this._projectFile = this._filePathTextBox!.value!;
+			this._filePathTextBox!.updateProperty('title', this._projectFile);
+			this.updateWorkspaceInputbox(path.dirname(this._projectFile), path.basename(this._projectFile, path.extname(this._projectFile)));
+		}));
+
+		const browseFolderButton = view.modelBuilder.button().withProperties<azdata.ButtonProperties>({
+			ariaLabel: constants.BrowseButtonText,
+			iconPath: IconPathHelper.folder,
+			width: '18px',
+			height: '16px',
+		}).component();
+		this.register(browseFolderButton.onDidClick(async () => {
+			if (this._targetTypeRadioCardGroup?.selectedCardId === constants.Project) {
+				await this.projectBrowse();
+			} else if (this._targetTypeRadioCardGroup?.selectedCardId === constants.Workspace) {
+				await this.workspaceBrowse();
+			}
+		}));
+
+		this.register(this._targetTypeRadioCardGroup.onSelectionChanged(({ cardId }) => {
+			if (cardId === constants.Project) {
+				this._filePathTextBox!.placeHolder = constants.ProjectFilePlaceholder;
+				this.formBuilder?.addFormItem(this.workspaceFormComponent!);
+			} else if (cardId === constants.Workspace) {
+				this._filePathTextBox!.placeHolder = constants.WorkspacePlaceholder;
+				this.formBuilder?.removeFormItem(this.workspaceFormComponent!);
+			}
+
+			// clear selected file textbox
+			this._filePathTextBox!.value = '';
+		}));
+
+		this.formBuilder = view.modelBuilder.formContainer().withFormItems([
+			{
+				title: constants.TypeTitle,
+				required: true,
+				component: this._targetTypeRadioCardGroup,
+			}, {
+				title: constants.LocationSelectorTitle,
+				required: true,
+				component: this.createHorizontalContainer(view, [this._filePathTextBox, browseFolderButton])
+			},
+			this.createWorkspaceContainer(view)
+		]);
+		await view.initializeModel(this.formBuilder?.component());
+		this.initDialogComplete?.resolve();
+	}
+
+	public async workspaceBrowse(): Promise<void> {
+		const filters: { [name: string]: string[] } = { [constants.Workspace]: [constants.WorkspaceFileExtension] };
+		const fileUris = await vscode.window.showOpenDialog({
+			canSelectFiles: true,
+			canSelectFolders: false,
+			canSelectMany: false,
+			openLabel: constants.SelectProjectFileActionName,
+			filters: filters
+		});
+
+		if (!fileUris || fileUris.length === 0) {
+			return;
+		}
+
+		const workspaceFilePath = fileUris[0].fsPath;
+		this._filePathTextBox!.value = workspaceFilePath;
+		this._workspaceFile = workspaceFilePath;
+	}
+
+	public async projectBrowse(): Promise<void> {
+		const filters: { [name: string]: string[] } = {};
+		const projectTypes = await this.workspaceService.getAllProjectTypes();
+		filters[constants.AllProjectTypes] = projectTypes.map(type => type.projectFileExtension);
+		projectTypes.forEach(type => {
+			filters[type.displayName] = [type.projectFileExtension];
+		});
+
+		const fileUris = await vscode.window.showOpenDialog({
+			canSelectFiles: true,
+			canSelectFolders: false,
+			canSelectMany: false,
+			openLabel: constants.SelectProjectFileActionName,
+			filters: filters
+		});
+
+		if (!fileUris || fileUris.length === 0) {
+			return;
+		}
+
+		const projectFilePath = fileUris[0].fsPath;
+		this._filePathTextBox!.value = projectFilePath;
+		this._projectFile = projectFilePath;
+	}
+}