[PM-12036] Removing ActiveUserState from vault-onboarding.service.ts (#12898)

* Removing ActiveUserState from vault-onboarding.service.ts

* changes

* trying to fix tests

* test fixes

* test fixes

* fixing tests

* fxies

* fixes

* Update apps/web/src/app/vault/individual-vault/vault-onboarding/vault-onboarding.component.spec.ts

Co-authored-by: SmithThe4th <gsmith@bitwarden.com>

* suggested changes

* suggested changes

* undoing suggested changes

* fixing issue

* lint fix

* lint fix

---------

Co-authored-by: --global <>
Co-authored-by: SmithThe4th <gsmith@bitwarden.com>

apps/web/src/app/vault/individual-vault/vault-onboarding/services/abstraction/vault-onboarding.service.ts

@@ -1,10 +1,10 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { Observable } from "rxjs";
 
+import { UserId } from "@bitwarden/common/types/guid";
+
 import { VaultOnboardingTasks } from "../vault-onboarding.service";
 
 export abstract class VaultOnboardingService {
-  vaultOnboardingState$: Observable<VaultOnboardingTasks>;
-  abstract setVaultOnboardingTasks(newState: VaultOnboardingTasks): Promise<void>;
+  abstract setVaultOnboardingTasks(userId: UserId, newState: VaultOnboardingTasks): Promise<void>;
+  abstract vaultOnboardingState$(userId: UserId): Observable<VaultOnboardingTasks | null>;
 }

apps/web/src/app/vault/individual-vault/vault-onboarding/services/vault-onboarding.service.ts

@@ -1,14 +1,13 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { Injectable } from "@angular/core";
 import { Observable } from "rxjs";
 
 import {
-  ActiveUserState,
+  SingleUserState,
   StateProvider,
   UserKeyDefinition,
   VAULT_ONBOARDING,
 } from "@bitwarden/common/platform/state";
+import { UserId } from "@bitwarden/common/types/guid";
 
 import { VaultOnboardingService as VaultOnboardingServiceAbstraction } from "./abstraction/vault-onboarding.service";
 
@@ -26,20 +25,20 @@ const VAULT_ONBOARDING_KEY = new UserKeyDefinition<VaultOnboardingTasks>(
     clearOn: [], // do not clear tutorials
   },
 );
