From 8180aaa4cc9a14d4d875a22456987a85abd6a9c0 Mon Sep 17 00:00:00 2001
From: Thomas Rittson <31796059+eliykat@users.noreply.github.com>
Date: Mon, 13 Sep 2021 10:49:24 +1000
Subject: [PATCH] Add warning about 2FA when changing account email (#1186)

* Add warning about 2FA when changing account email

* Fix linting

* Fix code style and warning wording
---
 src/app/settings/change-email.component.html |  3 +++
 src/app/settings/change-email.component.ts   | 12 +++++++++++-
 src/locales/en/messages.json                 |  3 +++
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/app/settings/change-email.component.html b/src/app/settings/change-email.component.html
index ec8ed1e8b28..79a24bd7376 100644
--- a/src/app/settings/change-email.component.html
+++ b/src/app/settings/change-email.component.html
@@ -1,4 +1,7 @@
 <form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
+    <app-callout type="warning" *ngIf="showTwoFactorEmailWarning">
+        {{'changeEmailTwoFactorWarning' | i18n}}
+    </app-callout>
     <div class="row">
         <div class="col-6">
             <div class="form-group">
diff --git a/src/app/settings/change-email.component.ts b/src/app/settings/change-email.component.ts
index 5553d717372..5d2777ba7cf 100644
--- a/src/app/settings/change-email.component.ts
+++ b/src/app/settings/change-email.component.ts
@@ -1,5 +1,6 @@
 import {
     Component,
+    OnInit,
 } from '@angular/core';
 
 import { ToasterService } from 'angular2-toaster';
@@ -13,15 +14,18 @@ import { UserService } from 'jslib-common/abstractions/user.service';
 import { EmailRequest } from 'jslib-common/models/request/emailRequest';
 import { EmailTokenRequest } from 'jslib-common/models/request/emailTokenRequest';
 
+import { TwoFactorProviderType } from 'jslib-common/enums';
+
 @Component({
     selector: 'app-change-email',
     templateUrl: 'change-email.component.html',
 })
-export class ChangeEmailComponent {
+export class ChangeEmailComponent implements OnInit {
     masterPassword: string;
     newEmail: string;
     token: string;
     tokenSent = false;
+    showTwoFactorEmailWarning = false;
 
     formPromise: Promise<any>;
 
@@ -29,6 +33,12 @@ export class ChangeEmailComponent {
         private toasterService: ToasterService, private cryptoService: CryptoService,
         private messagingService: MessagingService, private userService: UserService) { }
 
+    async ngOnInit() {
+        const twoFactorProviders = await this.apiService.getTwoFactorProviders();
+        this.showTwoFactorEmailWarning = twoFactorProviders.data.some(p => p.type === TwoFactorProviderType.Email &&
+            p.enabled);
+    }
+
     async submit() {
         const hasEncKey = await this.cryptoService.hasEncKey();
         if (!hasEncKey) {
diff --git a/src/locales/en/messages.json b/src/locales/en/messages.json
index b396298e8fe..55a09a22c7a 100644
--- a/src/locales/en/messages.json
+++ b/src/locales/en/messages.json
@@ -899,6 +899,9 @@
   "changeEmail": {
     "message": "Change Email"
   },
+  "changeEmailTwoFactorWarning": {
+    "message": "Proceeding will change your account email address. It will not change the email address used for two-factor authentication. You can change this email address in the Two-Step Login settings."
+  },
   "newEmail": {
     "message": "New Email"
   },