From dad6fedebd84316c2eba2642bbeef3863a5831b9 Mon Sep 17 00:00:00 2001
From: rr-bw <102181210+rr-bw@users.noreply.github.com>
Date: Fri, 4 Aug 2023 14:28:55 -0700
Subject: [PATCH] [PM-3294][PM-3293] Update Region Selector Domains (#5949)

* update desktop domains

* update web domains

* remove old translations from desktop

* update translations on browser

* change 'Region' to 'Server' on web

* change labels

* remove 'region' translation

* adjust alignmend so 'Self-hosted' label lines up with others

* adjust width and layout of trial-initiation header to accomodate longer text
---
 apps/browser/src/_locales/en/messages.json     | 14 ++++++--------
 apps/desktop/src/locales/en/messages.json      | 14 ++++++--------
 .../trial-initiation.component.html            |  4 ++--
 .../environment-selector.component.html        | 14 +++++++-------
 apps/web/src/locales/en/messages.json          | 13 ++++---------
 .../environment-selector.component.html        | 18 +++++++++++-------
 6 files changed, 36 insertions(+), 41 deletions(-)

diff --git a/apps/browser/src/_locales/en/messages.json b/apps/browser/src/_locales/en/messages.json
index 9e46b55f19e..b5d5afb27c4 100644
--- a/apps/browser/src/_locales/en/messages.json
+++ b/apps/browser/src/_locales/en/messages.json
@@ -2221,19 +2221,17 @@
       }
     }
   },
