[PS-683] Fix missed defaults and sentence cases (#3095)

* chore: remove superfluous default

* fix: translations

* feat: dont update auto biometric but hide the option

* feat: hide auto biometrics if biometrics are disabled

* refactor: make updateBiometric easier to read and add bug note

* chore: add comment about bug getting resolved

* refactor: merge two if-cases

apps/browser/src/popup/settings/settings.component.html

@@ -59,7 +59,11 @@
           [(ngModel)]="biometric"
         />
       </div>
-      <div class="box-content-row box-content-row-checkbox" appBoxRow *ngIf="supportsBiometric">
+      <div
+        class="box-content-row box-content-row-checkbox"
+        appBoxRow
+        *ngIf="supportsBiometric && biometric"
+      >
         <label for="autoBiometricsPrompt">{{ "enableAutoBiometricsPrompt" | i18n }}</label>
         <input
           id="autoBiometricsPrompt"

apps/browser/src/popup/settings/settings.component.ts

@@ -114,9 +114,7 @@ export class SettingsComponent implements OnInit {
 
     this.supportsBiometric = await this.platformUtilsService.supportsBiometric();
     this.biometric = await this.vaultTimeoutService.isBiometricLockSet();
-    const disableAutoBiometricsPrompt =
+    this.enableAutoBiometricsPrompt = !(await this.stateService.getDisableAutoBiometricsPrompt());
-      (await this.stateService.getDisableAutoBiometricsPrompt()) ?? true;
-    this.enableAutoBiometricsPrompt = !disableAutoBiometricsPrompt;
     this.showChangeMasterPass = !(await this.keyConnectorService.getUsesKeyConnector());
   }
 

apps/desktop/src/app/accounts/settings.component.html

@@ -87,14 +87,14 @@
                       id="biometric"
                       type="checkbox"
                       name="biometric"
-                      [checked]="biometric"
+                      [ngModel]="biometric"
-                      (change)="updateBiometric()"
+                      (ngModelChange)="updateBiometric($event)"
                     />
                     {{ biometricText | i18n }}
                   </label>
                 </div>
               </div>
-              <div class="form-group" *ngIf="supportsBiometric">
+              <div class="form-group" *ngIf="supportsBiometric && biometric">
                 <div class="checkbox">
                   <label for="autoPromptBiometrics">
                     <input
@@ -102,7 +102,6 @@
                       type="checkbox"
                       name="autoPromptBiometrics"
                       [(ngModel)]="autoPromptBiometrics"
-                      [disabled]="!biometric"
                       (change)="updateAutoPromptBiometrics()"
                     />
                     {{ autoPromptBiometricsText | i18n }}

apps/desktop/src/app/accounts/settings.component.ts

@@ -265,32 +265,34 @@ export class SettingsComponent implements OnInit {
     }
   }
 
-  async updateBiometric() {
+  async updateBiometric(newValue: boolean) {
-    const current = this.biometric;
+    // NOTE: A bug in angular causes [ngModel] to not reflect the backing field value
-    if (this.biometric) {
+    // causing the checkbox to remain checked even if authentication fails.
+    // The bug should resolve itself once the angular issue is resolved.
+    // See: https://github.com/angular/angular/issues/13063
+
+    if (!newValue || !this.supportsBiometric) {
       this.biometric = false;
-    } else if (this.supportsBiometric) {
+      await this.stateService.setBiometricUnlock(null);
-      this.biometric = await this.platformUtilsService.authenticateBiometric();
+      await this.stateService.setBiometricLocked(false);
-    }
+      await this.cryptoService.toggleKey();
-    if (this.biometric === current) {
       return;
     }
-    if (this.biometric) {
+
-      await this.stateService.setBiometricUnlock(true);
+    const authResult = await this.platformUtilsService.authenticateBiometric();
-    } else {
+
-      await this.stateService.setBiometricUnlock(null);
+    if (!authResult) {
-      await this.stateService.setNoAutoPromptBiometrics(null);
+      this.biometric = false;
-      this.autoPromptBiometrics = false;
+      return;
     }
+
+    this.biometric = true;
+    await this.stateService.setBiometricUnlock(true);
     await this.stateService.setBiometricLocked(false);
     await this.cryptoService.toggleKey();
   }
 
   async updateAutoPromptBiometrics() {
-    if (!this.biometric) {
-      this.autoPromptBiometrics = false;
-    }
-
     if (this.autoPromptBiometrics) {
       await this.stateService.setNoAutoPromptBiometrics(null);
     } else {

apps/desktop/src/locales/en/messages.json

@@ -934,7 +934,7 @@
     "message": "Always show an icon in the system tray."
   },
   "startToTray": {
-    "message": "Start To tray icon"
+    "message": "Start to tray icon"
   },
   "startToTrayDesc": {
     "message": "When the application is first started, only show an icon in the system tray."
@@ -1553,7 +1553,7 @@
     "message": "Allow browser integration"
   },
   "enableBrowserIntegrationDesc": {
-    "message": "Browser integration is used for biometrics in browser."
+    "message": "Used for biometrics in browser."
   },
   "browserIntegrationUnsupportedTitle": {
     "message": "Browser integration not supported"