[PM-1019] Environment selection clients (#5480)

* [PM-169][PM-142][PM-191] Add Environments to Web and Desktop (#5294) * [PM-1351] Add property to server-config.response. Change config to be able to fetch without being authed. * [PM-1351] fetch every hour. * [PM-1351] fetch on vault sync. * [PM-1351] browser desktop fetch configs on sync complete. * [PM-1351] Add methods to retrieve feature flags * [PM-1351] Add enum to use as key to get values feature flag values * [PM-1351] Remove debug code * [PM-1351] Get flags when unauthed. Add enums as params. Hourly always fetch. * [PM-1351] add check for authed user using auth service * [PM-169] Web: add drop down to select environment * [PM-169] Fix pop up menu margins. Add DisplayEuEnvironmentFlag. * [PM-169] Change menu name. * [PM-169] Add environment selector ts and html. Add declaration and import on login.module * [PM-169] Add environment selector to desktop. * [PM-169] Ignore lint error. * [PM-169] add takeUntil to subscribes * [PM-191] PR Fixes, code format * [PM-168] Add Environments to extension login/registration (#5434)
2025-12-18 17:23:37 +00:00 · 2023-05-19 17:35:42 +01:00
parent 6383d6ff8a
commit b9fe78796a
28 changed files with 463 additions and 42 deletions
--- a/libs/angular/src/auth/components/environment-selector.component.ts
+++ b/libs/angular/src/auth/components/environment-selector.component.ts
@@ -0,0 +1,103 @@
+import { animate, state, style, transition, trigger } from "@angular/animations";
+import { ConnectedPosition } from "@angular/cdk/overlay";
+import { Component, EventEmitter, OnDestroy, OnInit, Output } from "@angular/core";
+import { Router } from "@angular/router";
+import { Subject } from "rxjs";
+
+import { ConfigServiceAbstraction } from "@bitwarden/common/abstractions/config/config.service.abstraction";
+import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
+import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
+
+@Component({
+  selector: "environment-selector",
+  templateUrl: "environment-selector.component.html",
+  animations: [
+    trigger("transformPanel", [
+      state(
+        "void",
+        style({
+          opacity: 0,
+        })
+      ),
+      transition(
+        "void => open",
+        animate(
+          "100ms linear",
+          style({
+            opacity: 1,
+          })
+        )
+      ),
+      transition("* => void", animate("100ms linear", style({ opacity: 0 }))),
+    ]),
+  ],
+})
+export class EnvironmentSelectorComponent implements OnInit, OnDestroy {
+  @Output() onOpenSelfHostedSettings = new EventEmitter();
+  isOpen = false;
+  showingModal = false;
+  selectedEnvironment: ServerEnvironment;
+  ServerEnvironmentType = ServerEnvironment;
+  euServerFlagEnabled: boolean;
+  overlayPostition: ConnectedPosition[] = [
+    {
+      originX: "start",
+      originY: "bottom",
+      overlayX: "start",
+      overlayY: "top",
+    },
+  ];
+  protected componentDestroyed$: Subject<void> = new Subject();
+
+  constructor(
+    protected environmentService: EnvironmentService,
+    protected configService: ConfigServiceAbstraction,
+    protected router: Router
+  ) {}
+
+  async ngOnInit() {
+    this.euServerFlagEnabled = await this.configService.getFeatureFlagBool(
+      FeatureFlag.DisplayEuEnvironmentFlag
+    );
+    this.updateEnvironmentInfo();
+  }
+
+  ngOnDestroy(): void {
+    this.componentDestroyed$.next();
+    this.componentDestroyed$.complete();
+  }
+
+  async toggle(option: ServerEnvironment) {
+    this.isOpen = !this.isOpen;
+    if (option === ServerEnvironment.EU) {
+      await this.environmentService.setUrls({ base: "https://vault.bitwarden.eu" });
+    } else if (option === ServerEnvironment.US) {
+      await this.environmentService.setUrls({ base: "https://vault.bitwarden.com" });
+    } else if (option === ServerEnvironment.SelfHosted) {
+      this.onOpenSelfHostedSettings.emit();
+    }
+    this.updateEnvironmentInfo();
+  }
+
+  updateEnvironmentInfo() {
+    const webvaultUrl = this.environmentService.getWebVaultUrl();
+    if (this.environmentService.isSelfHosted()) {
+      this.selectedEnvironment = ServerEnvironment.SelfHosted;
+    } else if (webvaultUrl != null && webvaultUrl.includes("bitwarden.eu")) {
+      this.selectedEnvironment = ServerEnvironment.EU;
+    } else {
+      this.selectedEnvironment = ServerEnvironment.US;
+    }
+  }
+
+  close() {
+    this.isOpen = false;
+    this.updateEnvironmentInfo();
+  }
+}
+
+enum ServerEnvironment {
+  US = "US",
+  EU = "EU",
+  SelfHosted = "Self-hosted",
+}