[SM-260] Hide email verification prompt if already verified (#3922)

Co-authored-by: Sammy Chang <sammychang2185@gmail.com>

apps/web/src/app/settings/verify-email.component.ts

@@ -1,9 +1,10 @@
-import { Component } from "@angular/core";
+import { Component, EventEmitter, Output } from "@angular/core";
 
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
+import { TokenService } from "@bitwarden/common/abstractions/token.service";
 
 @Component({
   selector: "app-verify-email",
@@ -12,25 +13,40 @@ import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUti
 export class VerifyEmailComponent {
   actionPromise: Promise<unknown>;
 
+  @Output() onVerified = new EventEmitter<boolean>();
+
   constructor(
     private apiService: ApiService,
     private i18nService: I18nService,
     private platformUtilsService: PlatformUtilsService,
-    private logService: LogService
+    private logService: LogService,
+    private tokenService: TokenService
   ) {}
 
-  async send() {
+  async verifyEmail(): Promise<void> {
-    if (this.actionPromise != null) {
+    await this.apiService.refreshIdentityToken();
+    if (await this.tokenService.getEmailVerified()) {
+      this.onVerified.emit(true);
+      this.platformUtilsService.showToast("success", null, this.i18nService.t("emailVerified"));
       return;
     }
-    try {
+
-      this.actionPromise = this.apiService.postAccountVerifyEmail();
+    await this.apiService.postAccountVerifyEmail();
-      await this.actionPromise;
     this.platformUtilsService.showToast(
       "success",
       null,
       this.i18nService.t("checkInboxForVerification")
     );
+  }
+
+  async send() {
+    if (this.actionPromise != null) {
+      return;
+    }
+
+    try {
+      this.actionPromise = this.verifyEmail();
+      await this.actionPromise;
     } catch (e) {
       this.logService.error(e);
     }

apps/web/src/app/vault/vault.component.html

@@ -78,7 +78,12 @@
           </button>
         </div>
       </div>
-      <app-verify-email *ngIf="showVerifyEmail" class="d-block mb-4"></app-verify-email>
+      <app-verify-email
+        *ngIf="showVerifyEmail"
+        class="d-block mb-4"
+        (onVerified)="emailVerified($event)"
+      ></app-verify-email>
+
       <div class="card border-warning mb-4" *ngIf="showBrowserOutdated">
         <div class="card-header bg-warning text-white">
           <i class="bwi bwi-exclamation-triangle bwi-fw" aria-hidden="true"></i>

apps/web/src/app/vault/vault.component.ts

@@ -169,6 +169,10 @@ export class VaultComponent implements OnInit, OnDestroy {
     );
   }
 
+  emailVerified(verified: boolean) {
+    this.showVerifyEmail = !verified;
+  }
+
   ngOnDestroy() {
     this.broadcasterService.unsubscribe(BroadcasterSubscriptionId);
   }