diff --git a/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.html b/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.html index 94bd0b2cf0..24f9ec1bd7 100644 --- a/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.html +++ b/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.html @@ -15,8 +15,11 @@ limitations under the License. --> -
+ @if (isLoading$ | async) { + + } @switch (state()) { @case (ForceTwoFAState.SETUP) { @@ -59,7 +62,7 @@ -
+

login.scan-qr-code

login.enter-key-manually

@@ -109,7 +112,7 @@ -
+

login.sms-description

@@ -156,7 +159,7 @@ -
+

login.email-description

diff --git a/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.scss b/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.scss index d62d7f1628..f1ea95d639 100644 --- a/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.scss +++ b/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.scss @@ -24,6 +24,12 @@ .tb-two-factor-auth-login-content { background-color: #eee; + .progress-bar { + z-index: 10; + margin-bottom: -4px; + width: 450px; + } + .tb-two-factor-auth-login-card { max-height: 100vh; overflow: auto; diff --git a/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.ts b/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.ts index 4cc5f27737..6088c07928 100644 --- a/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.ts +++ b/ui-ngx/src/app/modules/login/pages/login/force-two-factor-auth-login.component.ts @@ -39,6 +39,7 @@ import { getCurrentAuthUser } from '@core/auth/auth.selectors'; import printTemplate from '@home/pages/security/authentication-dialog/backup-code-print-template.raw'; import { ImportExportService } from '@shared/import-export/import-export.service'; import { mergeMap, tap } from 'rxjs/operators'; +import { ActionNotificationShow } from "@core/notification/notification.actions"; enum ForceTwoFAState { SETUP = 'setup', @@ -261,6 +262,13 @@ export class ForceTwoFactorAuthLoginComponent extends PageComponent implements O this.configForm.get('verificationCode').setErrors({incorrectCode: true}); } else if (error.status === 429) { this.configForm.get('verificationCode').setErrors({tooManyRequest: true}); + } else { + this.store.dispatch(new ActionNotificationShow({ + message: error.error.message, + type: 'error', + verticalPosition: 'top', + horizontalPosition: 'left' + })); } } })