diff --git a/apps/web/src/app/vault/individual-vault/vault-header/vault-header.component.html b/apps/web/src/app/vault/individual-vault/vault-header/vault-header.component.html index 413b4792f4e..02a7a2b12ff 100644 --- a/apps/web/src/app/vault/individual-vault/vault-header/vault-header.component.html +++ b/apps/web/src/app/vault/individual-vault/vault-header/vault-header.component.html @@ -78,6 +78,7 @@ ; } diff --git a/libs/vault/src/cipher-form/components/cipher-form.component.ts b/libs/vault/src/cipher-form/components/cipher-form.component.ts index 47ab9977f64..6b0f9929464 100644 --- a/libs/vault/src/cipher-form/components/cipher-form.component.ts +++ b/libs/vault/src/cipher-form/components/cipher-form.component.ts @@ -112,6 +112,12 @@ export class CipherFormComponent implements AfterViewInit, OnInit, OnChanges, Ci @Output() formReady = this.formReadySubject.asObservable(); + /** + * Emitted when the form is enabled + */ + private formEnabledSubject = new Subject(); + formEnabled$ = this.formEnabledSubject.asObservable(); + /** * The original cipher being edited or cloned. Null for add mode. */ @@ -156,6 +162,7 @@ export class CipherFormComponent implements AfterViewInit, OnInit, OnChanges, Ci enableFormFields(): void { this.cipherForm.enable({ emitEvent: false }); + this.formEnabledSubject.next(); } /** diff --git a/libs/vault/src/cipher-form/components/sshkey-section/sshkey-section.component.ts b/libs/vault/src/cipher-form/components/sshkey-section/sshkey-section.component.ts index 71f85e0e1b3..f83f93267c9 100644 --- a/libs/vault/src/cipher-form/components/sshkey-section/sshkey-section.component.ts +++ b/libs/vault/src/cipher-form/components/sshkey-section/sshkey-section.component.ts @@ -1,7 +1,7 @@ // FIXME: Update this file to be type safe and remove this and next line // @ts-strict-ignore import { CommonModule } from "@angular/common"; -import { Component, Input, OnInit } from "@angular/core"; +import { Component, DestroyRef, inject, Input, OnInit } from "@angular/core"; import { takeUntilDestroyed } from "@angular/core/rxjs-interop"; import { FormBuilder, ReactiveFormsModule } from "@angular/forms"; import { firstValueFrom } from "rxjs"; @@ -60,6 +60,7 @@ export class SshKeySectionComponent implements OnInit { }); showImport = false; + private destroyRef = inject(DestroyRef); constructor( private cipherFormContainer: CipherFormContainer, @@ -94,6 +95,12 @@ export class SshKeySectionComponent implements OnInit { if (this.platformUtilsService.getClientType() !== ClientType.Web) { this.showImport = true; } + + // Disable the form if the cipher form container is enabled + // to prevent user interaction + this.cipherFormContainer.formEnabled$ + .pipe(takeUntilDestroyed(this.destroyRef)) + .subscribe(() => this.sshKeyForm.disable()); } /** Set form initial form values from the current cipher */ diff --git a/libs/vault/src/components/new-cipher-menu/new-cipher-menu.component.html b/libs/vault/src/components/new-cipher-menu/new-cipher-menu.component.html index 38b5875a605..00cfa701529 100644 --- a/libs/vault/src/components/new-cipher-menu/new-cipher-menu.component.html +++ b/libs/vault/src/components/new-cipher-menu/new-cipher-menu.component.html @@ -1,4 +1,4 @@ - +