Vault Strict Typing cleanup (#12512)

* remove strict types from `NewDeviceVerificationNotice`
- Add null default value for class properties
- Enforce that the userId is passed
- noticeState$ can return null

* remove strict types from `CopyCipherFieldService`
- refactor title to be a string rather than null

* remove strict types from `PasswordRepromptComponent`
- add guard to exit early on submit but also solves removing null/undefined from typing

* use bang to ensure required input

* remove strict types from `CopyCipherFieldDirective`
- add bang for required types
- add default values for null types

* add bang for constant variables in cipher form stories

* remove strict types from `DeleteAttachmentComponent`
- add bang for required types
- refactor title to be an empty string

* fix tests

libs/vault/src/cipher-form/cipher-form.stories.ts

@@ -1,5 +1,3 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { importProvidersFrom } from "@angular/core";
 import { action } from "@storybook/addon-actions";
 import {
@@ -234,7 +232,7 @@ export const Edit: Story = {
     config: {
       ...defaultConfig,
       mode: "edit",
-      originalCipher: defaultConfig.originalCipher,
+      originalCipher: defaultConfig.originalCipher!,
     },
   },
 };
@@ -245,7 +243,7 @@ export const PartialEdit: Story = {
     config: {
       ...defaultConfig,
       mode: "partial-edit",
-      originalCipher: defaultConfig.originalCipher,
+      originalCipher: defaultConfig.originalCipher!,
     },
   },
 };
@@ -256,7 +254,7 @@ export const Clone: Story = {
     config: {
       ...defaultConfig,
       mode: "clone",
-      originalCipher: defaultConfig.originalCipher,
+      originalCipher: defaultConfig.originalCipher!,
     },
   },
 };
@@ -269,7 +267,7 @@ export const NoPersonalOwnership: Story = {
       mode: "add",
       allowPersonalOwnership: false,
       originalCipher: defaultConfig.originalCipher,
-      organizations: defaultConfig.organizations,
+      organizations: defaultConfig.organizations!,
     },
   },
 };

libs/vault/src/cipher-form/components/attachments/delete-attachment/delete-attachment.component.spec.ts

@@ -98,7 +98,7 @@ describe("DeleteAttachmentComponent", () => {
 
     expect(showToast).toHaveBeenCalledWith({
       variant: "success",
-      title: null,
+      title: "",
       message: "deletedAttachment",
     });
   });

libs/vault/src/cipher-form/components/attachments/delete-attachment/delete-attachment.component.ts

@@ -1,5 +1,3 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { CommonModule } from "@angular/common";
 import { Component, EventEmitter, Input, Output } from "@angular/core";
 
