diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.html b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.html index 7a02467..d52827b 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.html +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.html @@ -13,7 +13,7 @@
diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts index a1275fa..986057a 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts @@ -12,6 +12,7 @@ import {SearchFilters} from "../../../../../api/models/SearchFilters"; import {FileStatus, FilterExpression,} from "../../../../../api/api-types/files"; import {filterExpressionToString} from "../../../../utils/filter-utils"; import {MatCheckboxChange} from "@angular/material/checkbox"; +import * as deepEqual from "fast-deep-equal"; @Component({ @@ -36,6 +37,7 @@ export class FileSearchComponent implements AfterViewChecked, OnInit { public contextMenuTag: Tag | undefined; public contextMenuFilter: FilterExpression | undefined = undefined; public initialFilterInputValue: string | undefined; + public displayedFilters: FilterExpression[] = []; public displayImported = true; public displayArchived = true; @@ -47,14 +49,19 @@ export class FileSearchComponent implements AfterViewChecked, OnInit { private errorBroker: ErrorBrokerService, public dialog: MatDialog ) { + this.assignDisplayedFilters(); } public async ngOnInit() { - this.state.filters.subscribe(f => this.filters = f); + this.state.filters.subscribe(f => { + this.filters = f; + this.assignDisplayedFilters(); + }); this.state.sortKeys.subscribe(s => this.sortExpression = s); this.applyStatusFromFilters(); await this.searchForFiles(); this.needsScroll = true; + this.assignDisplayedFilters(); } public ngAfterViewChecked(): void { @@ -145,8 +152,8 @@ export class FileSearchComponent implements AfterViewChecked, OnInit { filterDialog.afterClosed().subscribe(async (filterExpression) => { if (filterExpression !== undefined || filterExpression?.length > 0) { this.filters = filterExpression; - this.state.setTagFilters(this.filters); this.applyStatusFromFilters(); + this.state.setTagFilters(this.filters); this.needsScroll = true; } }); @@ -175,6 +182,15 @@ export class FileSearchComponent implements AfterViewChecked, OnInit { this.updateStatusFilters(); } + public isTagFilter(filter: FilterExpression): boolean { + const tagFilter = this.buildFilterForDisplayProperty(); + return deepEqual(tagFilter, filter); + } + + private assignDisplayedFilters() { + this.displayedFilters = this.filters.getFilters().filter(f => !this.isTagFilter(f)); + } + private applyStatusFromFilters() { const filterImported = FilterQueryBuilder.status("Imported"); const filterArchived = FilterQueryBuilder.status("Archived");