Refactoring

apps/api/src/app/auth/web-auth.service.ts

@@ -88,16 +88,16 @@ export class WebAuthService {
     let verification: VerifiedRegistrationResponse;
     try {
       const opts: VerifyRegistrationResponseOpts = {
+        expectedChallenge,
+        expectedOrigin: this.expectedOrigin,
+        expectedRPID: this.rpID,
         response: {
           clientExtensionResults: credential.clientExtensionResults,
           id: credential.id,
           rawId: credential.rawId,
           response: credential.response,
           type: 'public-key'
-        },
-        expectedChallenge,
-        expectedOrigin: this.expectedOrigin,
-        expectedRPID: this.rpID
+        }
       };
       verification = await verifyRegistrationResponse(opts);
     } catch (error) {
@@ -123,8 +123,8 @@ export class WebAuthService {
          */
         existingDevice = await this.deviceService.createAuthDevice({
           counter,
-          credentialPublicKey: Buffer.from(credentialPublicKey),
           credentialId: Buffer.from(credentialID),
+          credentialPublicKey: Buffer.from(credentialPublicKey),
           User: { connect: { id: user.id } }
         });
       }
@@ -187,13 +187,6 @@ export class WebAuthService {
     let verification: VerifiedAuthenticationResponse;
     try {
       const opts: VerifyAuthenticationResponseOpts = {
-        response: {
-          clientExtensionResults: credential.clientExtensionResults,
-          id: credential.id,
-          rawId: credential.rawId,
-          response: credential.response,
-          type: 'public-key'
-        },
         authenticator: {
           credentialID: device.credentialId,
           credentialPublicKey: device.credentialPublicKey,
@@ -201,7 +194,14 @@ export class WebAuthService {
         },
         expectedChallenge: `${user.authChallenge}`,
         expectedOrigin: this.expectedOrigin,
-        expectedRPID: this.rpID
+        expectedRPID: this.rpID,
+        response: {
+          clientExtensionResults: credential.clientExtensionResults,
+          id: credential.id,
+          rawId: credential.rawId,
+          response: credential.response,
+          type: 'public-key'
+        }
       };
       verification = await verifyAuthenticationResponse(opts);
     } catch (error) {

apps/client/src/app/components/user-account-settings/user-account-settings.component.ts

@@ -3,10 +3,9 @@ import {
   ChangeDetectorRef,
   Component,
   OnDestroy,
-  OnInit,
-  ViewChild
+  OnInit
 } from '@angular/core';
-import { MatCheckbox, MatCheckboxChange } from '@angular/material/checkbox';
+import { MatCheckboxChange } from '@angular/material/checkbox';
 import { DataService } from '@ghostfolio/client/services/data.service';
 import {
   STAY_SIGNED_IN,
@@ -29,14 +28,12 @@ import { catchError, takeUntil } from 'rxjs/operators';
   templateUrl: './user-account-settings.html'
 })
 export class UserAccountSettingsComponent implements OnDestroy, OnInit {
-  @ViewChild('toggleSignInWithFingerprintEnabledElement')
-  signInWithFingerprintElement: MatCheckbox;
-
   public appearancePlaceholder = $localize`Auto`;
   public baseCurrency: string;
   public currencies: string[] = [];
   public hasPermissionToUpdateViewMode: boolean;
   public hasPermissionToUpdateUserSettings: boolean;
+  public isWebAuthnEnabled: boolean;
   public language = document.documentElement.lang;
   public locales = [
     'de',
@@ -250,9 +247,8 @@ export class UserAccountSettingsComponent implements OnDestroy, OnInit {
   }
 
   private update() {
-    if (this.signInWithFingerprintElement) {
-      this.signInWithFingerprintElement.checked =
-        this.webAuthnService.isEnabled() ?? false;
-    }
+    this.isWebAuthnEnabled = this.webAuthnService.isEnabled() ?? false;
+
+    this.changeDetectorRef.markForCheck();
   }
 }

apps/client/src/app/components/user-account-settings/user-account-settings.html

@@ -154,8 +154,8 @@
         </div>
         <div class="pl-1 w-50">
           <mat-checkbox
-            #toggleSignInWithFingerprintEnabledElement
             color="primary"
+            [checked]="isWebAuthnEnabled === true"
             [disabled]="!hasPermissionToUpdateUserSettings"
             (change)="onSignInWithFingerprintChange($event)"
           ></mat-checkbox>