only expose state and update methods from filter service

apps/browser/src/vault/popup/components/vault-v2/vault-header/vault-header-v2.component.spec.ts

@@ -82,7 +82,8 @@ describe("VaultHeaderV2Component", () => {
             numberOfAppliedFilters$,
             filters$: new BehaviorSubject(emptyForm),
             filterForm: new FormBuilder().group(emptyForm),
-            filterVisibilityState: { state$, update },
+            filterVisibilityState$: state$,
+            updateFilterVisibility: update,
           },
         },
         {

apps/browser/src/vault/popup/components/vault-v2/vault-header/vault-header-v2.component.ts

@@ -63,7 +63,7 @@ export class VaultHeaderV2Component implements OnInit {
 
   ngOnInit(): void {
     // Get the initial visibility from stored state
-    this.vaultPopupListFiltersService.filterVisibilityState.state$
+    this.vaultPopupListFiltersService.filterVisibilityState$
       .pipe(
         first(),
         takeUntilDestroyed(this.destroyRef),
@@ -85,6 +85,6 @@ export class VaultHeaderV2Component implements OnInit {
     }
 
     this.isDisclosureShown$.next(isShown);
-    void this.vaultPopupListFiltersService.filterVisibilityState.update(() => isShown);
+    void this.vaultPopupListFiltersService.updateFilterVisibility(isShown);
   }
 }

apps/browser/src/vault/popup/services/vault-popup-list-filters.service.spec.ts

@@ -51,6 +51,9 @@ describe("VaultPopupListFiltersService", () => {
     policyAppliesToActiveUser$: jest.fn(() => policyAppliesToActiveUser$),
   };
 
+  const state$ = new BehaviorSubject<boolean>(false);
+  const update = jest.fn().mockResolvedValue(undefined);
+
   beforeEach(() => {
     memberOrganizations$.next([]);
     decryptedCollections$.next([]);
@@ -86,7 +89,7 @@ describe("VaultPopupListFiltersService", () => {
         },
         {
           provide: StateProvider,
-          useValue: { getGlobal: () => ({}) },
+          useValue: { getGlobal: () => ({ state$, update }) },
         },
         { provide: FormBuilder, useClass: FormBuilder },
       ],
@@ -470,4 +473,24 @@ describe("VaultPopupListFiltersService", () => {
       });
     });
   });
+
+  describe("filterVisibilityState", () => {
+    it("exposes stored state through filterVisibilityState$", (done) => {
+      state$.next(true);
+
+      service.filterVisibilityState$.subscribe((filterVisibility) => {
+        expect(filterVisibility).toBeTrue();
+        done();
+      });
+    });
+
+    it("updates stored filter state", async () => {
+      await service.updateFilterVisibility(false);
+
+      expect(update).toHaveBeenCalledOnce();
+      // Get callback passed to `update`
+      const updateCallback = update.mock.calls[0][0];
+      expect(updateCallback()).toBe(false);
+    });
+  });
 });

apps/browser/src/vault/popup/services/vault-popup-list-filters.service.ts

@@ -83,7 +83,7 @@ export class VaultPopupListFiltersService {
   );
 
   /** Stored state for the visibility of the filters. */
-  filterVisibilityState = this.stateProvider.getGlobal(FILTER_VISIBILITY_KEY);
+  private filterVisibilityState = this.stateProvider.getGlobal(FILTER_VISIBILITY_KEY);
 
   /**
    * Static list of ciphers views used in synchronous context
@@ -115,6 +115,9 @@ export class VaultPopupListFiltersService {
       .subscribe(this.validateOrganizationChange.bind(this));
   }
 
+  /** Stored state for the visibility of the filters. */
+  filterVisibilityState$ = this.filterVisibilityState.state$;
+
   /**
    * Observable whose value is a function that filters an array of `CipherView` objects based on the current filters
    */
@@ -352,6 +355,11 @@ export class VaultPopupListFiltersService {
     ),
   );
 
+  /** Updates the stored state for filter visibility. */
+  async updateFilterVisibility(isVisible: boolean): Promise<void> {
+    await this.filterVisibilityState.update(() => isVisible);
+  }
+
   /**
    * Converts the given item into the `ChipSelectOption` structure
    */