cleanup various sso tasks (#617)

jslib

@@ -1 +1 @@
-Subproject commit 719c9c569beca2b726879ae2e84792220362d495
+Subproject commit 5d874d07b35a23dc6d54f1f435d88d2ddd815e33

src/app/accounts/login.component.html

@@ -46,7 +46,7 @@
                     </div>
                     <div class="d-flex">
                         <a routerLink="/sso" class="btn btn-outline-secondary btn-block mt-2">
-                            <i class="fa fa-bank" aria-hidden="true"></i> Enterprise Single Sign-On
+                            <i class="fa fa-bank" aria-hidden="true"></i> {{'enterpriseSingleSignOn' | i18n}}
                         </a>
                     </div>
                 </div>

src/app/accounts/sso.component.html

@@ -5,15 +5,14 @@
             <div class="card d-block mt-4">
                 <div class="card-body" *ngIf="loggingIn">
                     <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true"></i>
-                    Logging in, please wait...
+                    {{'loading' | i18n}}
                 </div>
                 <div class="card-body" *ngIf="!loggingIn">
-                    <p>Quickly log in using your organization's single sign-on portal. Please enter your organization's
-                        identifier to begin.</p>
+                    <p>{{'ssoLogInWithOrgIdentifier' | i18n}}</p>
                     <div class="form-group">
-                        <label for="identifier">Organization Identifier</label>
+                        <label for="identifier">{{'organizationIdentifier' | i18n}}</label>
                         <input id="identifier" class="form-control" type="text" name="Identifier"
-                            [(ngModel)]="identifier" required>
+                            [(ngModel)]="identifier" required appAutofocus>
                     </div>
                     <hr>
                     <div class="d-flex">

src/app/accounts/sso.component.ts

@@ -15,6 +15,8 @@ import { StorageService } from 'jslib/abstractions/storage.service';
 
 import { SsoComponent as BaseSsoComponent } from 'jslib/angular/components/sso.component';
 
+const IdentifierStorageKey = 'ssoOrgIdentifier';
+
 @Component({
     selector: 'app-sso',
     templateUrl: 'sso.component.html',
@@ -31,4 +33,26 @@ export class SsoComponent extends BaseSsoComponent {
         this.redirectUri = window.location.origin + '/sso-connector.html';
         this.clientId = 'web';
     }
+
+    async ngOnInit() {
+        super.ngOnInit();
+        const queryParamsSub = this.route.queryParams.subscribe(async (qParams) => {
+            if (qParams.identifier != null) {
+                this.identifier = qParams.identifier;
+            } else {
+                const storedIdentifier = await this.storageService.get<string>(IdentifierStorageKey);
+                if (storedIdentifier != null) {
+                    this.identifier = storedIdentifier;
+                }
+            }
+            if (queryParamsSub != null) {
+                queryParamsSub.unsubscribe();
+            }
+        });
+    }
+
+    async submit() {
+        await this.storageService.save(IdentifierStorageKey, this.identifier);
+        super.submit();
+    }
 }

src/app/app-routing.module.ts

@@ -104,7 +104,7 @@ const routes: Routes = [
             {
                 path: 'sso', component: SsoComponent,
                 canActivate: [UnauthGuardService],
-                data: { titleId: 'createAccount' }, // TODO
+                data: { titleId: 'enterpriseSingleSignOn' },
             },
             {
                 path: 'set-password', component: SetPasswordComponent,

src/app/layouts/organization-layout.component.html

@@ -48,7 +48,7 @@
                 <i class="fa fa-bank fa-fw" [hidden]="enterpriseBtn.loading" aria-hidden="true"></i>
                 <i class="fa fa-spinner fa-spin fa-fw" [hidden]="!enterpriseBtn.loading" title="{{'loading' | i18n}}"
                     aria-hidden="true"></i>
-                Enterprise →
+                {{'businessPortal' | i18n}} →
             </button>
         </div>
     </div>

src/connectors/sso.html

@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=1010">
     <meta name="theme-color" content="#175DDC">
 
-    <title>Logging into Bitwarden...</title>
+    <title>Bitwarden</title>
 
     <link rel="apple-touch-icon" sizes="180x180" href="images/icons/apple-touch-icon.png">
     <link rel="icon" type="image/png" sizes="32x32" href="images/icons/favicon-32x32.png">
@@ -22,9 +22,6 @@
             <p class="text-center">
                 <i class="fa fa-spinner fa-spin fa-2x text-muted" title="Loading" aria-hidden="true"></i>
             </p>
-            <p class="text-center">
-                Logging into Bitwarden...
-            </p>
         </div>
     </div>
 </body>

src/locales/en/messages.json

@@ -3172,5 +3172,18 @@
   },
   "identifier": {
     "message": "Identifier"
+  },
+  "organizationIdentifier": {
+    "message": "Organization Identifier"
+  },
+  "ssoLogInWithOrgIdentifier": {
+    "message": "Log in using your organization's single sign-on portal. Please enter your organization's identifier to begin."
+  },
+  "enterpriseSingleSignOn": {
+    "message": "Enterprise Single Sign-On"
+  },
+  "businessPortal": {
+    "message": "Business Portal",
+    "description": "The web portal used by business organizations for configuring certain features."
   }
 }

src/services/htmlStorage.service.ts

@@ -7,7 +7,7 @@ export class HtmlStorageService implements StorageService {
         ConstantsService.disableFaviconKey, 'rememberEmail', 'enableGravatars', 'enableFullWidth',
         ConstantsService.localeKey, ConstantsService.autoConfirmFingerprints,
         ConstantsService.vaultTimeoutKey, ConstantsService.vaultTimeoutActionKey, ConstantsService.ssoCodeVerifierKey,
-        ConstantsService.ssoStateKey]);
+        ConstantsService.ssoStateKey, 'ssoOrgIdentifier']);
     private localStorageStartsWithKeys = ['twoFactorToken_', ConstantsService.collapsedGroupingsKey + '_'];
 
     constructor(private platformUtilsService: PlatformUtilsService) { }