1
0
mirror of https://github.com/bitwarden/web synced 2025-12-06 00:03:28 +00:00

[feat] Allow the org badge click event to expand collapsed vault filters

1. Extend the BaseVaultFiltersService to manage an observable for collapsed nodes that can be modified from outside the VaultFiltersComponent
2. Subscribe to the new observable in VaultFiltersComponent.ngOnInit() to update the collapsed state of filters when changed from outside the VaultFiltersComponent
3. Add a helper method to VaultFiltersService for expanding vault filters if they are collapsed that sends a new value through the subscription
4. Wire everything up in the IndividualVaultComponent so applying a not null organization filter expanded the vault filters
This commit is contained in:
addison
2022-05-17 10:53:16 -04:00
parent 30057d2ac4
commit d7a4d3f538
4 changed files with 40 additions and 5 deletions

View File

@@ -1,9 +1,10 @@
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",
templateUrl: "vault-filter.component.html",
@@ -20,10 +21,17 @@ export class VaultFilterComponent extends BaseVaultFilterComponent {
organization: Organization;
constructor(vaultFilterService: VaultFilterService) {
constructor(protected vaultFilterService: VaultFilterService) {
super(vaultFilterService);
}
async ngOnInit() {
await super.ngOnInit();
this.vaultFilterService.collapsedFilterNodes.subscribe((nodes) => {
this.collapsedFilterNodes = nodes;
});
}
searchTextChanged() {
this.onSearchTextChanged.emit(this.searchText);
}

View File

@@ -1,6 +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";
@@ -17,6 +16,7 @@ import { OrganizationOptionsComponent } from "./components/organization-options.
import { StatusFilterComponent } from "./components/status-filter.component";
import { TypeFilterComponent } from "./components/type-filter.component";
import { VaultFilterComponent } from "./vault-filter.component";
import { VaultFilterService } from "./vault-filter.service";
@NgModule({
imports: [SharedModule],

View File

@@ -1,3 +1,27 @@
import { BehaviorSubject } from "rxjs";
import { VaultFilterService as BaseVaultFilterService } from "jslib-angular/modules/vault-filter/vault-filter.service";
export class VaultFilterService extends BaseVaultFilterService {}
export class VaultFilterService extends BaseVaultFilterService {
collapsedFilterNodes = new BehaviorSubject<Set<string>>(null);
async buildCollapsedFilterNodes(): Promise<Set<string>> {
const nodes = await super.buildCollapsedFilterNodes();
this.collapsedFilterNodes.next(nodes);
return nodes;
}
async storeCollapsedFilterNodes(collapsedFilterNodes: Set<string>): Promise<void> {
await super.storeCollapsedFilterNodes(collapsedFilterNodes);
this.collapsedFilterNodes.next(collapsedFilterNodes);
}
async ensureVaultFiltersAreExpanded() {
const collapsedFilterNodes = await super.buildCollapsedFilterNodes();
if (!collapsedFilterNodes.has("vaults")) {
return;
}
collapsedFilterNodes.delete("vaults");
await this.storeCollapsedFilterNodes(collapsedFilterNodes);
}
}

View File

@@ -34,6 +34,7 @@ import { CollectionsComponent } from "../../../../vault/collections.component";
import { FolderAddEditComponent } from "../../../../vault/folder-add-edit.component";
import { ShareComponent } from "../../../../vault/share.component";
import { VaultFilterComponent } from "../../../vault-filter/vault-filter.component";
import { VaultFilterService } from "../../../vault-filter/vault-filter.service";
import { VaultService } from "../../vault.service";
const BroadcasterSubscriptionId = "VaultComponent";
@@ -88,7 +89,8 @@ export class IndividualVaultComponent implements OnInit, OnDestroy {
private organizationService: OrganizationService,
private vaultService: VaultService,
private cipherService: CipherService,
private passwordRepromptService: PasswordRepromptService
private passwordRepromptService: PasswordRepromptService,
private vaultFilterService: VaultFilterService
) {}
async ngOnInit() {
@@ -187,6 +189,7 @@ export class IndividualVaultComponent implements OnInit, OnDestroy {
this.activeFilter.myVaultOnly = true;
} else {
this.activeFilter.selectedOrganizationId = orgId;
await this.vaultFilterService.ensureVaultFiltersAreExpanded();
}
await this.applyVaultFilter(this.activeFilter);
}