-
 @Injectable()
 export class VaultOnboardingService implements VaultOnboardingServiceAbstraction {
-  private vaultOnboardingState: ActiveUserState<VaultOnboardingTasks>;
-  vaultOnboardingState$: Observable<VaultOnboardingTasks>;
+  constructor(private stateProvider: StateProvider) {}
 
-  constructor(private stateProvider: StateProvider) {
-    this.vaultOnboardingState = this.stateProvider.getActive(VAULT_ONBOARDING_KEY);
-    this.vaultOnboardingState$ = this.vaultOnboardingState.state$;
+  private vaultOnboardingState(userId: UserId): SingleUserState<VaultOnboardingTasks> {
+    return this.stateProvider.getUser(userId, VAULT_ONBOARDING_KEY);
   }
 
-  async setVaultOnboardingTasks(newState: VaultOnboardingTasks): Promise<void> {
-    await this.vaultOnboardingState.update(() => {
-      return { ...newState };
-    });
+  vaultOnboardingState$(userId: UserId): Observable<VaultOnboardingTasks | null> {
+    return this.vaultOnboardingState(userId).state$;
+  }
+
+  async setVaultOnboardingTasks(userId: UserId, newState: VaultOnboardingTasks): Promise<void> {
+    const state = this.vaultOnboardingState(userId);
+    await state.update(() => ({ ...newState }));
   }
 }

apps/web/src/app/vault/individual-vault/vault-onboarding/vault-onboarding.component.spec.ts

@@ -7,9 +7,14 @@ import { Subject, of } from "rxjs";
 
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
+import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
+import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
+import { Utils } from "@bitwarden/common/platform/misc/utils";
 import { StateProvider } from "@bitwarden/common/platform/state";
+import { FakeAccountService, mockAccountServiceWith } from "@bitwarden/common/spec";
+import { UserId } from "@bitwarden/common/types/guid";
 import { CipherType } from "@bitwarden/common/vault/enums/cipher-type";
 import { VaultOnboardingMessages } from "@bitwarden/common/vault/enums/vault-onboarding.enum";
 
@@ -24,9 +29,11 @@ describe("VaultOnboardingComponent", () => {
   let mockPolicyService: MockProxy<PolicyService>;
   let mockI18nService: MockProxy<I18nService>;
   let mockVaultOnboardingService: MockProxy<VaultOnboardingServiceAbstraction>;
-  let mockStateProvider: Partial<StateProvider>;
   let setInstallExtLinkSpy: any;
   let individualVaultPolicyCheckSpy: any;
+  let mockConfigService: MockProxy<ConfigService>;
+  const mockAccountService: FakeAccountService = mockAccountServiceWith(Utils.newGuid() as UserId);
+  let mockStateProvider: Partial<StateProvider>;
 
   beforeEach(() => {
     mockPolicyService = mock<PolicyService>();
@@ -36,6 +43,7 @@ describe("VaultOnboardingComponent", () => {
       getProfile: jest.fn(),
     };
     mockVaultOnboardingService = mock<VaultOnboardingServiceAbstraction>();
+    mockConfigService = mock<ConfigService>();
     mockStateProvider = {
       getActive: jest.fn().mockReturnValue(
         of({
@@ -56,6 +64,8 @@ describe("VaultOnboardingComponent", () => {
         { provide: VaultOnboardingServiceAbstraction, useValue: mockVaultOnboardingService },
         { provide: I18nService, useValue: mockI18nService },
         { provide: ApiService, useValue: mockApiService },
+        { provide: ConfigService, useValue: mockConfigService },
+        { provide: AccountService, useValue: mockAccountService },
         { provide: StateProvider, useValue: mockStateProvider },
       ],
     }).compileComponents();
@@ -67,12 +77,16 @@ describe("VaultOnboardingComponent", () => {
       .mockReturnValue(undefined);
     jest.spyOn(component, "checkCreationDate").mockReturnValue(null);
     jest.spyOn(window, "postMessage").mockImplementation(jest.fn());
-    (component as any).vaultOnboardingService.vaultOnboardingState$ = of({
+    (component as any).vaultOnboardingService.vaultOnboardingState$ = jest
+      .fn()
+      .mockImplementation(() => {
+        return of({
           createAccount: true,
           importData: false,
           installExtension: false,
         });
       });
+  });
 
   it("should create", () => {
     expect(component).toBeTruthy();
@@ -165,12 +179,15 @@ describe("VaultOnboardingComponent", () => {
         .spyOn((component as any).vaultOnboardingService, "setVaultOnboardingTasks")
         .mockReturnValue(Promise.resolve());
 
-      (component as any).vaultOnboardingService.vaultOnboardingState$ = of({
+      (component as any).vaultOnboardingService.vaultOnboardingState$ = jest
+        .fn()
+        .mockImplementation(() => {
+          return of({
             createAccount: true,
             importData: false,
             installExtension: false,
           });
-
+        });
       const eventData = { data: { command: VaultOnboardingMessages.HasBwInstalled } };
 
       (component as any).showOnboarding = true;

apps/web/src/app/vault/individual-vault/vault-onboarding/vault-onboarding.component.ts

@@ -18,7 +18,11 @@ import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
 import { PolicyType } from "@bitwarden/common/admin-console/enums";
 import { Organization } from "@bitwarden/common/admin-console/models/domain/organization";
+import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
+import { getUserId } from "@bitwarden/common/auth/services/account.service";
+import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
+import { UserId } from "@bitwarden/common/types/guid";
 import { CipherType } from "@bitwarden/common/vault/enums/cipher-type";
 import { VaultOnboardingMessages } from "@bitwarden/common/vault/enums/vault-onboarding.enum";
 import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
@@ -57,15 +61,20 @@ export class VaultOnboardingComponent implements OnInit, OnChanges, OnDestroy {
   protected onboardingTasks$: Observable<VaultOnboardingTasks>;
   protected showOnboarding = false;
 
+  private activeId: UserId;
   constructor(
     protected platformUtilsService: PlatformUtilsService,
     protected policyService: PolicyService,
     private apiService: ApiService,
     private vaultOnboardingService: VaultOnboardingServiceAbstraction,
+    private configService: ConfigService,
+    private accountService: AccountService,
   ) {}
 
   async ngOnInit() {
-    this.onboardingTasks$ = this.vaultOnboardingService.vaultOnboardingState$;
+    this.activeId = await firstValueFrom(getUserId(this.accountService.activeAccount$));
+    this.onboardingTasks$ = this.vaultOnboardingService.vaultOnboardingState$(this.activeId);
+
     await this.setOnboardingTasks();
     this.setInstallExtLink();
     this.individualVaultPolicyCheck();
@@ -80,7 +89,7 @@ export class VaultOnboardingComponent implements OnInit, OnChanges, OnDestroy {
         importData: this.ciphers.length > 0,
         installExtension: currentTasks.installExtension,
       };
-      await this.vaultOnboardingService.setVaultOnboardingTasks(updatedTasks);
+      await this.vaultOnboardingService.setVaultOnboardingTasks(this.activeId, updatedTasks);
     }
   }
 
@@ -109,7 +118,7 @@ export class VaultOnboardingComponent implements OnInit, OnChanges, OnDestroy {
         importData: currentTasks.importData,
         installExtension: true,
       };
-      await this.vaultOnboardingService.setVaultOnboardingTasks(updatedTasks);
+      await this.vaultOnboardingService.setVaultOnboardingTasks(this.activeId, updatedTasks);
     }
   }
 
@@ -152,7 +161,7 @@ export class VaultOnboardingComponent implements OnInit, OnChanges, OnDestroy {
 
   private async saveCompletedTasks(vaultTasks: VaultOnboardingTasks) {
     this.showOnboarding = Object.values(vaultTasks).includes(false);
-    await this.vaultOnboardingService.setVaultOnboardingTasks(vaultTasks);
+    await this.vaultOnboardingService.setVaultOnboardingTasks(this.activeId, vaultTasks);
   }
 
   individualVaultPolicyCheck() {