[PM-2340] Enable use-lifecycle-interface (#5488)

Enables one of the recommended rules of @angular-eslint. Since this rule was fairly trivial to fix and has no QA effects it seemed reasonable to migrate all code.

apps/web/src/app/auth/hint.component.ts

@@ -1,4 +1,4 @@
-import { Component } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
 import { Router } from "@angular/router";
 
@@ -13,7 +13,7 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
   selector: "app-hint",
   templateUrl: "hint.component.html",
 })
-export class HintComponent extends BaseHintComponent {
+export class HintComponent extends BaseHintComponent implements OnInit {
   formGroup = this.formBuilder.group({
     email: ["", [Validators.email, Validators.required]],
   });

apps/web/src/app/auth/lock.component.ts

@@ -1,4 +1,4 @@
-import { Component, inject } from "@angular/core";
+import { Component, OnInit, inject } from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
 
 import { LockComponent as BaseLockComponent } from "@bitwarden/angular/auth/components/lock.component";
@@ -11,7 +11,7 @@ import { SharedModule } from "../shared";
   standalone: true,
   imports: [SharedModule],
 })
-export class LockComponent extends BaseLockComponent {
+export class LockComponent extends BaseLockComponent implements OnInit {
   formBuilder = inject(FormBuilder);
 
   formGroup = this.formBuilder.group({

apps/web/src/app/auth/register-form/register-form.component.ts

@@ -1,4 +1,4 @@
-import { Component, Input } from "@angular/core";
+import { Component, Input, OnInit } from "@angular/core";
 import { UntypedFormBuilder } from "@angular/forms";
 import { Router } from "@angular/router";
 
@@ -26,7 +26,7 @@ import { AcceptOrganizationInviteService } from "../organization-invite/accept-o
   selector: "app-register-form",
   templateUrl: "./register-form.component.html",
 })
-export class RegisterFormComponent extends BaseRegisterComponent {
+export class RegisterFormComponent extends BaseRegisterComponent implements OnInit {
   @Input() queryParamEmail: string;
   @Input() queryParamFromOrgInvite: boolean;
   @Input() enforcedPolicyOptions: MasterPasswordPolicyOptions;

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

@@ -1,4 +1,4 @@
-import { Component, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component, OnInit, ViewChild, ViewContainerRef } from "@angular/core";
 import { lastValueFrom } from "rxjs";
 
 import { ModalService } from "@bitwarden/angular/services/modal.service";
@@ -14,7 +14,7 @@ import { DeleteAccountDialogComponent } from "./delete-account-dialog.component"
   selector: "app-account",
   templateUrl: "account.component.html",
 })
-export class AccountComponent {
+export class AccountComponent implements OnInit {
   @ViewChild("deauthorizeSessionsTemplate", { read: ViewContainerRef, static: true })
   deauthModalRef: ViewContainerRef;
 

apps/web/src/app/auth/settings/account/profile.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import { FormControl, FormGroup } from "@angular/forms";
 import { Subject, takeUntil } from "rxjs";
 
@@ -16,7 +16,7 @@ import { ChangeAvatarDialogComponent } from "./change-avatar-dialog.component";
   selector: "app-profile",
   templateUrl: "profile.component.html",
 })
-export class ProfileComponent implements OnInit {
+export class ProfileComponent implements OnInit, OnDestroy {
   loading = true;
   profile: ProfileResponse;
   fingerprintMaterial: string;

apps/web/src/app/auth/settings/change-password.component.ts

@@ -1,4 +1,4 @@
-import { Component } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import { Router } from "@angular/router";
 import { firstValueFrom, map } from "rxjs";
 
@@ -31,7 +31,10 @@ import { UserKeyRotationService } from "../key-rotation/user-key-rotation.servic
   selector: "app-change-password",
   templateUrl: "change-password.component.html",
 })
-export class ChangePasswordComponent extends BaseChangePasswordComponent {
+export class ChangePasswordComponent
+  extends BaseChangePasswordComponent
+  implements OnInit, OnDestroy
+{
   rotateUserKey = false;
   currentMasterPassword: string;
   masterPasswordHint: string;

apps/web/src/app/auth/settings/security/change-kdf/change-kdf.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import { FormBuilder, FormControl, ValidatorFn, Validators } from "@angular/forms";
 import { Subject, takeUntil } from "rxjs";
 
@@ -18,7 +18,7 @@ import { ChangeKdfConfirmationComponent } from "./change-kdf-confirmation.compon
   selector: "app-change-kdf",
   templateUrl: "change-kdf.component.html",
 })
-export class ChangeKdfComponent implements OnInit {
+export class ChangeKdfComponent implements OnInit, OnDestroy {
   kdfConfig: KdfConfig = DEFAULT_KDF_CONFIG;
   kdfOptions: any[] = [];
   private destroy$ = new Subject<void>();

apps/web/src/app/auth/settings/security/security.component.ts

@@ -1,4 +1,4 @@
-import { Component } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
 
 import { UserVerificationService } from "@bitwarden/common/auth/abstractions/user-verification/user-verification.service.abstraction";
 
@@ -6,7 +6,7 @@ import { UserVerificationService } from "@bitwarden/common/auth/abstractions/use
   selector: "app-security",
   templateUrl: "security.component.html",
 })
-export class SecurityComponent {
+export class SecurityComponent implements OnInit {
   showChangePassword = true;
 
   constructor(private userVerificationService: UserVerificationService) {}

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

@@ -1,5 +1,5 @@
 import { DIALOG_DATA, DialogConfig, DialogRef } from "@angular/cdk/dialog";
-import { Component, EventEmitter, Inject, Output } from "@angular/core";
+import { Component, EventEmitter, Inject, OnInit, Output } from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
 
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
@@ -19,7 +19,7 @@ import { TwoFactorBaseComponent } from "./two-factor-base.component";
   selector: "app-two-factor-duo",
   templateUrl: "two-factor-duo.component.html",
 })
-export class TwoFactorDuoComponent extends TwoFactorBaseComponent {
+export class TwoFactorDuoComponent extends TwoFactorBaseComponent implements OnInit {
   @Output() onChangeStatus: EventEmitter<boolean> = new EventEmitter();
 
   type = TwoFactorProviderType.Duo;

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

@@ -1,5 +1,5 @@
 import { DIALOG_DATA, DialogConfig, DialogRef } from "@angular/cdk/dialog";
-import { Component, EventEmitter, Inject, Output } from "@angular/core";
+import { Component, EventEmitter, Inject, OnInit, Output } from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
 import { firstValueFrom, map } from "rxjs";
 
@@ -23,7 +23,7 @@ import { TwoFactorBaseComponent } from "./two-factor-base.component";
   templateUrl: "two-factor-email.component.html",
   outputs: ["onUpdated"],
 })
-export class TwoFactorEmailComponent extends TwoFactorBaseComponent {
+export class TwoFactorEmailComponent extends TwoFactorBaseComponent implements OnInit {
   @Output() onChangeStatus: EventEmitter<boolean> = new EventEmitter();
   type = TwoFactorProviderType.Email;
   sentEmail: string;

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

@@ -1,5 +1,5 @@
 import { DIALOG_DATA, DialogConfig } from "@angular/cdk/dialog";
-import { Component, Inject } from "@angular/core";
+import { Component, Inject, OnInit } from "@angular/core";
 import { FormArray, FormBuilder, FormControl, FormGroup } from "@angular/forms";
 
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
@@ -24,7 +24,7 @@ interface Key {
   selector: "app-two-factor-yubikey",
   templateUrl: "two-factor-yubikey.component.html",
 })
-export class TwoFactorYubiKeyComponent extends TwoFactorBaseComponent {
+export class TwoFactorYubiKeyComponent extends TwoFactorBaseComponent implements OnInit {
   type = TwoFactorProviderType.Yubikey;
   keys: Key[];
   anyKeyHasNfc = false;

apps/web/src/app/auth/sso.component.ts

@@ -1,4 +1,4 @@
-import { Component } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
 import { FormControl, FormGroup, Validators } from "@angular/forms";
 import { ActivatedRoute, Router } from "@angular/router";
 import { firstValueFrom } from "rxjs";
@@ -32,7 +32,7 @@ import { PasswordGenerationServiceAbstraction } from "@bitwarden/generator-legac
   templateUrl: "sso.component.html",
 })
 // eslint-disable-next-line rxjs-angular/prefer-takeuntil
-export class SsoComponent extends BaseSsoComponent {
+export class SsoComponent extends BaseSsoComponent implements OnInit {
   protected formGroup = new FormGroup({
     identifier: new FormControl(null, [Validators.required]),
   });

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

@@ -1,6 +1,6 @@
 import { DialogModule } from "@angular/cdk/dialog";
 import { CommonModule } from "@angular/common";
-import { Component } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import { ReactiveFormsModule, FormsModule } from "@angular/forms";
 
 import { JslibModule } from "@bitwarden/angular/jslib.module";
@@ -32,7 +32,10 @@ import { TypographyModule } from "../../../../../libs/components/src/typography"
   ],
   providers: [I18nPipe],
 })
-export class TwoFactorAuthDuoComponent extends TwoFactorAuthDuoBaseComponent {
+export class TwoFactorAuthDuoComponent
+  extends TwoFactorAuthDuoBaseComponent
+  implements OnInit, OnDestroy
+{
   async ngOnInit(): Promise<void> {
     await super.ngOnInit();
   }

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

@@ -1,4 +1,4 @@
-import { Component, Inject, OnDestroy, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component, Inject, OnDestroy, OnInit, ViewChild, ViewContainerRef } from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
 import { ActivatedRoute, Router } from "@angular/router";
 import { Subject, takeUntil, lastValueFrom } from "rxjs";
@@ -36,7 +36,7 @@ import {
   templateUrl: "two-factor.component.html",
 })
 // eslint-disable-next-line rxjs-angular/prefer-takeuntil
-export class TwoFactorComponent extends BaseTwoFactorComponent implements OnDestroy {
+export class TwoFactorComponent extends BaseTwoFactorComponent implements OnInit, OnDestroy {
   @ViewChild("twoFactorOptions", { read: ViewContainerRef, static: true })
   twoFactorOptionsModal: ViewContainerRef;
   formGroup = this.formBuilder.group({

apps/web/src/app/billing/organizations/change-plan-dialog.component.ts

@@ -1,5 +1,14 @@
 import { DIALOG_DATA, DialogConfig, DialogRef } from "@angular/cdk/dialog";
-import { Component, EventEmitter, Inject, Input, OnInit, Output, ViewChild } from "@angular/core";
+import {
+  Component,
+  EventEmitter,
+  Inject,
+  Input,
+  OnDestroy,
+  OnInit,
+  Output,
+  ViewChild,
+} from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
 import { Router } from "@angular/router";
 import { Subject, takeUntil } from "rxjs";
@@ -69,7 +78,7 @@ interface OnSuccessArgs {
 @Component({
   templateUrl: "./change-plan-dialog.component.html",
 })
-export class ChangePlanDialogComponent implements OnInit {
+export class ChangePlanDialogComponent implements OnInit, OnDestroy {
   @ViewChild(PaymentComponent) paymentComponent: PaymentComponent;
   @ViewChild(TaxInfoComponent) taxComponent: TaxInfoComponent;
 

apps/web/src/app/billing/shared/tax-info.component.ts

@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, Output } from "@angular/core";
+import { Component, EventEmitter, Input, OnInit, Output } from "@angular/core";
 import { FormControl, FormGroup, Validators } from "@angular/forms";
 import { ActivatedRoute } from "@angular/router";
 import { Subject, takeUntil } from "rxjs";
@@ -31,7 +31,7 @@ type CountryList = {
   imports: [SharedModule],
 })
 // eslint-disable-next-line rxjs-angular/prefer-takeuntil
-export class TaxInfoComponent {
+export class TaxInfoComponent implements OnInit {
   @Input() trialFlow = false;
   @Output() onCountryChanged = new EventEmitter();
   private destroy$ = new Subject<void>();

apps/web/src/app/secrets-manager/secrets-manager-landing/sm-landing.component.ts

@@ -1,4 +1,4 @@
-import { Component } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
 
 import { OrganizationService } from "@bitwarden/common/admin-console/abstractions/organization/organization.service.abstraction";
 import { Organization } from "@bitwarden/common/admin-console/models/domain/organization";
@@ -13,7 +13,7 @@ import { SharedModule } from "../../shared/shared.module";
   imports: [SharedModule, SearchModule, NoItemsModule, HeaderModule],
   templateUrl: "sm-landing.component.html",
 })
-export class SMLandingComponent {
+export class SMLandingComponent implements OnInit {
   tryItNowUrl: string;
   learnMoreUrl: string = "https://bitwarden.com/help/secrets-manager-overview/";
   imageSrc: string = "../images/sm.webp";

apps/web/src/app/settings/preferences.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import { FormBuilder } from "@angular/forms";
 import { concatMap, filter, firstValueFrom, map, Observable, Subject, takeUntil, tap } from "rxjs";
 
@@ -24,7 +24,7 @@ import { DialogService } from "@bitwarden/components";
   selector: "app-preferences",
   templateUrl: "preferences.component.html",
 })
-export class PreferencesComponent implements OnInit {
+export class PreferencesComponent implements OnInit, OnDestroy {
   // For use in template
   protected readonly VaultTimeoutAction = VaultTimeoutAction;
 

apps/web/src/app/tools/send/send-access-password.component.ts

@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, Output } from "@angular/core";
+import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
 import { Subject, takeUntil } from "rxjs";
 
@@ -10,7 +10,7 @@ import { SharedModule } from "../../shared";
   imports: [SharedModule],
   standalone: true,
 })
-export class SendAccessPasswordComponent {
+export class SendAccessPasswordComponent implements OnInit, OnDestroy {
   private destroy$ = new Subject<void>();
   protected formGroup = this.formBuilder.group({
     password: ["", [Validators.required]],

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

@@ -1,4 +1,4 @@
-import { Component, NgZone, ViewChild, ViewContainerRef } from "@angular/core";
+import { Component, NgZone, ViewChild, OnInit, OnDestroy, ViewContainerRef } from "@angular/core";
 import { lastValueFrom } from "rxjs";
 
 import { SendComponent as BaseSendComponent } from "@bitwarden/angular/tools/send/send.component";
@@ -34,7 +34,7 @@ const BroadcasterSubscriptionId = "SendComponent";
   imports: [SharedModule, SearchModule, NoItemsModule, HeaderModule],
   templateUrl: "send.component.html",
 })
-export class SendComponent extends BaseSendComponent {
+export class SendComponent extends BaseSendComponent implements OnInit, OnDestroy {
   @ViewChild("sendAddEdit", { read: ViewContainerRef, static: true })
   sendAddEditModalRef: ViewContainerRef;
   noItemIcon = NoSendsIcon;

apps/web/src/app/vault/individual-vault/bulk-action-dialogs/bulk-share-dialog/bulk-share-dialog.component.ts

@@ -1,5 +1,5 @@
 import { DialogConfig, DialogRef, DIALOG_DATA } from "@angular/cdk/dialog";
-import { Component, Inject, OnInit } from "@angular/core";
+import { Component, Inject, OnDestroy, OnInit } from "@angular/core";
 
 import { OrganizationService } from "@bitwarden/common/admin-console/abstractions/organization/organization.service.abstraction";
 import { Organization } from "@bitwarden/common/admin-console/models/domain/organization";
@@ -41,7 +41,7 @@ export const openBulkShareDialog = (
 @Component({
   templateUrl: "bulk-share-dialog.component.html",
 })
-export class BulkShareDialogComponent implements OnInit {
+export class BulkShareDialogComponent implements OnInit, OnDestroy {
   ciphers: CipherView[] = [];
   organizationId: string;
 

apps/web/src/app/vault/org-vault/vault-filter/vault-filter.component.ts

@@ -1,4 +1,4 @@
-import { Component, Input, OnDestroy, OnInit, SimpleChanges } from "@angular/core";
+import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from "@angular/core";
 import { firstValueFrom, Subject } from "rxjs";
 
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
@@ -20,7 +20,10 @@ import { CollectionFilter } from "../../individual-vault/vault-filter/shared/mod
   selector: "app-organization-vault-filter",
   templateUrl: "../../individual-vault/vault-filter/components/vault-filter.component.html",
 })
-export class VaultFilterComponent extends BaseVaultFilterComponent implements OnInit, OnDestroy {
+export class VaultFilterComponent
+  extends BaseVaultFilterComponent
+  implements OnInit, OnDestroy, OnChanges
+{
   @Input() set organization(value: Organization) {
     if (value && value !== this._organization) {
       this._organization = value;