From 2a58a69b08076dea3639bf71a92ff323c1dda157 Mon Sep 17 00:00:00 2001
From: rr-bw <102181210+rr-bw@users.noreply.github.com>
Date: Fri, 30 Aug 2024 15:40:23 -0700
Subject: [PATCH] handle registerRoute

---
 .../src/angular/login/login.component.html    | 17 +++++++++++++-
 .../auth/src/angular/login/login.component.ts | 22 ++++++++++++++++++-
 2 files changed, 37 insertions(+), 2 deletions(-)

diff --git a/libs/auth/src/angular/login/login.component.html b/libs/auth/src/angular/login/login.component.html
index 97b462258b..31ad27f000 100644
--- a/libs/auth/src/angular/login/login.component.html
+++ b/libs/auth/src/angular/login/login.component.html
@@ -48,7 +48,22 @@
 
     <hr />
 
-    <!-- TODO-rr-bw: More here -->
+    <p class="tw-m-0 tw-text-sm">
+      {{ "newAroundHere" | i18n }}
+      <!-- Two notes:  
+           (1) We check the value and validity of email so we don't send an invalid email to autofill 
+           on load of register for both enter and mouse based navigation
+           (2) We use mousedown to trigger navigation so that the onBlur form validation does not fire 
+           and move the create account link down the page on click which causes the user to miss actually 
+           clicking on the link. Mousedown fires before onBlur. 
+      -->
+      <a
+        [routerLink]="registerRoute$ | async"
+        [queryParams]="emailFormControl.valid ? { email: emailFormControl.value } : {}"
+        (mousedown)="goToRegister()"
+        >{{ "createAccount" | i18n }}</a
+      >
+    </p>
   </ng-container>
 
   <!-----------------------------------
diff --git a/libs/auth/src/angular/login/login.component.ts b/libs/auth/src/angular/login/login.component.ts
index 80a8a04057..a5301a3545 100644
--- a/libs/auth/src/angular/login/login.component.ts
+++ b/libs/auth/src/angular/login/login.component.ts
@@ -5,7 +5,7 @@ import { ActivatedRoute, Router, RouterModule } from "@angular/router";
 import { first, firstValueFrom, Subject, take, takeUntil } from "rxjs";
 
 import { JslibModule } from "@bitwarden/angular/jslib.module";
-import { LoginEmailServiceAbstraction } from "@bitwarden/auth/common";
+import { LoginEmailServiceAbstraction, RegisterRouteService } from "@bitwarden/auth/common";
 import { MasterPasswordPolicyOptions } from "@bitwarden/common/admin-console/models/domain/master-password-policy-options";
 import { Policy } from "@bitwarden/common/admin-console/models/domain/policy";
 import { DevicesApiServiceAbstraction } from "@bitwarden/common/auth/abstractions/devices-api.service.abstraction";
@@ -42,6 +42,7 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
   private destroy$ = new Subject<void>();
 
   clientType: ClientType;
+  registerRoute$ = this.registerRouteService.registerRoute$(); // TODO: remove when email verification flag is removed
   showLoginWithDevice = false;
   validatedEmail = false;
 
@@ -54,6 +55,10 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
     rememberEmail: [false],
   });
 
+  get emailFormControl() {
+    return this.formGroup.controls.email;
+  }
+
   get loggedEmail() {
     return this.formGroup.value.email;
   }
@@ -72,6 +77,7 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
     private loginService: LoginService,
     private ngZone: NgZone,
     private platformUtilsService: PlatformUtilsService,
+    private registerRouteService: RegisterRouteService,
     private router: Router,
   ) {
     this.clientType = this.platformUtilsService.getClientType();
@@ -152,6 +158,20 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
     }
   }
 
+  protected async goToRegister() {
+    // TODO: remove when email verification flag is removed
+    const registerRoute = await firstValueFrom(this.registerRoute$);
+
+    if (this.emailFormControl.valid) {
+      await this.router.navigate([registerRoute], {
+        queryParams: { email: this.emailFormControl.value },
+      });
+      return;
+    }
+
+    await this.router.navigate([registerRoute]);
+  }
+
   private async getLoginWithDevice(email: string): Promise<void> {
     try {
       const deviceIdentifier = await this.appIdService.getAppId();