enable table designer for table script in sql database project (#19237)

* add 'open in designer' to context menu of tables in sql projects

* fix tests

* Address comments

* enable table designer for sql database proj

* update label and issues on init

* vbump sts

* use promisified fs

* pr comments

Co-authored-by: Alan Ren <alanren@microsoft.com>
This commit is contained in:
Kim Santiago
2022-06-02 10:27:47 -10:00
committed by GitHub
parent d3c474162d
commit 1bbf5a78c1
16 changed files with 219 additions and 118 deletions

View File

@@ -51,7 +51,7 @@ export interface DesignerComponentInput {
/**
* Start initilizing the designer input object.
*/
initialize(): void;
initialize(): Promise<void>;
/**
* Start processing the edit made in the designer, the OnEditProcessed event will be fired when the processing is done.

View File

@@ -11,13 +11,10 @@ import { TableDesignerProvider } from 'sql/workbench/services/tableDesigner/comm
import * as azdata from 'azdata';
import { GroupIdentifier, IEditorInput, IRevertOptions, ISaveOptions } from 'vs/workbench/common/editor';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
import { IEditorService } from 'vs/workbench/services/editor/common/editorService';
import { onUnexpectedError } from 'vs/base/common/errors';
import { Schemas } from 'sql/base/common/schemas';
import { INotificationService } from 'vs/platform/notification/common/notification';
const NewTable: string = localize('tableDesigner.newTable', "New Table");
enum TableIcon {
Basic = 'Basic',
Temporal = 'Temporal',
@@ -43,19 +40,20 @@ export class TableDesignerInput extends EditorInput {
tableInfo: azdata.designers.TableInfo,
telemetryInfo: { [key: string]: string },
@IInstantiationService private readonly _instantiationService: IInstantiationService,
@IEditorService private readonly _editorService: IEditorService,
@INotificationService private readonly _notificationService: INotificationService) {
super();
this._designerComponentInput = this._instantiationService.createInstance(TableDesignerComponentInput, this._provider, tableInfo, telemetryInfo);
this._register(this._designerComponentInput.onStateChange((e) => {
if (e.previousState.pendingAction === 'publish') {
this.setEditorLabel();
this._onDidChangeLabel.fire();
}
if (e.currentState.dirty !== e.previousState.dirty) {
this._onDidChangeDirty.fire();
}
}));
this._register(this._designerComponentInput.onInitialized(() => {
this.setEditorLabel();
}));
// default to basic if icon is null (new table) or no sub type
this._tableIcon = tableInfo.tableIcon ? tableInfo.tableIcon as TableIcon : TableIcon.Basic;
@@ -97,7 +95,7 @@ export class TableDesignerInput extends EditorInput {
if (this._designerComponentInput.pendingAction) {
this._notificationService.warn(localize('tableDesigner.OperationInProgressWarning', "The operation cannot be performed while another operation is in progress."));
} else {
await this._designerComponentInput.openPublishDialog();
await this._designerComponentInput.save();
}
return this;
}
@@ -118,18 +116,8 @@ export class TableDesignerInput extends EditorInput {
}
private setEditorLabel(): void {
const tableInfo = this._designerComponentInput.tableInfo;
if (tableInfo.isNewTable) {
const existingNames = this._editorService.editors.map(editor => editor.getName());
// Find the next available unique name for the new table designer
let idx = 1;
do {
this._name = `${NewTable} ${idx}`;
idx++;
} while (existingNames.indexOf(this._name) !== -1);
} else {
this._name = `${tableInfo.schema}.${tableInfo.name}`;
}
this._title = `${tableInfo.server}.${tableInfo.database} - ${this._name}`;
this._name = this._designerComponentInput.tableInfo.title;
this._title = this._designerComponentInput.tableInfo.tooltip;
this._onDidChangeLabel.fire();
}
}

View File

@@ -6,57 +6,56 @@
import { TableDesignerComponentInput } from 'sql/workbench/services/tableDesigner/browser/tableDesignerComponentInput';
import { Action } from 'vs/base/common/actions';
import { Codicon } from 'vs/base/common/codicons';
import { IDisposable } from 'vs/base/common/lifecycle';
import { DisposableStore } from 'vs/base/common/lifecycle';
import { localize } from 'vs/nls';
export abstract class TableChangesActionBase extends Action {
protected _input: TableDesignerComponentInput;
private _onStateChangeDisposable: IDisposable;
const PublishChangesLabel = localize('tableDesigner.publishTableChanges', "Publish Changes...");
const SaveChangesLabel = localize('tableDesigner.saveTableChanges', "Save");
constructor(id: string, label: string, iconClassNames: string) {
super(id, label, iconClassNames);
export class SaveTableChangesAction extends Action {
public static ID = 'tableDesigner.publishTableChanges';
protected _input: TableDesignerComponentInput;
protected _inputDisposableStore: DisposableStore;
constructor() {
super(SaveTableChangesAction.ID);
this._inputDisposableStore = new DisposableStore();
}
public setContext(input: TableDesignerComponentInput): void {
this._input = input;
this.updateState();
this._onStateChangeDisposable?.dispose();
this._onStateChangeDisposable = input.onStateChange((e) => {
this.updateLabelAndIcon();
this._inputDisposableStore?.dispose();
this._inputDisposableStore = new DisposableStore();
this._inputDisposableStore.add(input.onStateChange((e) => {
this.updateState();
});
}));
this._inputDisposableStore.add(input.onInitialized(() => {
this.updateLabelAndIcon();
}));
}
private updateState(): void {
this.enabled = this._input.dirty && this._input.valid && this._input.pendingAction === undefined;
}
private updateLabelAndIcon(): void {
if (this._input?.tableDesignerView?.useAdvancedSaveMode) {
this.label = PublishChangesLabel;
this.class = Codicon.repoPush.classNames;
} else {
this.label = SaveChangesLabel;
this.class = Codicon.save.classNames;
}
}
public override async run(): Promise<void> {
await this._input.save();
}
override dispose() {
super.dispose();
this._onStateChangeDisposable?.dispose();
}
}
export class PublishTableChangesAction extends TableChangesActionBase {
public static ID = 'tableDesigner.publishTableChanges';
public static LABEL = localize('tableDesigner.publishTableChanges', "Publish Changes...");
constructor() {
super(PublishTableChangesAction.ID, PublishTableChangesAction.LABEL, Codicon.repoPush.classNames);
}
public override async run(): Promise<void> {
await this._input.openPublishDialog();
}
}
export class GenerateTableChangeScriptAction extends TableChangesActionBase {
public static ID = 'tableDesigner.generateScript';
public static LABEL = localize('tableDesigner.generateScript', "Generate Script");
constructor() {
super(GenerateTableChangeScriptAction.ID, GenerateTableChangeScriptAction.LABEL, Codicon.output.classNames);
}
public override async run(): Promise<void> {
await this._input.generateScript();
this._inputDisposableStore?.dispose();
}
}

View File

@@ -16,7 +16,7 @@ import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
import { EditorPane } from 'vs/workbench/browser/parts/editor/editorPane';
import { IEditorOpenContext } from 'vs/workbench/common/editor';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { PublishTableChangesAction } from 'sql/workbench/contrib/tableDesigner/browser/actions';
import { SaveTableChangesAction } from 'sql/workbench/contrib/tableDesigner/browser/actions';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
import { IColorTheme, ICssStyleCollector, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
import { DesignerPaneSeparator } from 'sql/platform/theme/common/colorRegistry';
@@ -26,7 +26,7 @@ export class TableDesignerEditor extends EditorPane {
public static readonly ID: string = 'workbench.editor.tableDesigner';
private _designer: Designer;
private _publishChangesAction: PublishTableChangesAction;
private _saveChangesAction: SaveTableChangesAction;
constructor(
@ITelemetryService telemetryService: ITelemetryService,
@@ -45,7 +45,7 @@ export class TableDesignerEditor extends EditorPane {
await super.setInput(input, options, context, token);
const designerInput = input.getComponentInput();
this._designer.setInput(designerInput);
this._publishChangesAction.setContext(designerInput);
this._saveChangesAction.setContext(designerInput);
}
protected createEditor(parent: HTMLElement): void {
@@ -58,9 +58,9 @@ export class TableDesignerEditor extends EditorPane {
const designerContainer = container.appendChild(DOM.$('.designer-container'));
const actionbar = new ActionBar(actionbarContainer);
this._register(actionbar);
this._publishChangesAction = this._instantiationService.createInstance(PublishTableChangesAction);
this._publishChangesAction.enabled = false;
actionbar.push([this._publishChangesAction], { icon: true, label: false });
this._saveChangesAction = this._instantiationService.createInstance(SaveTableChangesAction);
this._saveChangesAction.enabled = false;
actionbar.push([this._saveChangesAction], { icon: true, label: false });
this._designer = this._instantiationService.createInstance(Designer, designerContainer);
this._register(attachDesignerStyler(this._designer, this.themeService));

View File

@@ -33,6 +33,7 @@ export class TableDesignerComponentInput implements DesignerComponentInput {
private _onEditProcessed = new Emitter<DesignerEditProcessedEventArgs>();
private _onRefreshRequested = new Emitter<void>();
private _originalViewModel: DesignerViewModel;
private _tableDesignerView: azdata.designers.TableDesignerView;
public readonly onInitialized: Event<void> = this._onInitialized.event;
public readonly onEditProcessed: Event<DesignerEditProcessedEventArgs> = this._onEditProcessed.event;
@@ -81,6 +82,10 @@ export class TableDesignerComponentInput implements DesignerComponentInput {
return this._issues;
}
get tableDesignerView(): azdata.designers.TableDesignerView {
return this._tableDesignerView;
}
processEdit(edit: DesignerEdit): void {
const telemetryInfo = this.createTelemetryInfo();
telemetryInfo.tableObjectType = this.getObjectTypeFromPath(edit.path);
@@ -177,6 +182,14 @@ export class TableDesignerComponentInput implements DesignerComponentInput {
}
}
async save(): Promise<void> {
if (this.tableDesignerView?.useAdvancedSaveMode) {
await this.openPublishDialog();
} else {
await this.publishChanges();
}
}
async openPublishDialog(): Promise<void> {
const reportNotificationHandle = this._notificationService.notify({
severity: Severity.Info,
@@ -243,24 +256,28 @@ export class TableDesignerComponentInput implements DesignerComponentInput {
}
}
initialize(): void {
async initialize(): Promise<void> {
if (this._view !== undefined || this.pendingAction === 'initialize') {
return;
}
this.updateState(this.valid, this.dirty, 'initialize');
this._provider.initializeTableDesigner(this.tableInfo).then(result => {
try {
const result = await this._provider.initializeTableDesigner(this.tableInfo);
this.doInitialization(result);
this._onInitialized.fire();
}, error => {
} catch (error) {
this._errorMessageService.showDialog(Severity.Error, ErrorDialogTitle, localize('tableDesigner.errorInitializingTableDesigner', "An error occurred while initializing the table designer: {0}", error?.message ?? error));
});
}
}
private doInitialization(designerInfo: azdata.designers.TableDesignerInfo): void {
this.tableInfo = designerInfo.tableInfo;
this.updateState(true, this.tableInfo.isNewTable);
this._viewModel = designerInfo.viewModel;
this._originalViewModel = this.tableInfo.isNewTable ? undefined : deepClone(this._viewModel);
this._tableDesignerView = designerInfo.view;
this._issues = designerInfo.issues;
this.setDesignerView(designerInfo.view);
}