[PM-24232] - [Defect][Web] Admin Console - SSH key and Folder should not show as options from New button (#15834)

* properly call input functions

* don't enable sshkey form

* fix logic for disabling cipher form

* prefer use of observable

* use destroyRef. change to enabled status only

apps/web/src/app/vault/individual-vault/vault-header/vault-header.component.html

@@ -78,6 +78,7 @@
     <vault-new-cipher-menu
       [canCreateCipher]="true"
       [canCreateFolder]="true"
+      [canCreateSshKey]="true"
       [canCreateCollection]="canCreateCollections"
       (cipherAdded)="addCipher($event)"
       (folderAdded)="addFolder()"

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

@@ -1,5 +1,7 @@
 // FIXME: Update this file to be type safe and remove this and next line
 // @ts-strict-ignore
+import { Observable } from "rxjs";
+
 import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
 import { CipherFormConfig } from "@bitwarden/vault";
 
@@ -74,4 +76,10 @@ export abstract class CipherFormContainer {
   abstract disableFormFields(): void;
 
   abstract enableFormFields(): void;
+
+  /**
+   * An observable that emits when the form status changes to enabled.
+   * This can be used to disable child forms when the parent form is enabled.
+   */
+  formEnabled$: Observable<void>;
 }

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<void>();
+  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();
   }
 
   /**

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 */

libs/vault/src/components/new-cipher-menu/new-cipher-menu.component.html

@@ -1,4 +1,4 @@
-<ng-container *ngIf="canCreateCipher || canCreateCollection || canCreateFolder">
+<ng-container *ngIf="canCreateCipher() || canCreateCollection() || canCreateFolder()">
   <div>
     <button
       bitButton
@@ -18,13 +18,13 @@
           {{ item.labelKey | i18n }}
         </button>
       }
-      <bit-menu-divider *ngIf="canCreateCipher"></bit-menu-divider>
+      <bit-menu-divider *ngIf="canCreateCipher()"></bit-menu-divider>
-      <button *ngIf="canCreateFolder" type="button" bitMenuItem (click)="folderAdded.emit()">
+      <button *ngIf="canCreateFolder()" type="button" bitMenuItem (click)="folderAdded.emit()">
         <i class="bwi bwi-fw bwi-folder" aria-hidden="true"></i>
         {{ "folder" | i18n }}
       </button>
       <button
-        *ngIf="canCreateCollection"
+        *ngIf="canCreateCollection()"
         type="button"
         bitMenuItem
         (click)="collectionAdded.emit()"

libs/vault/src/components/new-cipher-menu/new-cipher-menu.component.ts

@@ -18,6 +18,7 @@ export class NewCipherMenuComponent {
   canCreateCipher = input(false);
   canCreateFolder = input(false);
   canCreateCollection = input(false);
+  canCreateSshKey = input(false);
   folderAdded = output();
   collectionAdded = output();
   cipherAdded = output<CipherType>();
@@ -30,6 +31,9 @@ export class NewCipherMenuComponent {
   cipherMenuItems$ = this.restrictedItemTypesService.restricted$.pipe(
     map((restrictedTypes) => {
       return CIPHER_MENU_ITEMS.filter((item) => {
+        if (!this.canCreateSshKey() && item.type === CipherType.SshKey) {
+          return false;
+        }
         return !restrictedTypes.some((restrictedType) => restrictedType.cipherType === item.type);
       });
     }),