From 86963302451541eacc8c7e1c9f6e2ecee4534efd Mon Sep 17 00:00:00 2001
From: rr-bw <102181210+rr-bw@users.noreply.github.com>
Date: Thu, 12 Sep 2024 11:04:15 -0700
Subject: [PATCH] change email validation to only run on submit (or when
 clicking continue button)

---
 .../src/angular/login/login-secondary-content.component.ts   | 4 ----
 libs/auth/src/angular/login/login.component.html             | 5 +++--
 libs/auth/src/angular/login/login.component.ts               | 2 +-
 3 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/libs/auth/src/angular/login/login-secondary-content.component.ts b/libs/auth/src/angular/login/login-secondary-content.component.ts
index e7df52954e..e3badc7df0 100644
--- a/libs/auth/src/angular/login/login-secondary-content.component.ts
+++ b/libs/auth/src/angular/login/login-secondary-content.component.ts
@@ -27,8 +27,4 @@ export class LoginSecondaryContentComponent {
   // also passes the email address to the registration page. We need to find a way to
   // do this now that the "Create account" link is in a separate component as
   // secondary content.
-
-  // TODO-rr-bw: Also need to make sure clicking the "Create account" link doesn't
-  // trigger form validation, causing the link to jump down on the page. See comment
-  // on this in the original web login.component.html (lines 51-57).
 }
diff --git a/libs/auth/src/angular/login/login.component.html b/libs/auth/src/angular/login/login.component.html
index 93c9577fcb..4c4ffc2742 100644
--- a/libs/auth/src/angular/login/login.component.html
+++ b/libs/auth/src/angular/login/login.component.html
@@ -84,7 +84,7 @@
 
   <!--
     TODO-rr-bw: Clarify this comment if necessary. Also check if there's a better way to handle this.
-    
+
     Why not use <ng-container *ngIf="validatedEmail"> to display this section?
     Because we want access to the masterPasswordInput reference in the class file.
     - Using a hidden div allows us to access the reference without rendering the div initially.
@@ -114,12 +114,13 @@
       <iframe id="hcaptcha_iframe" height="80" sandbox="allow-scripts allow-same-origin"></iframe>
     </div>
 
-    <!-- Button to Login with Master Password -->
     <div class="tw-grid tw-gap-3">
+      <!-- Button to Login with Master Password -->
       <button type="submit" bitButton bitFormButton block buttonType="primary">
         <span>{{ "loginWithMasterPassword" | i18n }}</span>
       </button>
 
+      <!-- Button to Login with Device -->
       <ng-container *ngIf="showLoginWithDevice && showPasswordless">
         <div class="tw-text-center">{{ "or" | i18n }}</div>
 
diff --git a/libs/auth/src/angular/login/login.component.ts b/libs/auth/src/angular/login/login.component.ts
index 4a68001ce9..c3821ea014 100644
--- a/libs/auth/src/angular/login/login.component.ts
+++ b/libs/auth/src/angular/login/login.component.ts
@@ -79,7 +79,7 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
   validatedEmail = false;
 
   formGroup = this.formBuilder.group({
-    email: ["", [Validators.required, Validators.email]],
+    email: ["", { validators: [Validators.required, Validators.email], updateOn: "submit" }],
     masterPassword: [
       "",
       [Validators.required, Validators.minLength(Utils.originalMinimumPasswordLength)],