UI: Fixed 2fa auth.guard and setting style

ui-ngx/src/app/core/guards/auth.guard.ts

@@ -78,7 +78,7 @@ export class AuthGuard implements CanActivate, CanActivateChild {
         const params = lastChild.params || {};
         const isPublic = data.module === 'public';
 
-        if (!authState.isAuthenticated) {
+        if (!authState.isAuthenticated || isPublic) {
           if (publicId && publicId.length > 0) {
             this.authService.setUserFromJwtToken(null, null, false);
             this.authService.reloadUser();
@@ -95,7 +95,15 @@ export class AuthGuard implements CanActivate, CanActivateChild {
                 })
               );
             } else if (path === 'login.mfa') {
-              return of(this.router.parseUrl('/login'));
+              if (authState.authUser?.authority === Authority.PRE_VERIFICATION_TOKEN) {
+                return this.authService.getAvailableTwoFaLoginProviders().pipe(
+                  map(() => {
+                    return true;
+                  })
+                );
+              }
+              this.authService.logout();
+              return of(this.authService.defaultUrl(false));
             } else {
               return of(true);
             }
@@ -117,13 +125,6 @@ export class AuthGuard implements CanActivate, CanActivateChild {
             return of(false);
           }
           if (authState.authUser.authority === Authority.PRE_VERIFICATION_TOKEN) {
-            if (path === 'login.mfa') {
-              return this.authService.getAvailableTwoFaLoginProviders().pipe(
-                map(() => {
-                  return true;
-                })
-              );
-            }
             this.authService.logout();
             return of(false);
           }

ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.html

@@ -30,7 +30,7 @@
     <mat-card-content>
       <form [formGroup]="twoFaFormGroup" (ngSubmit)="save()">
         <fieldset [disabled]="isLoading$ | async">
-          <ng-container>
+          <div>
             <fieldset class="fields-group" formArrayName="providers">
               <legend class="group-title" translate>admin.2fa.available-providers</legend>
               <ng-container *ngFor="let provider of providersForm.controls; let i = index; let $last = last; trackBy: trackByElement">
@@ -186,14 +186,14 @@
                 </ng-template>
               </mat-expansion-panel>
             </fieldset>
-            <div fxLayout="row" fxLayoutAlign="end center" fxLayoutGap="8px">
-              <button mat-button mat-raised-button color="primary"
-                      [disabled]="(isLoading$ | async) || twoFaFormGroup.invalid || !twoFaFormGroup.dirty"
-                      type="submit">
-                {{'action.save' | translate}}
-              </button>
-            </div>
-          </ng-container>
+          </div>
+          <div fxLayout="row" fxLayoutAlign="end center" fxLayoutGap="8px">
+            <button mat-button mat-raised-button color="primary"
+                    [disabled]="(isLoading$ | async) || twoFaFormGroup.invalid || !twoFaFormGroup.dirty"
+                    type="submit">
+              {{'action.save' | translate}}
+            </button>
+          </div>
         </fieldset>
       </form>
     </mat-card-content>

ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts

@@ -147,9 +147,9 @@ export class TwoFactorAuthSettingsComponent extends PageComponent implements OnI
   }
 
   private setAuthConfigFormValue(settings: TwoFactorAuthSettings) {
-    const [checkRateLimitNumber, checkRateLimitTime] = this.splitRateLimit(settings.verificationCodeCheckRateLimit);
-    const allowProvidersConfig = settings.providers.map(provider => provider.providerType);
-    const processFormValue: TwoFactorAuthSettingsForm = Object.assign(deepClone(settings), {
+    const [checkRateLimitNumber, checkRateLimitTime] = this.splitRateLimit(settings?.verificationCodeCheckRateLimit);
+    const allowProvidersConfig = settings?.providers.map(provider => provider.providerType) || [];
+    const processFormValue: TwoFactorAuthSettingsForm = Object.assign({}, settings, {
       verificationCodeCheckRateLimitEnable: checkRateLimitNumber > 0,
       verificationCodeCheckRateLimitNumber: checkRateLimitNumber || 3,
       verificationCodeCheckRateLimitTime: checkRateLimitTime || 900,