Adding loading component to the options window before the options display (#20379)

This commit is contained in:
Sai Avishkar Sreerama
2022-08-16 22:21:30 -05:00
committed by GitHub
parent 94e1637a44
commit 4a2c6e9fb4

View File

@@ -117,6 +117,23 @@ export class SchemaCompareOptionsDialog {
private initializeSchemaCompareOptionsDialogTab(): void {
this.generalOptionsTab.registerContent(async view => {
// create loading component
const loader = view.modelBuilder.loadingComponent()
.withProps({
CSSStyles: {
'margin-top': '50%'
}
})
.component();
this.optionsFlexBuilder = view.modelBuilder.flexContainer()
.withLayout({
flexFlow: 'column'
}).component();
// adding loading component to the flexcontainer
this.optionsFlexBuilder.addItem(loader);
await view.initializeModel(this.optionsFlexBuilder);
this.descriptionHeading = view.modelBuilder.table().withProps({
data: [],
@@ -159,14 +176,10 @@ export class SchemaCompareOptionsDialog {
}
}));
this.optionsFlexBuilder = view.modelBuilder.flexContainer()
.withLayout({
flexFlow: 'column'
}).component();
this.optionsFlexBuilder.addItem(this.optionsTable, { CSSStyles: { 'overflow': 'scroll', 'height': '65vh' } });
this.optionsFlexBuilder.addItem(this.descriptionHeading, { CSSStyles: { 'font-weight': 'bold', 'height': '30px' } });
this.optionsFlexBuilder.addItem(this.descriptionText, { CSSStyles: { 'padding': '4px', 'margin-right': '10px', 'overflow': 'scroll', 'height': '10vh' } });
loader.loading = false;
await view.initializeModel(this.optionsFlexBuilder);
await this.optionsTable.focus();
});