Adding wizard and dialog footer loading spinner (#21230)

* Adding wizard and dialog loading

* Moving apis to proposed

* fixing namespace

* Only firing event when the value changes

* Only firing when value is changed

* Adding loading complete message to dialog and wizard

* Registering listeners and making a new base interface for loading components

* Fixing api comment

* Renaming prop to loadingCompleted

* old loading icon
This commit is contained in:
Aasim Khan
2022-11-30 12:18:34 -08:00
committed by GitHub
parent 62d5c1f2d6
commit c0a194df4a
12 changed files with 242 additions and 14 deletions

View File

@@ -9,8 +9,8 @@ import { Dialog, Wizard } from 'sql/workbench/services/dialog/common/dialogTypes
import { IModalOptions } from 'sql/workbench/browser/modal/modal';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
export const DefaultDialogOptions: IModalOptions = { hasBackButton: false, width: 'narrow', hasErrors: true };
export const DefaultWizardOptions: IModalOptions = { hasBackButton: false, width: 'wide', hasErrors: true };
export const DefaultDialogOptions: IModalOptions = { hasBackButton: false, width: 'narrow', hasErrors: true, hasSpinner: true };
export const DefaultWizardOptions: IModalOptions = { hasBackButton: false, width: 'wide', hasErrors: true, hasSpinner: true };
export class CustomDialogService {
private _dialogModals = new Map<Dialog, DialogModal>();

View File

@@ -93,7 +93,17 @@ export class DialogModal extends Modal {
};
messageChangeHandler(this._dialog.message);
this._dialog.onMessageChange(message => messageChangeHandler(message));
this._register(this._dialog.onMessageChange(message => messageChangeHandler(message)));
this._register(this._dialog.onLoadingChange((loadingState) => {
this.spinner = loadingState;
}));
this._register(this._dialog.onLoadingTextChange((loadingText) => {
this._modalOptions.spinnerTitle = loadingText;
}));
this._register(this._dialog.onLoadingCompletedTextChange((loadingCompletedText) => {
this._modalOptions.onSpinnerHideText = loadingCompletedText;
}));
}
private addDialogButton(button: DialogButton, onSelect: () => void = () => undefined, registerClickEvent: boolean = true, requireDialogValid: boolean = false): Button {

View File

@@ -96,7 +96,21 @@ export class WizardModal extends Modal {
};
messageChangeHandler(this._wizard.message);
this._wizard.onMessageChange(message => messageChangeHandler(message));
this._register(this._wizard.onMessageChange(message => messageChangeHandler(message)));
this._register(this._wizard.onLoadingChange((loadingState) => {
this.spinner = loadingState;
}));
this._register(this._wizard.onLoadingChange((loadingState) => {
this.spinner = loadingState;
}));
this._register(this._wizard.onLoadingTextChange((loadingText) => {
this._modalOptions.spinnerTitle = loadingText;
}));
this._register(this._wizard.onLoadingCompletedTextChange((loadingCompletedText) => {
this._modalOptions.onSpinnerHideText = loadingCompletedText;
}));
}
private addDialogButton(button: DialogButton, onSelect: () => void = () => undefined, registerClickEvent: boolean = true, requirePageValid: boolean = false, index?: number): Button {