[PS-74] Fix user authentication state checks (#1464)

* Use new authStatus method, clean up account switcher

* Update naming

* update jslib

jslib

@@ -1 +1 @@
-Subproject commit d7e554653a7e593f8cdaf7e2fe926eb04fb5d5c5
+Subproject commit 2e2849b4def0534f3f72b7a84c3183ab0b1589f2

src/app/app.component.ts

@@ -35,6 +35,7 @@ import { SyncService } from "jslib-common/abstractions/sync.service";
 import { SystemService } from "jslib-common/abstractions/system.service";
 import { TokenService } from "jslib-common/abstractions/token.service";
 import { VaultTimeoutService } from "jslib-common/abstractions/vaultTimeout.service";
+import { AuthenticationStatus } from "jslib-common/enums/authenticationStatus";
 import { CipherType } from "jslib-common/enums/cipherType";
 
 import { MenuUpdateRequest } from "../main/menu/menu.updater";
@@ -330,7 +331,9 @@ export class AppComponent implements OnInit {
             if (message.userId != null) {
               await this.stateService.setActiveUser(message.userId);
             }
-            const locked = await this.vaultTimeoutService.isLocked(message.userId);
+            const locked =
+              (await this.authService.getAuthStatus(message.userId)) ===
+              AuthenticationStatus.Locked;
             if (locked) {
               this.messagingService.send("locked", { userId: message.userId });
             } else {
@@ -436,7 +439,8 @@ export class AppComponent implements OnInit {
             isAuthenticated: await this.stateService.getIsAuthenticated({
               userId: userId,
             }),
-            isLocked: await this.vaultTimeoutService.isLocked(userId),
+            isLocked:
+              (await this.authService.getAuthStatus(userId)) === AuthenticationStatus.Locked,
             email: stateAccounts[i].profile.email,
             userId: stateAccounts[i].profile.userId,
           };
@@ -591,7 +595,7 @@ export class AppComponent implements OnInit {
       const keys = Object.keys(accounts);
       if (keys.length > 0) {
         for (const userId of keys) {
-          if (!(await this.vaultTimeoutService.isLocked(userId))) {
+          if ((await this.authService.getAuthStatus(userId)) === AuthenticationStatus.Unlocked) {
             return;
           }
         }

src/app/layout/account-switcher.component.html

@@ -53,7 +53,6 @@
       <button
         *ngFor="let a of accounts | keyvalue"
         class="account"
-        [ngClass]="{ active: a.value.profile.authenticationStatus == 'active' }"
         (click)="switch(a.key)"
         appA11yTitle="{{ 'loggedInAsOn' | i18n: a.value.profile.email:a.value.serverUrl }}"
         attr.aria-label="{{ 'switchAccount' | i18n }}"
@@ -72,17 +71,17 @@
           <span class="server" aria-hidden="true" *ngIf="a.value.serverUrl != 'bitwarden.com'">{{
             a.value.serverUrl
           }}</span>
-          <span class="status" aria-hidden="true">{{ a.value.profile.authenticationStatus }}</span>
+          <span class="status" aria-hidden="true">{{
+            (a.value.profile.authenticationStatus === authStatus.Unlocked ? "unlocked" : "locked")
+              | i18n
+          }}</span>
         </div>
         <i
-          class="bwi bwi-unlock bwi-2x text-muted"
-          aria-hidden="true"
-          *ngIf="a.value.profile.authenticationStatus == 'unlocked'"
-        ></i>
-        <i
-          class="bwi bwi-lock bwi-2x text-muted"
+          class="bwi bwi-2x text-muted"
+          [ngClass]="
+            a.value.profile.authenticationStatus == authStatus.Unlocked ? 'bwi-unlock' : 'bwi-lock'
+          "
           aria-hidden="true"
-          *ngIf="a.value.profile.authenticationStatus == 'locked'"
         ></i>
       </button>
     </div>

src/app/layout/account-switcher.component.ts

@@ -2,9 +2,9 @@ import { animate, state, style, transition, trigger } from "@angular/animations"
 import { ConnectedPosition } from "@angular/cdk/overlay";
 import { Component, OnInit } from "@angular/core";
 
+import { AuthService } from "jslib-common/abstractions/auth.service";
 import { MessagingService } from "jslib-common/abstractions/messaging.service";
 import { StateService } from "jslib-common/abstractions/state.service";
-import { VaultTimeoutService } from "jslib-common/abstractions/vaultTimeout.service";
 import { AuthenticationStatus } from "jslib-common/enums/authenticationStatus";
 import { Utils } from "jslib-common/misc/utils";
 import { Account } from "jslib-common/models/domain/account";
@@ -53,6 +53,7 @@ export class AccountSwitcherComponent implements OnInit {
   accounts: { [userId: string]: SwitcherAccount } = {};
   activeAccountEmail: string;
   serverUrl: string;
+  authStatus = AuthenticationStatus;
   overlayPostition: ConnectedPosition[] = [
     {
       originX: "end",
@@ -78,22 +79,16 @@ export class AccountSwitcherComponent implements OnInit {
 
   constructor(
     private stateService: StateService,
-    private vaultTimeoutService: VaultTimeoutService,
+    private authService: AuthService,
     private messagingService: MessagingService
   ) {}
 
   async ngOnInit(): Promise<void> {
-    this.stateService.accounts.subscribe(async (accounts) => {
+    this.stateService.accounts.subscribe(async (accounts: { [userId: string]: Account }) => {
       for (const userId in accounts) {
-        if (userId === (await this.stateService.getUserId())) {
-          accounts[userId].profile.authenticationStatus = AuthenticationStatus.Active;
-        } else {
-          accounts[userId].profile.authenticationStatus = (await this.vaultTimeoutService.isLocked(
-            userId
-          ))
-            ? AuthenticationStatus.Locked
-            : AuthenticationStatus.Unlocked;
-        }
+        accounts[userId].profile.authenticationStatus = await this.authService.getAuthStatus(
+          userId
+        );
       }
 
       this.accounts = await this.createSwitcherAccounts(accounts);

src/locales/en/messages.json

@@ -1853,6 +1853,12 @@
       }
     }
   },
+  "locked": {
+    "message": "Locked"
+  },
+  "unlocked": {
+    "message": "Unlocked"
+  },
   "generator": {
     "message": "Generator"
   },