EC-601 Remove device verification UI from web to avoid confusing users (#3744)

apps/web/src/app/organizations/settings/two-factor-setup.component.ts

@@ -3,10 +3,7 @@ import { ActivatedRoute } from "@angular/router";
 
 import { ModalService } from "@bitwarden/angular/services/modal.service";
 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 { MessagingService } from "@bitwarden/common/abstractions/messaging.service";
-import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { PolicyService } from "@bitwarden/common/abstractions/policy/policy.service.abstraction";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { TwoFactorProviderType } from "@bitwarden/common/enums/twoFactorProviderType";
@@ -26,21 +23,9 @@ export class TwoFactorSetupComponent extends BaseTwoFactorSetupComponent {
     messagingService: MessagingService,
     policyService: PolicyService,
     private route: ActivatedRoute,
-    stateService: StateService,
-    platformUtilsService: PlatformUtilsService,
-    i18nService: I18nService,
-    logService: LogService
+    stateService: StateService
   ) {
-    super(
-      apiService,
-      modalService,
-      messagingService,
-      policyService,
-      stateService,
-      platformUtilsService,
-      i18nService,
-      logService
-    );
+    super(apiService, modalService, messagingService, policyService, stateService);
   }
 
   async ngOnInit() {

apps/web/src/app/settings/two-factor-setup.component.html

@@ -55,40 +55,6 @@
     </div>
   </li>
 </ul>
-<form *ngIf="!loading" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
-  <div class="row">
-    <div class="col-12">
-      <h2 class="mt-5 spaced-header">
-        {{ "deviceVerification" | i18n }}
-      </h2>
-      <div class="form-group">
-        <div class="form-check">
-          <input
-            class="form-check-input"
-            type="checkbox"
-            id="enableDeviceVerification"
-            name="enableDeviceVerification"
-            disabled="{{ !isDeviceVerificationSectionEnabled }}"
-            [(ngModel)]="enableDeviceVerification"
-          />
-          <label class="form-check-label" for="enableDeviceVerification">
-            {{ "enableDeviceVerification" | i18n }}
-          </label>
-        </div>
-        <small class="form-text text-muted">{{ "deviceVerificationDesc" | i18n }}</small>
-      </div>
-      <button
-        type="submit"
-        buttonType="primary"
-        bitButton
-        [loading]="form.loading"
-        *ngIf="isDeviceVerificationSectionEnabled"
-      >
-        {{ "save" | i18n }}
-      </button>
-    </div>
-  </div>
-</form>
 
 <ng-template #authenticatorTemplate></ng-template>
 <ng-template #recoveryTemplate></ng-template>

apps/web/src/app/settings/two-factor-setup.component.ts

@@ -4,15 +4,11 @@ import { Subject, takeUntil } from "rxjs";
 import { ModalRef } from "@bitwarden/angular/components/modal/modal.ref";
 import { ModalService } from "@bitwarden/angular/services/modal.service";
 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 { MessagingService } from "@bitwarden/common/abstractions/messaging.service";
-import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { PolicyService } from "@bitwarden/common/abstractions/policy/policy.service.abstraction";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { PolicyType } from "@bitwarden/common/enums/policyType";
 import { TwoFactorProviderType } from "@bitwarden/common/enums/twoFactorProviderType";
-import { DeviceVerificationRequest } from "@bitwarden/common/models/request/deviceVerificationRequest";
 import { TwoFactorProviders } from "@bitwarden/common/services/twoFactor.service";
 
 import { TwoFactorAuthenticatorComponent } from "./two-factor-authenticator.component";
@@ -44,8 +40,6 @@ export class TwoFactorSetupComponent implements OnInit, OnDestroy {
   canAccessPremium: boolean;
   showPolicyWarning = false;
   loading = true;
-  enableDeviceVerification: boolean;
-  isDeviceVerificationSectionEnabled: boolean;
   modal: ModalRef;
   formPromise: Promise<any>;
 
@@ -57,22 +51,11 @@ export class TwoFactorSetupComponent implements OnInit, OnDestroy {
     protected modalService: ModalService,
     protected messagingService: MessagingService,
     protected policyService: PolicyService,
-    private stateService: StateService,
-    private platformUtilsService: PlatformUtilsService,
-    private i18nService: I18nService,
-    private logService: LogService
+    private stateService: StateService
   ) {}
 
   async ngOnInit() {
     this.canAccessPremium = await this.stateService.getCanAccessPremium();
-    try {
-      const deviceVerificationSettings = await this.apiService.getDeviceVerificationSettings();
-      this.isDeviceVerificationSectionEnabled =
-        deviceVerificationSettings.isDeviceVerificationSectionEnabled;
-      this.enableDeviceVerification = deviceVerificationSettings.unknownDeviceVerificationEnabled;
-    } catch (e) {
-      this.logService.error(e);
-    }
 
     for (const key in TwoFactorProviders) {
       // eslint-disable-next-line
@@ -224,37 +207,4 @@ export class TwoFactorSetupComponent implements OnInit, OnDestroy {
       this.showPolicyWarning = false;
     }
   }
-
-  async submit() {
-    try {
-      if (this.enableDeviceVerification) {
-        const email = await this.stateService.getEmail();
-        const confirmed = await this.platformUtilsService.showDialog(
-          this.i18nService.t(
-            "areYouSureYouWantToEnableDeviceVerificationTheVerificationCodeEmailsWillArriveAtX",
-            email
-          ),
-          this.i18nService.t("deviceVerification"),
-          this.i18nService.t("yes"),
-          this.i18nService.t("no"),
-          "warning"
-        );
-        if (!confirmed) {
-          return;
-        }
-      }
-
-      this.formPromise = this.apiService.putDeviceVerificationSettings(
-        new DeviceVerificationRequest(this.enableDeviceVerification)
-      );
-      await this.formPromise;
-      this.platformUtilsService.showToast(
-        "success",
-        null,
-        this.i18nService.t("updatedDeviceVerification")
-      );
-    } catch (e) {
-      this.logService.error(e);
-    }
-  }
 }