[fix] Pull org admin vault collections directly from the API

src/app/modules/vault-filter/organization-vault-filter.component.ts

@@ -0,0 +1,24 @@
+import { Component } from "@angular/core";
+
+import { Organization } from "jslib-common/models/domain/organization";
+
+import { VaultFilterComponent } from "./vault-filter.component";
+
+@Component({
+  selector: "app-organization-vault-filter",
+  templateUrl: "vault-filter.component.html",
+})
+export class OrganizationVaultFilterComponent extends VaultFilterComponent {
+  organization: Organization;
+
+  async initCollections() {
+    if (this.organization.canEditAnyCollection) {
+      return await this.vaultFilterService.buildAdminCollections(this.organization.id);
+    }
+    return await this.vaultFilterService.buildCollections(this.organization.id);
+  }
+
+  async reloadCollectionsAndFolders() {
+    this.collections = await this.initCollections();
+  }
+}

src/app/modules/vault-filter/vault-filter.component.ts

@@ -1,8 +1,8 @@
 import { Component, EventEmitter, Input, Output } from "@angular/core";
 
 import { VaultFilterComponent as BaseVaultFilterComponent } from "jslib-angular/modules/vault-filter/vault-filter.component";
-import { VaultFilterService } from "jslib-angular/modules/vault-filter/vault-filter.service";
-import { Organization } from "jslib-common/models/domain/organization";
+
+import { VaultFilterService } from "./vault-filter.service";
 
 @Component({
   selector: "app-vault-filter",
@@ -18,17 +18,11 @@ export class VaultFilterComponent extends BaseVaultFilterComponent {
   searchPlaceholder: string;
   searchText = "";
 
-  organization: Organization;
-
-  constructor(vaultFilterService: VaultFilterService) {
+  constructor(protected vaultFilterService: VaultFilterService) {
     super(vaultFilterService);
   }
 
   searchTextChanged() {
     this.onSearchTextChanged.emit(this.searchText);
   }
-
-  async initCollections() {
-    return await this.vaultFilterService.buildCollections(this.organization?.id);
-  }
 }

src/app/modules/vault-filter/vault-filter.module.ts

@@ -1,13 +1,5 @@
 import { NgModule } from "@angular/core";
 
-import { VaultFilterService } from "jslib-angular/modules/vault-filter/vault-filter.service";
-import { CipherService } from "jslib-common/abstractions/cipher.service";
-import { CollectionService } from "jslib-common/abstractions/collection.service";
-import { FolderService } from "jslib-common/abstractions/folder.service";
-import { OrganizationService } from "jslib-common/abstractions/organization.service";
-import { PolicyService } from "jslib-common/abstractions/policy.service";
-import { StateService } from "jslib-common/abstractions/state.service";
-
 import { SharedModule } from "../shared.module";
 
 import { CollectionFilterComponent } from "./components/collection-filter.component";
@@ -16,7 +8,9 @@ import { OrganizationFilterComponent } from "./components/organization-filter.co
 import { OrganizationOptionsComponent } from "./components/organization-options.component";
 import { StatusFilterComponent } from "./components/status-filter.component";
 import { TypeFilterComponent } from "./components/type-filter.component";
+import { OrganizationVaultFilterComponent } from "./organization-vault-filter.component";
 import { VaultFilterComponent } from "./vault-filter.component";
+import { VaultFilterService } from "./vault-filter.service";
 
 @NgModule({
   imports: [SharedModule],
@@ -28,21 +22,9 @@ import { VaultFilterComponent } from "./vault-filter.component";
     OrganizationOptionsComponent,
     StatusFilterComponent,
     TypeFilterComponent,
+    OrganizationVaultFilterComponent,
   ],
-  exports: [VaultFilterComponent],
-  providers: [
-    {
-      provide: VaultFilterService,
-      useClass: VaultFilterService,
-      deps: [
-        StateService,
-        OrganizationService,
-        FolderService,
-        CipherService,
-        CollectionService,
-        PolicyService,
-      ],
-    },
-  ],
+  exports: [VaultFilterComponent, OrganizationVaultFilterComponent],
+  providers: [VaultFilterService],
 })
 export class VaultFilterModule {}

src/app/modules/vault-filter/vault-filter.service.ts

@@ -1,3 +1,54 @@
-import { VaultFilterService as BaseVaultFilterService } from "jslib-angular/modules/vault-filter/vault-filter.service";
+import { Injectable } from "@angular/core";
 
-export class VaultFilterService extends BaseVaultFilterService {}
+import { DynamicTreeNode } from "jslib-angular/modules/vault-filter/models/dynamic-tree-node.model";
+import { VaultFilterService as BaseVaultFilterService } from "jslib-angular/modules/vault-filter/vault-filter.service";
+import { ApiService } from "jslib-common/abstractions/api.service";
+import { CipherService } from "jslib-common/abstractions/cipher.service";
+import { CollectionService } from "jslib-common/abstractions/collection.service";
+import { FolderService } from "jslib-common/abstractions/folder.service";
+import { OrganizationService } from "jslib-common/abstractions/organization.service";
+import { PolicyService } from "jslib-common/abstractions/policy.service";
+import { StateService } from "jslib-common/abstractions/state.service";
+import { CollectionData } from "jslib-common/models/data/collectionData";
+import { Collection } from "jslib-common/models/domain/collection";
+import { CollectionDetailsResponse } from "jslib-common/models/response/collectionResponse";
+import { CollectionView } from "jslib-common/models/view/collectionView";
+
+@Injectable()
+export class VaultFilterService extends BaseVaultFilterService {
+  constructor(
+    protected stateService: StateService,
+    protected organizationService: OrganizationService,
+    protected folderService: FolderService,
+    protected cipherService: CipherService,
+    protected collectionService: CollectionService,
+    protected policyService: PolicyService,
+    protected apiService: ApiService
+  ) {
+    super(
+      stateService,
+      organizationService,
+      folderService,
+      cipherService,
+      collectionService,
+      policyService
+    );
+  }
+
+  async buildAdminCollections(organizationId: string) {
+    let result: CollectionView[] = [];
+    const collectionResponse = await this.apiService.getCollections(organizationId);
+    if (collectionResponse?.data != null && collectionResponse.data.length) {
+      const collectionDomains = collectionResponse.data.map(
+        (r: CollectionDetailsResponse) => new Collection(new CollectionData(r))
+      );
+      result = await this.collectionService.decryptMany(collectionDomains);
+    }
+
+    const nestedCollections = await this.collectionService.getAllNested(result);
+    return new DynamicTreeNode<CollectionView>({
+      fullList: result,
+      nestedList: nestedCollections,
+    });
+  }
+}

src/app/modules/vault/modules/organization-vault/organization-vault.component.html

@@ -4,7 +4,7 @@
       <div class="groupings">
         <div class="content">
           <div class="inner-content">
-            <app-vault-filter
+            <app-organization-vault-filter
               #vaultFilter
               [showFolders]="false"
               [showFavorites]="false"
@@ -12,7 +12,7 @@
               [showOrgFilter]="false"
               (onFilterChange)="applyVaultFilter($event)"
               (onSearchTextChanged)="filterSearchText($event)"
-            ></app-vault-filter>
+            ></app-organization-vault-filter>
           </div>
         </div>
       </div>

src/app/modules/vault/modules/organization-vault/organization-vault.component.ts

@@ -29,7 +29,7 @@ import { AddEditComponent } from "../../../../organizations/vault/add-edit.compo
 import { AttachmentsComponent } from "../../../../organizations/vault/attachments.component";
 import { CiphersComponent } from "../../../../organizations/vault/ciphers.component";
 import { CollectionsComponent } from "../../../../organizations/vault/collections.component";
-import { VaultFilterComponent } from "../../../vault-filter/vault-filter.component";
+import { OrganizationVaultFilterComponent } from "../../../vault-filter/organization-vault-filter.component";
 import { VaultService } from "../../vault.service";
 
 const BroadcasterSubscriptionId = "OrgVaultComponent";
@@ -39,7 +39,8 @@ const BroadcasterSubscriptionId = "OrgVaultComponent";
   templateUrl: "organization-vault.component.html",
 })
 export class OrganizationVaultComponent implements OnInit, OnDestroy {
-  @ViewChild("vaultFilter", { static: true }) vaultFilterComponent: VaultFilterComponent;
+  @ViewChild("vaultFilter", { static: true })
+  vaultFilterComponent: OrganizationVaultFilterComponent;
   @ViewChild(CiphersComponent, { static: true }) ciphersComponent: CiphersComponent;
   @ViewChild("attachments", { read: ViewContainerRef, static: true })
   attachmentsModalRef: ViewContainerRef;
@@ -57,6 +58,11 @@ export class OrganizationVaultComponent implements OnInit, OnDestroy {
   trashCleanupWarning: string = null;
   activeFilter: VaultFilter = new VaultFilter();
 
+  // This is a hack to avoid redundant api calls that fetch OrganizationVaultFilterComponent collections
+  // When it makes sense to do so we should leverage some other communication method for change events that isn't directly tied to the query param for organizationId
+  // i.e. exposing the VaultFiltersService to the OrganizationSwitcherComponent to make relevant updates from a change event instead of just depending on the router
+  skipFilterCollectionRefresh = true;
+
   constructor(
     private route: ActivatedRoute,
     private organizationService: OrganizationService,
@@ -95,11 +101,7 @@ export class OrganizationVaultComponent implements OnInit, OnDestroy {
                 case "syncCompleted":
                   if (message.successfully) {
                     await Promise.all([
-                      this.vaultFilterComponent.reloadCollectionsAndFolders(
-                        new VaultFilter({
-                          selectedOrganizationId: this.organization.id,
-                        } as Partial<VaultFilter>)
-                      ),
+                      this.vaultFilterComponent.reloadCollectionsAndFolders(),
                       this.ciphersComponent.refresh(),
                     ]);
                     this.changeDetectorRef.detectChanges();
@@ -109,9 +111,12 @@ export class OrganizationVaultComponent implements OnInit, OnDestroy {
             });
           });
         }
-        await this.vaultFilterComponent.reloadCollectionsAndFolders(
-          new VaultFilter({ selectedOrganizationId: this.organization.id } as Partial<VaultFilter>)
-        );
+
+        if (!this.skipFilterCollectionRefresh) {
+          await this.vaultFilterComponent.reloadCollectionsAndFolders();
+        }
+        this.skipFilterCollectionRefresh = false;
+
         await this.ciphersComponent.reload();
 
         if (qParams.viewEvents != null) {