Show error, progress in view

This commit is contained in:
RMidhunSuresh 2022-08-24 19:31:38 +05:30
parent 7b173fe8eb
commit 205ecdc52e
2 changed files with 29 additions and 9 deletions

View File

@ -24,6 +24,8 @@ export class ForcedLogoutViewModel extends ViewModel<SegmentType, Options> {
private _sessionId: string;
private _error?: Error;
private _logoutPromise: Promise<void>;
private _showStatus: boolean = false;
private _showSpinner: boolean = false;
constructor(options: Options) {
super(options);
@ -38,18 +40,35 @@ export class ForcedLogoutViewModel extends ViewModel<SegmentType, Options> {
}
catch (err) {
this._error = err;
this._showSpinner = false;
this._showStatus = true;
this.emitChange("error");
}
}
async proceed(): Promise<void> {
this._showSpinner = true;
this._showStatus = true;
this.emitChange("showStatus");
await this._logoutPromise;
this.navigation.push("session", true);
}
get error(): string | undefined {
if (this._error) {
return this.i18n`Could not log out of device: ${this._error.message}`;
if (!this._error) {
this.navigation.push("session", true);
}
}
get status(): string {
if (this._error) {
return this.i18n`Could not log out of device: ${this._error.message}`;
} else {
return this.i18n`Logging out… Please don't close the app.`;
}
}
get showStatus(): boolean {
return this._showStatus;
}
get showSpinner(): boolean {
return this._showSpinner;
}
}

View File

@ -15,6 +15,7 @@ limitations under the License.
*/
import {TemplateView, InlineTemplateView} from "./general/TemplateView";
import {spinner} from "./common.js";
export class ForcedLogoutView extends TemplateView {
render(t, vm) {
@ -31,13 +32,13 @@ export class ForcedLogoutView extends TemplateView {
]);
});
const progressView = new InlineTemplateView(vm, t => {
return t.p({className: "status"}, [ t.span(vm => vm.error) ]);
return t.p({className: "status"}, [spinner(t, {hidden: vm => !vm.showSpinner}), t.span(vm => vm.status)]);
});
return t.div({className: "LogoutScreen"}, [
t.div({className: "content"},
t.mapView(vm => vm.error, error => {
return error? progressView: proceedView;
t.mapView(vm => vm.showStatus, showStatus => {
return showStatus? progressView: proceedView;
})
),
]);