-  "region": {
-    "message": "Region"
+  "loggingInOn": {
+    "message": "Logging in on"
   },
   "opensInANewWindow": {
     "message": "Opens in a new window"
   },
-  "eu": {
-    "message": "EU",
-    "description": "European Union"
+  "usDomain": {
+    "message": "bitwarden.com"
   },
-  "us": {
-    "message": "US",
-    "description": "United States"
+  "euDomain": {
+    "message": "bitwarden.eu"
   },
   "accessDenied": {
     "message": "Access denied. You do not have permission to view this page."
diff --git a/apps/desktop/src/locales/en/messages.json b/apps/desktop/src/locales/en/messages.json
index 9debdbc13fe..57ba39d673a 100644
--- a/apps/desktop/src/locales/en/messages.json
+++ b/apps/desktop/src/locales/en/messages.json
@@ -2252,16 +2252,14 @@
   "windowsBiometricUpdateWarningTitle": {
     "message": "Recommended Settings Update"
   },
-  "region": {
-    "message": "Region"
+  "loggingInOn": {
+    "message": "Logging in on"
   },
-  "eu": {
-    "message": "EU",
-    "description": "European Union"
+  "usDomain": {
+    "message": "bitwarden.com"
   },
-  "us": {
-    "message": "US",
-    "description": "United States"
+  "euDomain": {
+    "message": "bitwarden.eu"
   },
   "selfHosted": {
     "message": "Self-hosted"
diff --git a/apps/web/src/app/auth/trial-initiation/trial-initiation.component.html b/apps/web/src/app/auth/trial-initiation/trial-initiation.component.html
index 70cb1b702c4..b8127d00c1c 100644
--- a/apps/web/src/app/auth/trial-initiation/trial-initiation.component.html
+++ b/apps/web/src/app/auth/trial-initiation/trial-initiation.component.html
@@ -58,13 +58,13 @@
       </div>
       <div class="tw-pt-44" *ngIf="useTrialStepper">
         <div class="tw-rounded tw-border tw-border-solid tw-border-secondary-300 tw-bg-background">
-          <div class="tw-flex tw-h-auto tw-w-full tw-rounded-t tw-bg-secondary-100">
+          <div class="tw-flex tw-h-auto tw-w-full tw-gap-5 tw-rounded-t tw-bg-secondary-100">
             <h2 class="tw-pb-4 tw-pl-4 tw-pt-5 tw-text-base tw-font-bold tw-uppercase">
               {{ "startYour7DayFreeTrialOfBitwardenFor" | i18n : org }}
             </h2>
             <environment-selector
               [hasFlags]="true"
-              class="tw-mr-4 tw-mt-6 tw-text-end"
+              class="tw-mr-4 tw-mt-6 tw-flex-shrink-0 tw-text-end"
             ></environment-selector>
           </div>
           <app-vertical-stepper #stepper linear (selectionChange)="stepSelectionChange($event)">
diff --git a/apps/web/src/app/components/environment-selector/environment-selector.component.html b/apps/web/src/app/components/environment-selector/environment-selector.component.html
index b7465a7ede8..9fb954f008d 100644
--- a/apps/web/src/app/components/environment-selector/environment-selector.component.html
+++ b/apps/web/src/app/components/environment-selector/environment-selector.component.html
@@ -11,7 +11,7 @@
         [style.visibility]="isUsServer ? 'visible' : 'hidden'"
       ></i>
       <img src="../../images/us_flag.png" alt="{{ 'usFlag' | i18n }}" class="pb-1 mr-1" />
-      {{ "us" | i18n }}
+      {{ "usDomain" | i18n }}
     </a>
     <a
       bitMenuItem
@@ -25,11 +25,11 @@
         [style.visibility]="isEuServer ? 'visible' : 'hidden'"
       ></i>
       <img src="../../images/eu_flag.png" alt="{{ 'euFlag' | i18n }}" class="pb-1 mr-1" />
-      {{ "eu" | i18n }}
+      {{ "euDomain" | i18n }}
     </a>
   </bit-menu>
-  <span *ngIf="hasFlags" class="!tw-inline-block !tw-w-52 !tw-min-w-52">
-    <label>{{ "region" | i18n }}:</label>
+  <span *ngIf="hasFlags" class="!tw-inline-block !tw-min-w-52">
+    <label>{{ "server" | i18n }}:</label>
     <a
       [routerLink]="[]"
       [bitMenuTriggerFor]="environmentOptions"
@@ -40,15 +40,15 @@
         alt="{{ 'selectedRegionFlag' | i18n }}"
         class="pb-1 mr-1 tw-ml-1"
       /><label class="tw-cursor-pointer !tw-font-normal"
-        >{{ isEuServer ? ("eu" | i18n) : ("us" | i18n) }}
+        >{{ isEuServer ? ("euDomain" | i18n) : ("usDomain" | i18n) }}
         <i class="bwi bwi-fw bwi-sm bwi-angle-down" aria-hidden="true"></i
       ></label>
     </a>
   </span>
   <div *ngIf="!hasFlags">
-    {{ "region" | i18n }}:
+    {{ "server" | i18n }}:
     <a [routerLink]="[]" [bitMenuTriggerFor]="environmentOptions">
-      <b>{{ isEuServer ? ("eu" | i18n) : ("us" | i18n) }}</b
+      <b>{{ isEuServer ? ("euDomain" | i18n) : ("usDomain" | i18n) }}</b
       ><i class="bwi bwi-fw bwi-sm bwi-angle-down" aria-hidden="true"></i>
     </a>
   </div>
diff --git a/apps/web/src/locales/en/messages.json b/apps/web/src/locales/en/messages.json
index c8621e34792..b99fa97ba28 100644
--- a/apps/web/src/locales/en/messages.json
+++ b/apps/web/src/locales/en/messages.json
@@ -6811,16 +6811,11 @@
   "enforceOnLoginDesc": {
     "message": "Require existing members to change their passwords"
   },
-  "region": {
-    "message": "Region"
+  "usDomain": {
+    "message": "bitwarden.com"
   },
-  "eu": {
-    "message": "EU",
-    "description": "European Union"
-  },
-  "us": {
-    "message": "US",
-    "description": "United States"
+  "euDomain": {
+    "message": "bitwarden.eu"
   },
   "smProjectDeleteAccessRestricted": {
     "message": "You don't have permissions to delete this project",
diff --git a/libs/angular/src/auth/components/environment-selector.component.html b/libs/angular/src/auth/components/environment-selector.component.html
index 5b86b236afa..f1ea36d76ff 100644
--- a/libs/angular/src/auth/components/environment-selector.component.html
+++ b/libs/angular/src/auth/components/environment-selector.component.html
@@ -1,5 +1,5 @@
 <label class="environment-selector-btn">
-  {{ "region" | i18n }}:
+  {{ "loggingInOn" | i18n }}:
   <a
     (click)="toggle(null)"
     cdkOverlayOrigin
@@ -8,8 +8,12 @@
     aria-controls="cdk-overlay-container"
     [ngSwitch]="selectedEnvironment"
   >
-    <label *ngSwitchCase="ServerEnvironmentType.US" class="text-primary">{{ "us" | i18n }}</label>
-    <label *ngSwitchCase="ServerEnvironmentType.EU" class="text-primary">{{ "eu" | i18n }}</label>
+    <label *ngSwitchCase="ServerEnvironmentType.US" class="text-primary">{{
+      "usDomain" | i18n
+    }}</label>
+    <label *ngSwitchCase="ServerEnvironmentType.EU" class="text-primary">{{
+      "euDomain" | i18n
+    }}</label>
     <label *ngSwitchCase="ServerEnvironmentType.SelfHosted" class="text-primary">{{
       "selfHosted" | i18n
     }}</label>
@@ -41,7 +45,7 @@
           "
         ></i>
         <img class="img-us" alt="" />
-        <span>{{ "us" | i18n }}</span>
+        <span>{{ "usDomain" | i18n }}</span>
       </button>
       <br />
       <button
@@ -59,7 +63,7 @@
           "
         ></i>
         <img class="img-eu" alt="" />
-        <span>{{ "eu" | i18n }}</span>
+        <span>{{ "euDomain" | i18n }}</span>
       </button>
       <br *ngIf="euServerFlagEnabled" />
       <button
@@ -76,8 +80,8 @@
           "
         ></i>
         <i
-          class="bwi bwi-fw bwi-sm bwi-pencil-square"
-          style="padding-bottom: 1px"
+          class="bwi bwi-fw bwi-md bwi-pencil-square"
+          style="padding-bottom: 1px; margin-right: 5px"
           aria-hidden="true"
         ></i>
         <span>{{ "selfHosted" | i18n }}</span>