[PM-8490] - Add generate password to password-protected export (#10539)

* WIP generate password in export vault

* finish generate password in export component

* use bitIconButton directive

* add copy link to file password input

* change copy password message

libs/tools/export/vault-export/vault-export-ui/src/components/export.component.html

@@ -74,6 +74,21 @@
             bitPasswordInputToggle
             [(toggled)]="showFilePassword"
           ></button>
+          <button
+            type="button"
+            bitIconButton="bwi-generate"
+            appStopClick
+            bitSuffix
+            (click)="generatePassword()"
+          ></button>
+          <button
+            type="button"
+            bitIconButton="bwi-clone"
+            [disabled]="!filePassword"
+            appStopClick
+            bitSuffix
+            (click)="copyPasswordToClipboard()"
+          ></button>
           <bit-hint>{{ "exportPasswordDescription" | i18n }}</bit-hint>
         </bit-form-field>
         <tools-password-strength [password]="filePassword" [showText]="true">

libs/tools/export/vault-export/vault-export-ui/src/components/export.component.ts

@@ -24,6 +24,7 @@ import { EventType } from "@bitwarden/common/enums";
 import { FileDownloadService } from "@bitwarden/common/platform/abstractions/file-download/file-download.service";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
+import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { Utils } from "@bitwarden/common/platform/misc/utils";
 import { CollectionService } from "@bitwarden/common/vault/abstractions/collection.service";
 import {
@@ -38,6 +39,7 @@ import {
   SelectModule,
   ToastService,
 } from "@bitwarden/components";
+import { PasswordGenerationServiceAbstraction } from "@bitwarden/generator-legacy";
 import { VaultExportServiceAbstraction } from "@bitwarden/vault-export-core";
 
 import { EncryptedExportType } from "../enums/encrypted-export-type.enum";
@@ -157,6 +159,8 @@ export class ExportComponent implements OnInit, OnDestroy, AfterViewInit {
     protected toastService: ToastService,
     protected exportService: VaultExportServiceAbstraction,
     protected eventCollectionService: EventCollectionService,
+    protected passwordGenerationService: PasswordGenerationServiceAbstraction,
+    private platformUtilsService: PlatformUtilsService,
     private policyService: PolicyService,
     private logService: LogService,
     private formBuilder: UntypedFormBuilder,
@@ -272,6 +276,22 @@ export class ExportComponent implements OnInit, OnDestroy, AfterViewInit {
     }
   }
 
+  generatePassword = async () => {
+    const [options] = await this.passwordGenerationService.getOptions();
+    this.filePasswordValue = await this.passwordGenerationService.generatePassword(options);
+    this.exportForm.get("filePassword").setValue(this.filePasswordValue);
+    this.exportForm.get("confirmFilePassword").setValue(this.filePasswordValue);
+  };
+
+  copyPasswordToClipboard = async () => {
+    this.platformUtilsService.copyToClipboard(this.filePasswordValue);
+    this.toastService.showToast({
+      variant: "success",
+      title: null,
+      message: this.i18nService.t("valueCopied", this.i18nService.t("password")),
+    });
+  };
+
   submit = async () => {
     if (this.isFileEncryptedExport && this.filePassword != this.confirmFilePassword) {
       this.toastService.showToast({