[AC-1479][BEEEP] Refactor ConfigService to improve observable usage (#5602)

* refactor ConfigService to use observables

* make environmentService.urls a ReplaySubject

---------

Co-authored-by: Hinton <hinton@users.noreply.github.com>

apps/browser/src/background/main.background.ts

@@ -35,7 +35,6 @@ import { UserVerificationApiService } from "@bitwarden/common/auth/services/user
 import { UserVerificationService } from "@bitwarden/common/auth/services/user-verification/user-verification.service";
 import { AppIdService as AppIdServiceAbstraction } from "@bitwarden/common/platform/abstractions/app-id.service";
 import { ConfigApiServiceAbstraction } from "@bitwarden/common/platform/abstractions/config/config-api.service.abstraction";
-import { ConfigServiceAbstraction } from "@bitwarden/common/platform/abstractions/config/config.service.abstraction";
 import { CryptoFunctionService as CryptoFunctionServiceAbstraction } from "@bitwarden/common/platform/abstractions/crypto-function.service";
 import { CryptoService as CryptoServiceAbstraction } from "@bitwarden/common/platform/abstractions/crypto.service";
 import { EncryptService } from "@bitwarden/common/platform/abstractions/encrypt.service";
@@ -53,7 +52,6 @@ import { StateFactory } from "@bitwarden/common/platform/factories/state-factory
 import { GlobalState } from "@bitwarden/common/platform/models/domain/global-state";
 import { AppIdService } from "@bitwarden/common/platform/services/app-id.service";
 import { ConfigApiService } from "@bitwarden/common/platform/services/config/config-api.service";
-import { ConfigService } from "@bitwarden/common/platform/services/config/config.service";
 import { ConsoleLogService } from "@bitwarden/common/platform/services/console-log.service";
 import { ContainerService } from "@bitwarden/common/platform/services/container.service";
 import { EncryptServiceImplementation } from "@bitwarden/common/platform/services/cryptography/encrypt.service.implementation";
@@ -123,6 +121,7 @@ import { flagEnabled } from "../platform/flags";
 import { UpdateBadge } from "../platform/listeners/update-badge";
 import BrowserPopoutWindowService from "../platform/popup/browser-popout-window.service";
 import { BrowserStateService as StateServiceAbstraction } from "../platform/services/abstractions/browser-state.service";
+import { BrowserConfigService } from "../platform/services/browser-config.service";
 import { BrowserCryptoService } from "../platform/services/browser-crypto.service";
 import { BrowserEnvironmentService } from "../platform/services/browser-environment.service";
 import { BrowserI18nService } from "../platform/services/browser-i18n.service";
@@ -200,7 +199,7 @@ export default class MainBackground {
   avatarUpdateService: AvatarUpdateServiceAbstraction;
   mainContextMenuHandler: MainContextMenuHandler;
   cipherContextMenuHandler: CipherContextMenuHandler;
-  configService: ConfigServiceAbstraction;
+  configService: BrowserConfigService;
   configApiService: ConfigApiServiceAbstraction;
   devicesApiService: DevicesApiServiceAbstraction;
   devicesService: DevicesServiceAbstraction;
@@ -533,12 +532,15 @@ export default class MainBackground {
       this.authService,
       this.messagingService
     );
+
     this.configApiService = new ConfigApiService(this.apiService, this.authService);
-    this.configService = new ConfigService(
+
+    this.configService = new BrowserConfigService(
       this.stateService,
       this.configApiService,
       this.authService,
-      this.environmentService
+      this.environmentService,
+      true
     );
     this.browserPopoutWindowService = new BrowserPopoutWindowService();
 
@@ -682,6 +684,7 @@ export default class MainBackground {
     await this.notificationBackground.init();
     await this.commandsBackground.init();
 
+    this.configService.init();
     this.twoFactorService.init();
 
     await this.tabsBackground.init();

apps/browser/src/background/runtime.background.ts

@@ -103,7 +103,7 @@ export default class RuntimeBackground {
             await this.main.refreshMenu();
           }, 2000);
           this.main.avatarUpdateService.loadColorFromState();
-          this.configService.fetchServerConfig();
+          this.configService.triggerServerConfigFetch();
         }
         break;
       case "openPopup":
@@ -139,7 +139,7 @@ export default class RuntimeBackground {
       case "triggerAutofillScriptInjection":
         await this.autofillService.injectAutofillScripts(
           sender,
-          await this.configService.getFeatureFlagBool(FeatureFlag.AutofillV2)
+          await this.configService.getFeatureFlag<boolean>(FeatureFlag.AutofillV2)
         );
         break;
       case "bgCollectPageDetails":

apps/browser/src/platform/services/browser-config.service.ts

@@ -1,6 +1,10 @@
-import { BehaviorSubject } from "rxjs";
+import { ReplaySubject } from "rxjs";
 
+import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service";
+import { ConfigApiServiceAbstraction } from "@bitwarden/common/platform/abstractions/config/config-api.service.abstraction";
 import { ServerConfig } from "@bitwarden/common/platform/abstractions/config/server-config";
+import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
+import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
 import { ConfigService } from "@bitwarden/common/platform/services/config/config.service";
 
 import { browserSession, sessionSync } from "../decorators/session-sync-observable";
@@ -8,5 +12,15 @@ import { browserSession, sessionSync } from "../decorators/session-sync-observab
 @browserSession
 export class BrowserConfigService extends ConfigService {
   @sessionSync<ServerConfig>({ initializer: ServerConfig.fromJSON })
-  protected _serverConfig: BehaviorSubject<ServerConfig | null>;
+  protected _serverConfig: ReplaySubject<ServerConfig | null>;
+
+  constructor(
+    stateService: StateService,
+    configApiService: ConfigApiServiceAbstraction,
+    authService: AuthService,
+    environmentService: EnvironmentService,
+    subscribe = false
+  ) {
+    super(stateService, configApiService, authService, environmentService, subscribe);
+  }
 }

apps/browser/src/popup/services/init.service.ts

@@ -4,6 +4,7 @@ import { AbstractThemingService } from "@bitwarden/angular/services/theming/them
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { LogService as LogServiceAbstraction } from "@bitwarden/common/platform/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
+import { ConfigService } from "@bitwarden/common/platform/services/config/config.service";
 
 import { BrowserStateService as StateServiceAbstraction } from "../../platform/services/abstractions/browser-state.service";
 
@@ -17,7 +18,8 @@ export class InitService {
     private popupUtilsService: PopupUtilsService,
     private stateService: StateServiceAbstraction,
     private logService: LogServiceAbstraction,
-    private themingService: AbstractThemingService
+    private themingService: AbstractThemingService,
+    private configService: ConfigService
   ) {}
 
   init() {
@@ -50,6 +52,8 @@ export class InitService {
         htmlEl.classList.add("force_redraw");
         this.logService.info("Force redraw is on");
       }
+
+      this.configService.init();
     };
   }
 }

apps/browser/src/popup/services/services.module.ts

@@ -36,7 +36,6 @@ import { AuthService } from "@bitwarden/common/auth/services/auth.service";
 import { LoginService } from "@bitwarden/common/auth/services/login.service";
 import { AppIdService } from "@bitwarden/common/platform/abstractions/app-id.service";
 import { ConfigApiServiceAbstraction } from "@bitwarden/common/platform/abstractions/config/config-api.service.abstraction";
-import { ConfigServiceAbstraction } from "@bitwarden/common/platform/abstractions/config/config.service.abstraction";
 import { CryptoFunctionService } from "@bitwarden/common/platform/abstractions/crypto-function.service";
 import { CryptoService } from "@bitwarden/common/platform/abstractions/crypto.service";
 import { EncryptService } from "@bitwarden/common/platform/abstractions/encrypt.service";
@@ -57,6 +56,7 @@ import {
 } from "@bitwarden/common/platform/abstractions/storage.service";
 import { StateFactory } from "@bitwarden/common/platform/factories/state-factory";
 import { GlobalState } from "@bitwarden/common/platform/models/domain/global-state";
+import { ConfigService } from "@bitwarden/common/platform/services/config/config.service";
 import { ConsoleLogService } from "@bitwarden/common/platform/services/console-log.service";
 import { ContainerService } from "@bitwarden/common/platform/services/container.service";
 import { SearchService } from "@bitwarden/common/services/search.service";
@@ -495,7 +495,7 @@ function getBgService<T>(service: keyof MainBackground) {
       deps: [StateServiceAbstraction, PlatformUtilsService],
     },
     {
-      provide: ConfigServiceAbstraction,
+      provide: ConfigService,
       useClass: BrowserConfigService,
       deps: [
         StateServiceAbstraction,

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

@@ -232,7 +232,7 @@ export class AppComponent implements OnInit, OnDestroy {
             break;
           case "syncCompleted":
             await this.updateAppMenu();
-            await this.configService.fetchServerConfig();
+            this.configService.triggerServerConfigFetch();
             break;
           case "openSettings":
             await this.openModal<SettingsComponent>(SettingsComponent, this.settingsRef);

apps/desktop/src/app/services/init.service.ts

@@ -11,6 +11,7 @@ import { EnvironmentService as EnvironmentServiceAbstraction } from "@bitwarden/
 import { I18nService as I18nServiceAbstraction } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { PlatformUtilsService as PlatformUtilsServiceAbstraction } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { StateService as StateServiceAbstraction } from "@bitwarden/common/platform/abstractions/state.service";
+import { ConfigService } from "@bitwarden/common/platform/services/config/config.service";
 import { ContainerService } from "@bitwarden/common/platform/services/container.service";
 import { EventUploadService } from "@bitwarden/common/services/event/event-upload.service";
 import { VaultTimeoutService } from "@bitwarden/common/services/vault-timeout/vault-timeout.service";
@@ -35,7 +36,8 @@ export class InitService {
     private cryptoService: CryptoServiceAbstraction,
     private nativeMessagingService: NativeMessagingService,
     private themingService: AbstractThemingService,
-    private encryptService: EncryptService
+    private encryptService: EncryptService,
+    private configService: ConfigService
   ) {}
 
   init() {
@@ -71,6 +73,8 @@ export class InitService {
 
       const containerService = new ContainerService(this.cryptoService, this.encryptService);
       containerService.attachToGlobal(this.win);
+
+      this.configService.init();
     };
   }
 }

apps/web/src/app/app.component.ts

@@ -138,7 +138,7 @@ export class AppComponent implements OnDestroy, OnInit {
           case "syncStarted":
             break;
           case "syncCompleted":
-            await this.configService.fetchServerConfig();
+            this.configService.triggerServerConfigFetch();
             break;
           case "upgradeOrganization": {
             const upgradeConfirmed = await this.dialogService.openSimpleDialog({

apps/web/src/app/billing/organizations/organization-subscription-cloud.component.ts

@@ -135,7 +135,7 @@ export class OrganizationSubscriptionCloudComponent implements OnInit, OnDestroy
     this.loading = false;
 
     // Remove the remaining lines when the sm-ga-billing flag is deleted
-    const smBillingEnabled = await this.configService.getFeatureFlagBool(
+    const smBillingEnabled = await this.configService.getFeatureFlag<boolean>(
       FeatureFlag.SecretsManagerBilling
     );
     this.showSecretsManagerSubscribe = this.showSecretsManagerSubscribe && smBillingEnabled;

apps/web/src/app/billing/settings/add-credit.component.ts

@@ -7,6 +7,7 @@ import {
   Output,
   ViewChild,
 } from "@angular/core";
+import { firstValueFrom } from "rxjs";
 
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { OrganizationService } from "@bitwarden/common/admin-console/abstractions/organization/organization.service.abstraction";
@@ -79,7 +80,7 @@ export class AddCreditComponent implements OnInit {
       this.email = this.subject;
       this.ppButtonCustomField = "user_id:" + this.userId;
     }
-    this.region = await this.configService.getCloudRegion();
+    this.region = await firstValueFrom(this.configService.cloudRegion$);
     this.ppButtonCustomField += ",account_credit:1";
     this.ppButtonCustomField += `,region:${this.region}`;
     this.returnUrl = window.location.href;

apps/web/src/app/billing/settings/organization-plans.component.ts

@@ -169,7 +169,7 @@ export class OrganizationPlansComponent implements OnInit, OnDestroy {
         this.singleOrgPolicyAppliesToActiveUser = policyAppliesToActiveUser;
       });
 
-    this.showSecretsManagerSubscribe = await this.configService.getFeatureFlagBool(
+    this.showSecretsManagerSubscribe = await this.configService.getFeatureFlag<boolean>(
       FeatureFlag.SecretsManagerBilling,
       false
     );

apps/web/src/app/components/environment-selector/environment-selector.component.ts

@@ -25,7 +25,7 @@ export class EnvironmentSelectorComponent implements OnInit {
   routeAndParams: string;
 
   async ngOnInit() {
-    this.euServerFlagEnabled = await this.configService.getFeatureFlagBool(
+    this.euServerFlagEnabled = await this.configService.getFeatureFlag<boolean>(
       FeatureFlag.DisplayEuEnvironmentFlag
     );
     const domain = Utils.getDomain(window.location.href);

apps/web/src/app/core/init.service.ts

@@ -13,6 +13,7 @@ import {
 } from "@bitwarden/common/platform/abstractions/environment.service";
 import { I18nService as I18nServiceAbstraction } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { StateService as StateServiceAbstraction } from "@bitwarden/common/platform/abstractions/state.service";
+import { ConfigService } from "@bitwarden/common/platform/services/config/config.service";
 import { ContainerService } from "@bitwarden/common/platform/services/container.service";
 import { EventUploadService } from "@bitwarden/common/services/event/event-upload.service";
 import { VaultTimeoutService } from "@bitwarden/common/services/vault-timeout/vault-timeout.service";
@@ -32,7 +33,8 @@ export class InitService {
     private stateService: StateServiceAbstraction,
     private cryptoService: CryptoServiceAbstraction,
     private themingService: AbstractThemingService,
-    private encryptService: EncryptService
+    private encryptService: EncryptService,
+    private configService: ConfigService
   ) {}
 
   init() {
@@ -57,6 +59,8 @@ export class InitService {
       await this.themingService.monitorThemeChanges();
       const containerService = new ContainerService(this.cryptoService, this.encryptService);
       containerService.attachToGlobal(this.win);
+
+      this.configService.init();
     };
   }
 }