add showPasswordless flag

apps/web/src/app/auth/core/services/login/web-login.service.ts

@@ -8,6 +8,7 @@ import { InternalPolicyService } from "@bitwarden/common/admin-console/abstracti
 import { Policy } from "@bitwarden/common/admin-console/models/domain/policy";
 import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
 
+import { flagEnabled } from "../../../../../utils/flags";
 import { RouterService } from "../../../../core/router.service";
 import { AcceptOrganizationInviteService } from "../../../organization-invite/accept-organization.service";
 
@@ -18,6 +19,10 @@ export class WebLoginService extends DefaultLoginService implements LoginService
   policyService = inject(InternalPolicyService);
   routerService = inject(RouterService);
 
+  getShowPasswordlessFlag(): boolean {
+    return flagEnabled("showPasswordless");
+  }
+
   setPreviousUrl(route: UrlTree): void | null {
     this.routerService.setPreviousUrl(route.toString());
   }

libs/auth/src/angular/login/default-login.service.ts

@@ -3,6 +3,10 @@ import { UrlTree } from "@angular/router";
 import { LoginService, PasswordPolicies } from "./login.service";
 
 export class DefaultLoginService implements LoginService {
+  getShowPasswordlessFlag(): boolean {
+    return null;
+  }
+
   setPreviousUrl(route: UrlTree): void | null {
     return null;
   }

libs/auth/src/angular/login/login.component.html

@@ -2,7 +2,7 @@
   <!-------------------------
     UI STATE 1: Email Entry
   -------------------------->
-  <ng-container *ngIf="true">
+  <ng-container *ngIf="!validatedEmail">
     <!-- Email Address input -->
     <div class="tw-mb-3">
       <bit-form-field>
@@ -69,4 +69,63 @@
   <!-----------------------------------
     UI STATE 2: Master Password Entry
   ------------------------------------>
+  <ng-container *ngIf="validateEmail">
+    <div class="tw-mb-6 tw-h-28">
+      <bit-form-field class="!tw-mb-1">
+        <bit-label>{{ "masterPass" | i18n }}</bit-label>
+        <input type="password" bitInput #masterPasswordInput formControlName="masterPassword" />
+        <button type="button" bitSuffix bitIconButton bitPasswordInputToggle></button>
+      </bit-form-field>
+      <a
+        class="tw-mt-2"
+        routerLink="/hint"
+        (mousedown)="goToHint()"
+        (click)="saveEmailSettings()"
+        >{{ "getMasterPasswordHint" | i18n }}</a
+      >
+    </div>
+
+    <div [hidden]="!showCaptcha()">
+      <iframe id="hcaptcha_iframe" height="80" sandbox="allow-scripts allow-same-origin"></iframe>
+    </div>
+
+    <div class="tw-mb-3 tw-flex tw-space-x-4">
+      <button bitButton buttonType="primary" bitFormButton type="submit" [block]="true">
+        <span> {{ "loginWithMasterPassword" | i18n }} </span>
+      </button>
+    </div>
+
+    <div class="tw-mb-3" *ngIf="showLoginWithDevice && showPasswordless">
+      <button
+        bitButton
+        type="button"
+        [block]="true"
+        buttonType="secondary"
+        (click)="startAuthRequestLogin()"
+      >
+        <span> <i class="bwi bwi-mobile"></i> {{ "loginWithDevice" | i18n }} </span>
+      </button>
+    </div>
+
+    <div class="tw-mb-3">
+      <a
+        routerLink="/sso"
+        [queryParams]="{ email: formGroup.value.email }"
+        (click)="saveEmailSettings()"
+        bitButton
+        buttonType="secondary"
+        class="tw-w-full"
+      >
+        <i class="bwi bwi-provider tw-mr-2"></i>
+        {{ "enterpriseSingleSignOn" | i18n }}
+      </a>
+    </div>
+
+    <hr />
+
+    <div class="tw-m-0 tw-text-sm">
+      <p class="tw-mb-1">{{ "loggingInAs" | i18n }} {{ loggedEmail }}</p>
+      <a [routerLink]="[]" (click)="toggleValidateEmail(false)">{{ "notYou" | i18n }}</a>
+    </div>
+  </ng-container>
 </form>

libs/auth/src/angular/login/login.component.ts

@@ -66,6 +66,7 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
   // Web specific properties
   enforcedPasswordPolicyOptions: MasterPasswordPolicyOptions;
   policies: Policy[];
+  showPasswordless = false;
   showResetPasswordAutoEnrollWarning = false;
 
   constructor(
@@ -81,6 +82,7 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
     private router: Router,
   ) {
     this.clientType = this.platformUtilsService.getClientType();
+    this.showPasswordless = this.loginService.getShowPasswordlessFlag();
   }
 
   async ngOnInit(): Promise<void> {
@@ -158,6 +160,11 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
     }
   }
 
+  protected async goToHint() {
+    await this.saveEmailSettings();
+    await this.router.navigateByUrl("/hint");
+  }
+
   protected async goToRegister() {
     // TODO: remove when email verification flag is removed
     const registerRoute = await firstValueFrom(this.registerRoute$);
@@ -172,6 +179,12 @@ export class LoginComponentV2 implements OnInit, OnDestroy {
     await this.router.navigate([registerRoute]);
   }
 
+  protected async saveEmailSettings() {
+    this.loginEmailService.setEmail(this.formGroup.value.email);
+    this.loginEmailService.setRememberEmail(this.formGroup.value.rememberEmail);
+    await this.loginEmailService.saveEmailSettings();
+  }
+
   private async getLoginWithDevice(email: string): Promise<void> {
     try {
       const deviceIdentifier = await this.appIdService.getAppId();

libs/auth/src/angular/login/login.service.ts

@@ -11,6 +11,7 @@ export interface PasswordPolicies {
 
 export abstract class LoginService {
   // Web specific
+  getShowPasswordlessFlag: () => boolean;
   getOrgPolicies: () => Promise<PasswordPolicies | null>;
   setPreviousUrl: (route: UrlTree) => void | null;
 }