loading indicator for table designer (#17407)

* loading indicator for table designer

* fix layering error

* bug fix
This commit is contained in:
Alan Ren
2021-10-20 12:54:23 -07:00
committed by GitHub
parent 328ed83cb9
commit c89aa26c0a
7 changed files with 165 additions and 12 deletions

View File

@@ -18,6 +18,7 @@ export class TableDesignerComponentInput implements DesignerComponentInput {
private _valid: boolean = true;
private _dirty: boolean = false;
private _saving: boolean = false;
private _processing: boolean = false;
private _onStateChange = new Emitter<DesignerState>();
public readonly onStateChange: Event<DesignerState> = this._onStateChange.event;
@@ -39,6 +40,10 @@ export class TableDesignerComponentInput implements DesignerComponentInput {
return this._saving;
}
get processing(): boolean {
return this._processing;
}
get objectTypeDisplayName(): string {
return localize('tableDesigner.tableObjectType', "Table");
}
@@ -58,11 +63,12 @@ export class TableDesignerComponentInput implements DesignerComponentInput {
}
async processEdit(edit: DesignerEdit): Promise<DesignerEditResult> {
this.updateState(this.valid, this.dirty, this.saving, true);
const result = await this._provider.processTableEdit(this._tableInfo, this._viewModel!, edit);
if (result.isValid) {
this._viewModel = result.viewModel;
}
this.updateState(result.isValid, true, this.saving);
this.updateState(result.isValid, true, this.saving, false);
return {
isValid: result.isValid,
errors: result.errors
@@ -75,37 +81,40 @@ export class TableDesignerComponentInput implements DesignerComponentInput {
message: localize('tableDesigner.savingChanges', "Saving table designer changes...")
});
try {
this.updateState(this.valid, this.dirty, true);
this.updateState(this.valid, this.dirty, true, true);
await this._provider.saveTable(this._tableInfo, this._viewModel);
this.updateState(true, false, false);
this.updateState(true, false, false, false);
notificationHandle.updateMessage(localize('tableDesigner.savedChangeSuccess', "The changes have been successfully saved."));
} catch (error) {
notificationHandle.updateSeverity(Severity.Error);
notificationHandle.updateMessage(localize('tableDesigner.saveChangeError', "An error occured while saving changes: {0}", error?.message ?? error));
this.updateState(this.valid, this.dirty, false);
this.updateState(this.valid, this.dirty, false, false);
}
}
async revert(): Promise<void> {
this.updateState(true, false, false);
this.updateState(true, false, false, false);
}
private updateState(valid: boolean, dirty: boolean, saving: boolean): void {
if (this._dirty !== dirty || this._valid !== valid || this._saving !== saving) {
private updateState(valid: boolean, dirty: boolean, saving: boolean, processing: boolean): void {
if (this._dirty !== dirty || this._valid !== valid || this._saving !== saving || this._processing !== processing) {
this._dirty = dirty;
this._valid = valid;
this._saving = saving;
this._processing = processing;
this._onStateChange.fire({
valid: this._valid,
dirty: this._dirty,
saving: this._saving
saving: this._saving,
processing: this._processing
});
}
}
private async initialize(): Promise<void> {
this.updateState(this.valid, this.dirty, this.saving, true);
const designerInfo = await this._provider.getTableDesignerInfo(this._tableInfo);
this.updateState(this.valid, this.dirty, this.saving, false);
this._viewModel = designerInfo.viewModel;
this.setDefaultData();