@@ -24,10 +22,10 @@ import {
 })
 export class DeleteAttachmentComponent {
   /** Id of the cipher associated with the attachment */
-  @Input({ required: true }) cipherId: string;
+  @Input({ required: true }) cipherId!: string;
 
   /** The attachment that is can be deleted */
-  @Input({ required: true }) attachment: AttachmentView;
+  @Input({ required: true }) attachment!: AttachmentView;
 
   /** Emits when the attachment is successfully deleted */
   @Output() onDeletionSuccess = new EventEmitter<void>();
@@ -56,7 +54,7 @@ export class DeleteAttachmentComponent {
 
       this.toastService.showToast({
         variant: "success",
-        title: null,
+        title: "",
         message: this.i18nService.t("deletedAttachment"),
       });
 

libs/vault/src/components/copy-cipher-field.directive.ts

@@ -1,5 +1,3 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { Directive, HostBinding, HostListener, Input, OnChanges, Optional } from "@angular/core";
 
 import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
@@ -28,9 +26,9 @@ export class CopyCipherFieldDirective implements OnChanges {
     alias: "appCopyField",
     required: true,
   })
-  action: Exclude<CopyAction, "hiddenField">;
+  action!: Exclude<CopyAction, "hiddenField">;
 
-  @Input({ required: true }) cipher: CipherView;
+  @Input({ required: true }) cipher!: CipherView;
 
   constructor(
     private copyCipherFieldService: CopyCipherFieldService,
@@ -52,7 +50,7 @@ export class CopyCipherFieldDirective implements OnChanges {
   @HostListener("click")
   async copy() {
     const value = this.getValueToCopy();
-    await this.copyCipherFieldService.copy(value, this.action, this.cipher);
+    await this.copyCipherFieldService.copy(value ?? "", this.action, this.cipher);
   }
 
   async ngOnChanges() {
@@ -69,7 +67,7 @@ export class CopyCipherFieldDirective implements OnChanges {
 
     // If the directive is used on a menu item, update the menu item to prevent keyboard navigation
     if (this.menuItemDirective) {
-      this.menuItemDirective.disabled = this.disabled;
+      this.menuItemDirective.disabled = this.disabled ?? false;
     }
   }
 

libs/vault/src/components/org-icon.directive.ts

@@ -1,5 +1,3 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { Directive, ElementRef, HostBinding, Input, Renderer2 } from "@angular/core";
 
 import { ProductTierType } from "@bitwarden/common/billing/enums";
@@ -11,7 +9,7 @@ export type OrgIconSize = "default" | "small" | "large";
   selector: "[appOrgIcon]",
 })
 export class OrgIconDirective {
-  @Input({ required: true }) tierType: ProductTierType;
+  @Input({ required: true }) tierType!: ProductTierType;
   @Input() size?: OrgIconSize = "default";
 
   constructor(

libs/vault/src/components/password-reprompt.component.ts

@@ -1,5 +1,3 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { DialogRef } from "@angular/cdk/dialog";
 import { Component } from "@angular/core";
 import { FormBuilder, ReactiveFormsModule, Validators } from "@angular/forms";
@@ -51,6 +49,12 @@ export class PasswordRepromptComponent {
   ) {}
 
   submit = async () => {
+    // Exit early when a master password is not provided.
+    // The form field required error will be shown to users in these cases.
+    if (!this.formGroup.value.masterPassword) {
+      return;
+    }
+
     const userId = await firstValueFrom(this.accountService.activeAccount$.pipe(map((a) => a?.id)));
 
     if (userId == null) {

libs/vault/src/services/copy-cipher-field.service.spec.ts

@@ -76,7 +76,7 @@ describe("CopyCipherFieldService", () => {
       expect(toastService.showToast).toHaveBeenCalledWith({
         variant: "success",
         message: "Username copied",
-        title: null,
+        title: "",
       });
       expect(i18nService.t).toHaveBeenCalledWith("username");
       expect(i18nService.t).toHaveBeenCalledWith("valueCopied", "Username");

libs/vault/src/services/copy-cipher-field.service.ts

@@ -1,5 +1,3 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { Injectable } from "@angular/core";
 import { firstValueFrom } from "rxjs";
 
@@ -131,7 +129,7 @@ export class CopyCipherFieldService {
     this.toastService.showToast({
       variant: "success",
       message: this.i18nService.t("valueCopied", this.i18nService.t(action.typeI18nKey)),
-      title: null,
+      title: "",
     });
 
     if (action.event !== undefined) {

libs/vault/src/services/new-device-verification-notice.service.ts

@@ -1,5 +1,3 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
 import { Injectable } from "@angular/core";
 import { Observable } from "rxjs";
 import { Jsonify } from "type-fest";
@@ -17,8 +15,8 @@ import { UserId } from "@bitwarden/common/types/guid";
 // If a user dismisses the notice, use "last_dismissal" to wait 7 days before re-prompting
 // permanent_dismissal will be checked if the user should never see the notice again
 export class NewDeviceVerificationNotice {
-  last_dismissal: Date;
-  permanent_dismissal: boolean;
+  last_dismissal: Date | null = null;
+  permanent_dismissal: boolean | null = null;
 
   constructor(obj: Partial<NewDeviceVerificationNotice>) {
     if (obj == null) {
@@ -52,12 +50,12 @@ export class NewDeviceVerificationNoticeService {
     return this.stateProvider.getUser(userId, NEW_DEVICE_VERIFICATION_NOTICE_KEY);
   }
 
-  noticeState$(userId: UserId): Observable<NewDeviceVerificationNotice> {
+  noticeState$(userId: UserId): Observable<NewDeviceVerificationNotice | null> {
     return this.noticeState(userId).state$;
   }
 
   async updateNewDeviceVerificationNoticeState(
-    userId: UserId | null,
+    userId: UserId,
     newState: NewDeviceVerificationNotice,
   ): Promise<void> {
     await this.noticeState(userId).update(() => {