[PM-5085] Create InputPasswordComponent (#9630)

* setup for InputPasswordComponent and basic story

* add all input fields

* add translated error messages

* update validation

* add password-callout

* update hint text

* use PolicyService in component

* setup SetPasswordComponent

* remove div

* add default button text

* add mocks for InputPassword storybook

* simplify ngOnInit

* change param and use PolicyApiService

* check for breaches and validate against policy

* user toastService

* use useValue for mocks

* hash before emitting

* validation cleanup and use PreloadedEnglishI18nModule

* add ngOnDestroy

* create validateFormInputsDoNotMatch fn

* update validateFormInputsComparison and add deprecation jsdocs

* rename validator fn

* fix bugs in validation fn

* cleanup and re-introduce services/logic

* toggle password inputs together

* update hint help text

* remove SetPassword test

* remove master key creation / hashing

* add translations to browser/desktop

* mock basic password-strength functionality

* add check for controls

* hash before emitting

* type the EventEmitter

* use DEFAULT_KDF_CONFIG

* emit master key

* clarify comment

* update password mininum help text to match org policy requirement

libs/angular/src/auth/validators/inputs-field-match.validator.ts

@@ -1,9 +1,13 @@
-import { AbstractControl, UntypedFormGroup, ValidatorFn } from "@angular/forms";
+import { AbstractControl, UntypedFormGroup, ValidationErrors, ValidatorFn } from "@angular/forms";
 
 import { FormGroupControls } from "../../platform/abstractions/form-validation-errors.service";
 
 export class InputsFieldMatch {
-  //check to ensure two fields do not have the same value
+  /**
+   *  Check to ensure two fields do not have the same value
+   *
+   * @deprecated Use compareInputs() instead
+   */
   static validateInputsDoesntMatch(matchTo: string, errorMessage: string): ValidatorFn {
     return (control: AbstractControl) => {
       if (control.parent && control.parent.controls) {
@@ -37,7 +41,18 @@ export class InputsFieldMatch {
     };
   }
 
-  //checks the formGroup if two fields have the same value and validation is controlled from either field
+  /**
+   * Checks the formGroup if two fields have the same value and validation is controlled from either field
+   *
+   * @deprecated
+   * Use compareInputs() instead.
+   *
+   * For more info on deprecation
+   * - Do not use untyped `options` object in formBuilder.group() {@link https://angular.dev/api/forms/UntypedFormBuilder}
+   * - Use formBuilder.group() overload with AbstractControlOptions type instead {@link https://angular.dev/api/forms/AbstractControlOptions}
+   *
+   * Remove this method after deprecated instances are replaced
+   */
   static validateFormInputsMatch(field: string, fieldMatchTo: string, errorMessage: string) {
     return (formGroup: UntypedFormGroup) => {
       const fieldCtrl = formGroup.controls[field];
@@ -54,4 +69,99 @@ export class InputsFieldMatch {
       }
     };
   }
+
+  /**
+   * Checks whether two form controls do or do not have the same input value (except for empty string values).
+   *
+   * - Validation is controlled from either form control.
+   * - The error message is displayed under controlB by default, but can be set to controlA.
+   *
+   * @param validationGoal Whether you want to verify that the form control input values match or do not match
+   * @param controlNameA The name of the first form control to compare.
+   * @param controlNameB The name of the second form control to compare.
+   * @param errorMessage The error message to display if there is an error. This will probably
+   *                     be an i18n translated string.
+   * @param showErrorOn The control under which you want to display the error (default is controlB).
+   */
+  static compareInputs(
+    validationGoal: "match" | "doNotMatch",
+    controlNameA: string,
+    controlNameB: string,
+    errorMessage: string,
+    showErrorOn: "controlA" | "controlB" = "controlB",
+  ): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      const controlA = control.get(controlNameA);
+      const controlB = control.get(controlNameB);
+
+      if (!controlA || !controlB) {
+        return null;
+      }
+
+      const controlThatShowsError = showErrorOn === "controlA" ? controlA : controlB;
+
+      // Don't compare empty strings
+      if (controlA.value === "" && controlB.value === "") {
+        return pass();
+      }
+
+      const controlValuesMatch = controlA.value === controlB.value;
+
+      if (validationGoal === "match") {
+        if (controlValuesMatch) {
+          return pass();
+        } else {
+          return fail();
+        }
+      }
+
+      if (validationGoal === "doNotMatch") {
+        if (!controlValuesMatch) {
+          return pass();
+        } else {
+          return fail();
+        }
+      }
+
+      return null; // default return
+
+      function fail() {
+        controlThatShowsError.setErrors({
+          // Preserve any pre-existing errors
+          ...controlThatShowsError.errors,
+          // Add new inputMatchError
+          inputMatchError: {
+            message: errorMessage,
+          },
+        });
+
+        return {
+          inputMatchError: {
+            message: errorMessage,
+          },
+        };
+      }
+
+      function pass(): null {
+        // Get the current errors object
+        const errorsObj = controlThatShowsError?.errors;
+
+        if (errorsObj != null) {
+          // Remove any inputMatchError if it exists, since that is the sole error we are targeting with this validator
+          if (errorsObj?.inputMatchError) {
+            delete errorsObj.inputMatchError;
+          }
+
+          // Check if the errorsObj is now empty
+          const isEmptyObj = Object.keys(errorsObj).length === 0;
+
+          // If the errorsObj is empty, set errors to null, otherwise set the errors to an object of pre-existing errors (other than inputMatchError)
+          controlThatShowsError.setErrors(isEmptyObj ? null : errorsObj);
+        }
+
+        // Return null for this validator
+        return null;
+      }
+    };
+  }
 }