Handle session timeout and fix resend code

bitwarden · Jan 3, 2025 · 1eb8c5a · 1eb8c5a
1 parent b377236
commit 1eb8c5a
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 6 deletions.
diff --git a/libs/auth/src/angular/new-device-verification/new-device-verification.component.html b/libs/auth/src/angular/new-device-verification/new-device-verification.component.html
@@ -11,7 +11,14 @@
     />
   </bit-form-field>
 
-  <button bitLink type="button" linkType="primary" (click)="requestOTP()" class="">
+  <button
+    bitLink
+    type="button"
+    linkType="primary"
+    (click)="requestOTP()"
+    [disabled]="disableRequestOTP"
+    class=""
+  >
     {{ "resendCode" | i18n }}
   </button>
 

diff --git a/libs/auth/src/angular/new-device-verification/new-device-verification.component.ts b/libs/auth/src/angular/new-device-verification/new-device-verification.component.ts
@@ -1,9 +1,11 @@
 import { CommonModule } from "@angular/common";
-import { Component, OnInit } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import { FormBuilder, ReactiveFormsModule, Validators } from "@angular/forms";
 import { Router } from "@angular/router";
+import { Subject, takeUntil } from "rxjs";
 
 import { JslibModule } from "@bitwarden/angular/jslib.module";
+import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { DeviceVerificationRequest } from "@bitwarden/common/auth/models/request/device-verification.request";
 import { ButtonModule, FormFieldModule, IconButtonModule, LinkModule } from "@bitwarden/components";
 
@@ -23,28 +25,44 @@ import { PasswordLoginStrategy } from "../../common/login-strategies/password-lo
     LinkModule,
   ],
 })
-export class NewDeviceVerificationComponent implements OnInit {
+export class NewDeviceVerificationComponent implements OnInit, OnDestroy {
   formGroup = this.formBuilder.group({
     code: ["", [Validators.required]],
   });
 
   protected disableRequestOTP = false;
+  private destroy$ = new Subject<void>();
 
   constructor(
     private router: Router,
     private formBuilder: FormBuilder,
     private passwordLoginStrategy: PasswordLoginStrategy,
+    private apiService: ApiService,
   ) {}
 
   async ngOnInit() {
+    // Redirect to login if session times out
+    this.passwordLoginStrategy.sessionTimeout$
+      .pipe(takeUntil(this.destroy$))
+      .subscribe((timedOut) => {
+        if (timedOut) {
+          void this.router.navigate(["/login"]);
+        }
+      });
+
     // Request initial OTP on component load
-    await this.requestOTP();
+    // await this.requestOTP();
+  }
+
+  ngOnDestroy() {
+    this.destroy$.next();
+    this.destroy$.complete();
   }
 
   async requestOTP() {
     this.disableRequestOTP = true;
     try {
-      // TODO: Implement OTP request
+      await this.apiService.send("POST", "/accounts/request-otp", null, true, false);
     } finally {
       this.disableRequestOTP = false;
     }

diff --git a/libs/common/src/auth/models/request/identity-token/password-token.request.ts b/libs/common/src/auth/models/request/identity-token/password-token.request.ts
@@ -33,7 +33,7 @@ export class PasswordTokenRequest extends TokenRequest implements CaptchaProtect
     }
 
     if (this.deviceVerificationOtp) {
-      obj.append("deviceVerificationOtp", this.deviceVerificationOtp);
+      obj.deviceVerificationOtp = this.deviceVerificationOtp;
     }
 
     return obj;