diff --git a/src/domain/ForcedLogoutViewModel.ts b/src/domain/ForcedLogoutViewModel.ts index 87c71418..5b7f84ef 100644 --- a/src/domain/ForcedLogoutViewModel.ts +++ b/src/domain/ForcedLogoutViewModel.ts @@ -24,6 +24,8 @@ export class ForcedLogoutViewModel extends ViewModel { private _sessionId: string; private _error?: Error; private _logoutPromise: Promise; + private _showStatus: boolean = false; + private _showSpinner: boolean = false; constructor(options: Options) { super(options); @@ -38,18 +40,35 @@ export class ForcedLogoutViewModel extends ViewModel { } catch (err) { this._error = err; + this._showSpinner = false; + this._showStatus = true; this.emitChange("error"); } } async proceed(): Promise { + 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; + } } diff --git a/src/platform/web/ui/ForcedLogoutView.js b/src/platform/web/ui/ForcedLogoutView.js index fe18dac3..9add5504 100644 --- a/src/platform/web/ui/ForcedLogoutView.js +++ b/src/platform/web/ui/ForcedLogoutView.js @@ -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; }) ), ]);