From 234191e809fb5aaa9115be48ab1846ce6237e312 Mon Sep 17 00:00:00 2001
From: rr-bw <102181210+rr-bw@users.noreply.github.com>
Date: Wed, 11 Sep 2024 11:48:18 -0700
Subject: [PATCH] fill out desktop template and submit()

---
 .../src/angular/login/login.component.html    | 45 ++++++++++++++++++-
 .../auth/src/angular/login/login.component.ts | 15 ++++++-
 2 files changed, 58 insertions(+), 2 deletions(-)

diff --git a/libs/auth/src/angular/login/login.component.html b/libs/auth/src/angular/login/login.component.html
index e78f08b904..b934129dea 100644
--- a/libs/auth/src/angular/login/login.component.html
+++ b/libs/auth/src/angular/login/login.component.html
@@ -100,7 +100,7 @@
 
       <!-- Link to Password Hint page -->
       <a
-        class="tw-mt-2"
+        class="tw-mt-2 tw-font-semibold"
         routerLink="/hint"
         (mousedown)="goToHint()"
         (click)="saveEmailSettings()"
@@ -108,6 +108,7 @@
       >
     </div>
 
+    <!-- TODO-rr-bw: will we still be handling captcha? -->
     <!-- Captcha iframe -->
     <div [hidden]="!showCaptcha()">
       <iframe id="hcaptcha_iframe" height="80" sandbox="allow-scripts allow-same-origin"></iframe>
@@ -218,4 +219,46 @@
   <!-------------------------------------------
     Desktop UI State 2: Master Password Entry
   -------------------------------------------->
+
+  <ng-container *ngIf="validatedEmail">
+    <div class="tw-grid tw-gap-4">
+      <div>
+        <!-- Master Password input -->
+        <bit-form-field class="!tw-mb-1">
+          <bit-label>{{ "masterPassword" | i18n }}</bit-label>
+          <input type="password" formControlName="masterPassword" bitInput />
+          <button type="button" bitIconButton bitSuffix bitPasswordInputToggle></button>
+        </bit-form-field>
+
+        <!-- Link to Password Hint page -->
+        <a
+          class="tw-font-semibold"
+          routerLink="/hint"
+          (mousedown)="goToHint()"
+          (click)="saveEmailSettings()"
+        >
+          {{ "getMasterPasswordHint" | i18n }}
+        </a>
+      </div>
+
+      <!-- Button to Login with Master Password -->
+      <button type="submit" bitButton bitFormButton block buttonType="primary">
+        <span> {{ "loginWithMasterPassword" | i18n }} </span>
+      </button>
+
+      <ng-container *ngIf="showLoginWithDevice && showPasswordless">
+        <div class="tw-text-center">{{ "or" | i18n }}</div>
+
+        <button
+          type="button"
+          bitButton
+          block
+          buttonType="secondary"
+          (click)="startAuthRequestLogin()"
+        >
+          <span><i class="bwi bwi-mobile"></i> {{ "loginWithDevice" | i18n }}</span>
+        </button>
+      </ng-container>
+    </div>
+  </ng-container>
 </form>
diff --git a/libs/auth/src/angular/login/login.component.ts b/libs/auth/src/angular/login/login.component.ts
index 4c4f962460..f037d55956 100644
--- a/libs/auth/src/angular/login/login.component.ts
+++ b/libs/auth/src/angular/login/login.component.ts
@@ -97,7 +97,7 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
 
   // Desktop properties
   deferFocus: boolean = null; // TODO-rr-bw: why initialize to null instead of false
-  showPassword = false; // TODO-rr-bw: is this still needed?
+  showPassword = false; // TODO-rr-bw: is this still needed? It seems we no longer need this now that we have bitPasswordInputToggle
 
   constructor(
     private activatedRoute: ActivatedRoute,
@@ -153,6 +153,12 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
   }
 
   submit = async (): Promise<void> => {
+    if (this.clientType === ClientType.Desktop) {
+      if (!this.validatedEmail) {
+        return;
+      }
+    }
+
     const { email, masterPassword } = this.formGroup.value;
 
     await this.setupCaptcha();
@@ -188,6 +194,13 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
 
     await this.saveEmailSettings();
     await this.handleAuthResult(authResult);
+
+    if (this.clientType === ClientType.Desktop) {
+      if (this.captchaSiteKey) {
+        const content = document.getElementById("content") as HTMLDivElement;
+        content.setAttribute("style", "width:335px");
+      }
+    }
   };
 
   /**