Cleanup migrated components (#14625)

Cleans up migrated components by removing unnecessary old behaviour.

- Removes ng-template and ViewChild used by the old Modal Service.
- Remove aria-dismiss used by old Modals.
- Remove aria-haspopup and aria-expanded on bitMenuTriggerFor since it's handled by the directive.

apps/web/src/app/admin-console/organizations/collections/vault-header/vault-header.component.html

@@ -35,7 +35,6 @@
         [bitMenuTriggerFor]="editCollectionMenu"
         size="small"
         type="button"
-        aria-haspopup="true"
       ></button>
       <bit-menu #editCollectionMenu>
         <ng-container *ngIf="canEditCollection">

apps/web/src/app/admin-console/organizations/collections/vault.component.html

@@ -153,6 +153,3 @@
     </div>
   </div>
 </div>
-<ng-template #attachments></ng-template>
-<ng-template #cipherAddEdit></ng-template>
-<ng-template #collectionsModal></ng-template>

apps/web/src/app/admin-console/organizations/members/members.component.html

@@ -374,4 +374,3 @@
     </cdk-virtual-scroll-viewport>
   </ng-container>
 </ng-container>
-<ng-template #resetPasswordTemplate></ng-template>

apps/web/src/app/admin-console/organizations/members/members.component.ts

@@ -1,6 +1,6 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
-import { Component, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component } from "@angular/core";
 import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
 import { ActivatedRoute, Router } from "@angular/router";
 import {
@@ -90,9 +90,6 @@ class MembersTableDataSource extends PeopleTableDataSource<OrganizationUserView>
   templateUrl: "members.component.html",
 })
 export class MembersComponent extends BaseMembersComponent<OrganizationUserView> {
-  @ViewChild("resetPasswordTemplate", { read: ViewContainerRef, static: true })
-  resetPasswordModalRef: ViewContainerRef;
-
   userType = OrganizationUserType;
   userStatusType = OrganizationUserStatusType;
   memberTab = MemberDialogTab;

apps/web/src/app/admin-console/organizations/policies/policies.component.html

@@ -35,5 +35,4 @@
       </tr>
     </ng-template>
   </bit-table>
-  <ng-template #editTemplate></ng-template>
 </bit-container>

apps/web/src/app/admin-console/organizations/policies/policies.component.ts

@@ -1,6 +1,6 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
-import { Component, OnInit, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
 import { firstValueFrom, lastValueFrom, map, Observable, switchMap } from "rxjs";
 import { first } from "rxjs/operators";
@@ -33,9 +33,6 @@ import { PolicyEditComponent, PolicyEditDialogResult } from "./policy-edit.compo
   templateUrl: "policies.component.html",
 })
 export class PoliciesComponent implements OnInit {
-  @ViewChild("editTemplate", { read: ViewContainerRef, static: true })
-  editModalRef: ViewContainerRef;
-
   loading = true;
   organizationId: string;
   policies: BasePolicy[];

apps/web/src/app/admin-console/organizations/settings/account.component.html

@@ -93,7 +93,4 @@
       {{ "purgeVault" | i18n }}
     </button>
   </app-danger-zone>
-
-  <ng-template #apiKeyTemplate></ng-template>
-  <ng-template #rotateApiKeyTemplate></ng-template>
 </bit-container>

apps/web/src/app/admin-console/organizations/settings/account.component.ts

@@ -1,6 +1,6 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
-import { Component, OnDestroy, OnInit, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
 import { ActivatedRoute, Router } from "@angular/router";
 import {
@@ -43,11 +43,6 @@ import { DeleteOrganizationDialogResult, openDeleteOrganizationDialog } from "./
   templateUrl: "account.component.html",
 })
 export class AccountComponent implements OnInit, OnDestroy {
-  @ViewChild("apiKeyTemplate", { read: ViewContainerRef, static: true })
-  apiKeyModalRef: ViewContainerRef;
-  @ViewChild("rotateApiKeyTemplate", { read: ViewContainerRef, static: true })
-  rotateApiKeyModalRef: ViewContainerRef;
-
   selfHosted = false;
   canEditSubscription = true;
   loading = true;

apps/web/src/app/auth/settings/account/account.component.html

@@ -51,7 +51,4 @@
       {{ "deleteAccount" | i18n }}
     </button>
   </app-danger-zone>
-
-  <ng-template #viewUserApiKeyTemplate></ng-template>
-  <ng-template #rotateUserApiKeyTemplate></ng-template>
 </bit-container>

apps/web/src/app/auth/settings/emergency-access/emergency-access.component.html

@@ -272,7 +272,3 @@
     </ng-container>
   </bit-section>
 </bit-container>
-
-<ng-template #addEdit></ng-template>
-<ng-template #takeoverTemplate></ng-template>
-<ng-template #confirmTemplate></ng-template>

apps/web/src/app/auth/settings/emergency-access/emergency-access.component.ts

@@ -1,6 +1,6 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
-import { Component, OnInit, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
 import { lastValueFrom, Observable, firstValueFrom, switchMap } from "rxjs";
 
 import { UserNamePipe } from "@bitwarden/angular/pipes/user-name.pipe";
@@ -44,12 +44,6 @@ import {
   templateUrl: "emergency-access.component.html",
 })
 export class EmergencyAccessComponent implements OnInit {
-  @ViewChild("addEdit", { read: ViewContainerRef, static: true }) addEditModalRef: ViewContainerRef;
-  @ViewChild("takeoverTemplate", { read: ViewContainerRef, static: true })
-  takeoverModalRef: ViewContainerRef;
-  @ViewChild("confirmTemplate", { read: ViewContainerRef, static: true })
-  confirmModalRef: ViewContainerRef;
-
   loaded = false;
   canAccessPremium$: Observable<boolean>;
   trustedContacts: GranteeEmergencyAccess[];

apps/web/src/app/auth/settings/emergency-access/view/emergency-access-view.component.html

@@ -51,5 +51,3 @@
     <span class="tw-sr-only">{{ "loading" | i18n }}</span>
   </ng-container>
 </div>
-<ng-template #cipherAddEdit></ng-template>
-<ng-template #attachments></ng-template>

apps/web/src/app/auth/settings/emergency-access/view/emergency-access-view.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
 import { ActivatedRoute, Router } from "@angular/router";
 import { firstValueFrom } from "rxjs";
 
@@ -17,7 +17,6 @@ import { EmergencyViewDialogComponent } from "./emergency-view-dialog.component"
   providers: [{ provide: CipherFormConfigService, useClass: DefaultCipherFormConfigService }],
 })
 export class EmergencyAccessViewComponent implements OnInit {
-  @ViewChild("attachments", { read: ViewContainerRef, static: true })
   id: EmergencyAccessId | null = null;
   ciphers: CipherView[] = [];
   loaded = false;

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

@@ -84,8 +84,3 @@
     </bit-item>
   </bit-item-group>
 </bit-container>
-
-<ng-template #duoTemplate></ng-template>
-<ng-template #emailTemplate></ng-template>
-<ng-template #yubikeyTemplate></ng-template>
-<ng-template #webAuthnTemplate></ng-template>

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

@@ -1,6 +1,6 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
-import { Component, OnDestroy, OnInit, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import {
   first,
   firstValueFrom,
@@ -12,7 +12,6 @@ import {
   switchMap,
 } from "rxjs";
 
-import { ModalRef } from "@bitwarden/angular/components/modal/modal.ref";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
 import { PolicyType } from "@bitwarden/common/admin-console/enums";
@@ -52,9 +51,6 @@ import { TwoFactorVerifyComponent } from "./two-factor-verify.component";
   imports: [ItemModule, LooseComponentsModule, SharedModule],
 })
 export class TwoFactorSetupComponent implements OnInit, OnDestroy {
-  @ViewChild("yubikeyTemplate", { read: ViewContainerRef, static: true })
-  yubikeyModalRef: ViewContainerRef;
-
   organizationId: string;
   organization: Organization;
   providers: any[] = [];
@@ -62,7 +58,6 @@ export class TwoFactorSetupComponent implements OnInit, OnDestroy {
   recoveryCodeWarningMessage: string;
   showPolicyWarning = false;
   loading = true;
-  modal: ModalRef;
   formPromise: Promise<any>;
 
   tabbedHeader = true;
@@ -283,9 +278,6 @@ export class TwoFactorSetupComponent implements OnInit, OnDestroy {
   }
 
   protected updateStatus(enabled: boolean, type: TwoFactorProviderType) {
-    if (!enabled && this.modal != null) {
-      this.modal.close();
-    }
     this.providers.forEach((p) => {
       if (p.type === type && enabled !== undefined) {
         p.enabled = enabled;

apps/web/src/app/dirt/reports/pages/cipher-report.component.ts

@@ -1,6 +1,6 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
-import { Directive, ViewChild, ViewContainerRef, OnDestroy } from "@angular/core";
+import { Directive, OnDestroy } from "@angular/core";
 import {
   BehaviorSubject,
   lastValueFrom,
@@ -37,8 +37,6 @@ import { AdminConsoleCipherFormConfigService } from "../../../vault/org-vault/se
 
 @Directive()
 export class CipherReportComponent implements OnDestroy {
-  @ViewChild("cipherAddEdit", { read: ViewContainerRef, static: true })
-  cipherAddEditModalRef: ViewContainerRef;
   isAdminConsoleActive = false;
 
   loading = false;

apps/web/src/app/dirt/reports/pages/exposed-passwords-report.component.html

@@ -96,5 +96,4 @@
       </bit-table-scroll>
     </ng-container>
   </div>
-  <ng-template #cipherAddEdit></ng-template>
 </bit-container>

apps/web/src/app/dirt/reports/pages/inactive-two-factor-report.component.html

@@ -108,5 +108,4 @@
       >
     </ng-container>
   </div>
-  <ng-template #cipherAddEdit></ng-template>
 </bit-container>

apps/web/src/app/dirt/reports/pages/reused-passwords-report.component.html

@@ -98,5 +98,4 @@
       </bit-table-scroll>
     </ng-container>
   </div>
-  <ng-template #cipherAddEdit></ng-template>
 </bit-container>

apps/web/src/app/dirt/reports/pages/unsecured-websites-report.component.html

@@ -96,5 +96,4 @@
       </bit-table>
     </ng-container>
   </div>
-  <ng-template #cipherAddEdit></ng-template>
 </bit-container>

apps/web/src/app/dirt/reports/pages/weak-passwords-report.component.html

@@ -100,5 +100,4 @@
       </bit-table-scroll>
     </ng-container>
   </div>
-  <ng-template #cipherAddEdit></ng-template>
 </bit-container>

apps/web/src/app/tools/send/send.component.html

@@ -206,4 +206,3 @@
     </div>
   </div>
 </div>
-<ng-template #sendAddEdit></ng-template>

apps/web/src/app/vault/individual-vault/folder-add-edit.component.html

@@ -13,7 +13,7 @@
       <button bitButton buttonType="primary" bitFormButton type="submit">
         <span>{{ "save" | i18n }}</span>
       </button>
-      <button bitButton buttonType="secondary" bitDialogClose type="button" data-dismiss="modal">
+      <button bitButton buttonType="secondary" bitDialogClose type="button">
         {{ "cancel" | i18n }}
       </button>
       <div class="tw-m-0 tw-ml-auto">

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

@@ -84,10 +84,3 @@
     </div>
   </div>
 </div>
-
-<ng-template #attachments></ng-template>
-<ng-template #folderAddEdit></ng-template>
-<ng-template #cipherAddEdit></ng-template>
-<ng-template #share></ng-template>
-<ng-template #collectionsModal></ng-template>
-<ng-template #updateKeyTemplate></ng-template>

bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.html

@@ -57,9 +57,6 @@
               bitMenuItem
               buttonType="secondary"
               type="button"
-              data-toggle="dropdown"
-              aria-haspopup="true"
-              aria-expanded="false"
               appA11yTitle="{{ 'options' | i18n }}"
             >
               <i class="bwi bwi-cog bwi-lg" aria-hidden="true"></i>

libs/components/src/breadcrumbs/breadcrumbs.component.html

@@ -36,7 +36,6 @@
     bitIconButton="bwi-ellipsis-h"
     [bitMenuTriggerFor]="overflowMenu"
     size="small"
-    aria-haspopup
   ></button>
   <bit-menu #overflowMenu>
     @for (breadcrumb of overflow; track breadcrumb) {