mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-14 17:22:20 -05:00
improve the loading component (#8251)
* improve the loading component * fix unused method warning * revert the change
This commit is contained in:
@@ -12,20 +12,23 @@ import * as azdata from 'azdata';
|
||||
|
||||
import { ComponentBase } from 'sql/workbench/browser/modelComponents/componentBase';
|
||||
import { IComponent, IComponentDescriptor, IModelStore } from 'sql/workbench/browser/modelComponents/interfaces';
|
||||
import * as nls from 'vs/nls';
|
||||
import { localize } from 'vs/nls';
|
||||
|
||||
@Component({
|
||||
selector: 'modelview-loadingComponent',
|
||||
template: `
|
||||
<div class="modelview-loadingComponent-container" role="alert" aria-busy="true" *ngIf="loading">
|
||||
<div class="modelview-loadingComponent-spinner" *ngIf="loading" [title]=_loadingTitle #spinnerElement></div>
|
||||
<div role="status" aria-live="polite" class="modelview-loading-component-status-message">
|
||||
{{getStatusText()}}
|
||||
</div>
|
||||
<div class="modelview-loadingComponent-container" aria-busy="true" *ngIf="loading">
|
||||
<div class="modelview-loadingComponent-spinner" [title]="getStatusText()" #spinnerElement></div>
|
||||
<div *ngIf="showText" class="modelview-loadingComponent-status-text">{{getStatusText()}}</div>
|
||||
</div>
|
||||
<model-component-wrapper #childElement [descriptor]="_component" [modelStore]="modelStore" *ngIf="_component" [ngClass]="{'modelview-loadingComponent-content-loading': loading}">
|
||||
</model-component-wrapper>
|
||||
`
|
||||
})
|
||||
export default class LoadingComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit {
|
||||
public readonly _loadingTitle = nls.localize('loadingMessage', "Loading");
|
||||
private _component: IComponentDescriptor;
|
||||
|
||||
@Input() descriptor: IComponentDescriptor;
|
||||
@@ -75,8 +78,24 @@ export default class LoadingComponent extends ComponentBase implements IComponen
|
||||
this.layout();
|
||||
}
|
||||
|
||||
public get showText(): boolean {
|
||||
return this.getPropertyOrDefault<azdata.LoadingComponentProperties, boolean>((props) => props.showText, false);
|
||||
}
|
||||
|
||||
public get loadingText(): string {
|
||||
return this.getPropertyOrDefault<azdata.LoadingComponentProperties, string>((props) => props.loadingText, localize('loadingMessage', "Loading"));
|
||||
}
|
||||
|
||||
public get loadingCompletedText(): string {
|
||||
return this.getPropertyOrDefault<azdata.LoadingComponentProperties, string>((props) => props.loadingCompletedText, localize('loadingCompletedMessage', "Loading completed"));
|
||||
}
|
||||
|
||||
public addToContainer(componentDescriptor: IComponentDescriptor): void {
|
||||
this._component = componentDescriptor;
|
||||
this.layout();
|
||||
}
|
||||
|
||||
public getStatusText(): string {
|
||||
return this.loading ? this.loadingText : this.loadingCompletedText;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user