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

@@ -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));