From d40d0b7c9ccaec87673d87b782923453de7767c1 Mon Sep 17 00:00:00 2001
From: Alexandre Vryghem <alexandre@atmire.com>
Date: Tue, 23 Apr 2024 17:46:08 +0200
Subject: [PATCH] 111731: Fixed selected filters not being displayed as labels

---
 .../shared/search/search-filter.service.ts    |  4 +--
 src/app/core/shared/search/search.service.ts  | 21 +++++++++++--
 .../search-facet-filter-wrapper.component.ts  |  3 +-
 .../search-facet-filter.component.spec.ts     |  4 +--
 .../search-facet-filter.component.ts          |  6 ++--
 .../search-filter.component.html              |  3 +-
 .../search-filter/search-filter.component.ts  |  8 +----
 .../search-hierarchy-filter.component.spec.ts |  2 --
 .../search-hierarchy-filter.component.ts      |  8 ++---
 .../search-range-filter.component.spec.ts     |  5 ++--
 .../search-range-filter.component.ts          |  7 ++---
 .../search-filters.component.html             |  2 +-
 .../search-filters.component.ts               | 30 ++-----------------
 .../themed-search-filters.component.ts        |  5 +---
 .../search-labels.component.html              | 10 +++----
 .../search-labels/search-labels.component.ts  | 20 +++++++++----
 .../search-sidebar.component.html             |  3 +-
 .../search-sidebar.component.ts               |  6 ----
 .../themed-search-sidebar.component.ts        |  3 --
 src/app/shared/search/search.component.html   |  4 +--
 src/app/shared/search/search.component.ts     |  6 ----
 21 files changed, 56 insertions(+), 104 deletions(-)

diff --git a/src/app/core/shared/search/search-filter.service.ts b/src/app/core/shared/search/search-filter.service.ts
index 14892bc78e..de09ef67e0 100644
--- a/src/app/core/shared/search/search-filter.service.ts
+++ b/src/app/core/shared/search/search-filter.service.ts
@@ -1,6 +1,6 @@
 import { BehaviorSubject, combineLatest as observableCombineLatest, Observable, of as observableOf } from 'rxjs';
 import { distinctUntilChanged, map } from 'rxjs/operators';
-import { Injectable, InjectionToken, EventEmitter } from '@angular/core';
+import { Injectable, InjectionToken } from '@angular/core';
 import {
   SearchFiltersState,
   SearchFilterState
@@ -21,7 +21,6 @@ import { SortDirection, SortOptions } from '../../cache/models/sort-options.mode
 import { RouteService } from '../../services/route.service';
 import { PaginationComponentOptions } from '../../../shared/pagination/pagination-component-options.model';
 import { Params } from '@angular/router';
-import { AppliedFilter } from '../../../shared/search/models/applied-filter.model';
 import { SearchOptions } from '../../../shared/search/models/search-options.model';
 import { getFirstSucceededRemoteData } from '../operators';
 import { FacetValue } from '../../../shared/search/models/facet-value.model';
@@ -37,7 +36,6 @@ const filterStateSelector = (state: SearchFiltersState) => state.searchFilter;
 export const FILTER_CONFIG: InjectionToken<SearchFilterConfig> = new InjectionToken<SearchFilterConfig>('filterConfig');
 export const IN_PLACE_SEARCH: InjectionToken<boolean> = new InjectionToken<boolean>('inPlaceSearch');
 export const REFRESH_FILTER: InjectionToken<BehaviorSubject<any>> = new InjectionToken<boolean>('refreshFilters');
-export const CHANGE_APPLIED_FILTERS: InjectionToken<EventEmitter<AppliedFilter[]>> = new InjectionToken('changeAppliedFilters');
 
 /**
  * Service that performs all actions that have to do with search filters and facets
diff --git a/src/app/core/shared/search/search.service.ts b/src/app/core/shared/search/search.service.ts
index a88a8b0d16..0a69fbd667 100644
--- a/src/app/core/shared/search/search.service.ts
+++ b/src/app/core/shared/search/search.service.ts
@@ -1,7 +1,7 @@
 /* eslint-disable max-classes-per-file */
-import { combineLatest as observableCombineLatest, Observable } from 'rxjs';
+import { combineLatest as observableCombineLatest, Observable, BehaviorSubject } from 'rxjs';
 import { Injectable, OnDestroy } from '@angular/core';
-import { map, switchMap, take } from 'rxjs/operators';
+import { map, switchMap, take, tap } from 'rxjs/operators';
 import { FollowLinkConfig } from '../../../shared/utils/follow-link-config.model';
 import { ResponseParsingService } from '../../data/parsing.service';
 import { RemoteData } from '../../data/remote-data';
@@ -32,6 +32,7 @@ import { PaginationComponentOptions } from '../../../shared/pagination/paginatio
 import { RestRequest } from '../../data/rest-request.model';
 import { BaseDataService } from '../../data/base/base-data.service';
 import { Angulartics2 } from 'angulartics2';
+import { AppliedFilter } from '../../../shared/search/models/applied-filter.model';
 
 /**
  * A limited data service implementation for the 'discover' endpoint
@@ -87,6 +88,8 @@ export class SearchService implements OnDestroy {
    */
   private searchDataService: SearchDataService;
 
+  public appliedFilters$: BehaviorSubject<AppliedFilter[]> = new BehaviorSubject([]);
+
   constructor(
     private routeService: RouteService,
     protected requestService: RequestService,
@@ -293,7 +296,19 @@ export class SearchService implements OnDestroy {
     });
     this.requestService.send(request, useCachedVersionIfAvailable);
 
-    return this.rdb.buildFromHref(href);
+    return this.rdb.buildFromHref(href).pipe(
+      tap((facetValuesRD: RemoteData<FacetValues>) => {
+        if (facetValuesRD.hasSucceeded) {
+          const appliedFilters: AppliedFilter[] = (facetValuesRD.payload.appliedFilters ?? [])
+            .filter((appliedFilter: AppliedFilter) => hasValue(appliedFilter))
+            // TODO this should ideally be fixed in the backend
+            .map((appliedFilter: AppliedFilter) => Object.assign({}, appliedFilter, {
+              operator: hasValue(appliedFilter.value.match(/\[\s*(\*|\d+)\s*TO\s*(\*|\d+)\s*]/)) ? 'range' : appliedFilter.operator,
+            }));
+          this.appliedFilters$.next(appliedFilters);
+        }
+      }),
+    );
   }
 
   /**
diff --git a/src/app/shared/search/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts b/src/app/shared/search/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
index 92add2ab7b..e8cf0d693e 100644
--- a/src/app/shared/search/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
+++ b/src/app/shared/search/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
@@ -5,7 +5,7 @@ import { SearchFilterConfig } from '../../../models/search-filter-config.model';
 import {
   FILTER_CONFIG,
   IN_PLACE_SEARCH,
-  REFRESH_FILTER, CHANGE_APPLIED_FILTERS
+  REFRESH_FILTER,
 } from '../../../../../core/shared/search/search-filter.service';
 import { GenericConstructor } from '../../../../../core/shared/generic-constructor';
 import { SearchFacetFilterComponent } from '../search-facet-filter/search-facet-filter.component';
@@ -63,7 +63,6 @@ export class SearchFacetFilterWrapperComponent implements OnInit {
         { provide: FILTER_CONFIG, useFactory: () => (this.filterConfig), deps: [] },
         { provide: IN_PLACE_SEARCH, useFactory: () => (this.inPlaceSearch), deps: [] },
         { provide: REFRESH_FILTER, useFactory: () => (this.refreshFilters), deps: [] },
-        { provide: CHANGE_APPLIED_FILTERS, useFactory: () => this.changeAppliedFilters },
       ],
       parent: this.injector
     });
diff --git a/src/app/shared/search/search-filters/search-filter/search-facet-filter/search-facet-filter.component.spec.ts b/src/app/shared/search/search-filters/search-filter/search-facet-filter/search-facet-filter.component.spec.ts
index 343f0de6c7..61c9f50c92 100644
--- a/src/app/shared/search/search-filters/search-filter/search-facet-filter/search-facet-filter.component.spec.ts
+++ b/src/app/shared/search/search-filters/search-filter/search-facet-filter/search-facet-filter.component.spec.ts
@@ -1,9 +1,8 @@
-import { ChangeDetectionStrategy, EventEmitter, NO_ERRORS_SCHEMA } from '@angular/core';
+import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import {
-  CHANGE_APPLIED_FILTERS,
   FILTER_CONFIG,
   IN_PLACE_SEARCH,
   REFRESH_FILTER,
@@ -88,7 +87,6 @@ describe('SearchFacetFilterComponent', () => {
         { provide: SEARCH_CONFIG_SERVICE, useValue: searchConfigService },
         { provide: IN_PLACE_SEARCH, useValue: false },
         { provide: REFRESH_FILTER, useValue: new BehaviorSubject<boolean>(false) },
-        { provide: CHANGE_APPLIED_FILTERS, useValue: new EventEmitter() },
       ],
       schemas: [NO_ERRORS_SCHEMA]
     }).overrideComponent(SearchFacetFilterComponent, {
diff --git a/src/app/shared/search/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts b/src/app/shared/search/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
index 381d194917..8af3aac7be 100644
--- a/src/app/shared/search/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
+++ b/src/app/shared/search/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
@@ -1,5 +1,5 @@
 import { animate, state, style, transition, trigger } from '@angular/animations';
-import { Component, Inject, OnDestroy, OnInit, EventEmitter } from '@angular/core';
+import { Component, Inject, OnDestroy, OnInit } from '@angular/core';
 import { Router, Params } from '@angular/router';
 
 import { BehaviorSubject, combineLatest as observableCombineLatest, Observable, of as observableOf, Subscription } from 'rxjs';
@@ -10,7 +10,7 @@ import { hasNoValue, hasValue } from '../../../../empty.util';
 import { FacetValue } from '../../../models/facet-value.model';
 import { SearchFilterConfig } from '../../../models/search-filter-config.model';
 import { SearchService } from '../../../../../core/shared/search/search.service';
-import { FILTER_CONFIG, IN_PLACE_SEARCH, REFRESH_FILTER, SearchFilterService, CHANGE_APPLIED_FILTERS } from '../../../../../core/shared/search/search-filter.service';
+import { FILTER_CONFIG, IN_PLACE_SEARCH, REFRESH_FILTER, SearchFilterService } from '../../../../../core/shared/search/search-filter.service';
 import { SearchConfigurationService } from '../../../../../core/shared/search/search-configuration.service';
 import { getFirstSucceededRemoteDataPayload } from '../../../../../core/shared/operators';
 import { InputSuggestion } from '../../../../input-suggestions/input-suggestions.model';
@@ -90,7 +90,6 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
               @Inject(IN_PLACE_SEARCH) public inPlaceSearch: boolean,
               @Inject(FILTER_CONFIG) public filterConfig: SearchFilterConfig,
               @Inject(REFRESH_FILTER) public refreshFilters: BehaviorSubject<boolean>,
-              @Inject(CHANGE_APPLIED_FILTERS) public changeAppliedFilters: EventEmitter<AppliedFilter[]>,
   ) {
   }
 
@@ -259,7 +258,6 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
         const appliedFilters: AppliedFilter[] = selectedValues.map((value: string) => {
           return allAppliedFilters.find((appliedFilter: AppliedFilter) => appliedFilter.value === stripOperatorFromFilterValue(value));
         }).filter((appliedFilter: AppliedFilter) => hasValue(appliedFilter));
-        this.changeAppliedFilters.emit(appliedFilters);
         return appliedFilters;
       }),
     );
diff --git a/src/app/shared/search/search-filters/search-filter/search-filter.component.html b/src/app/shared/search/search-filters/search-filter/search-filter.component.html
index 3de173b4ac..6387ed9c1f 100644
--- a/src/app/shared/search/search-filters/search-filter/search-filter.component.html
+++ b/src/app/shared/search/search-filters/search-filter/search-filter.component.html
@@ -20,8 +20,7 @@
     <ds-search-facet-filter-wrapper
       [filterConfig]="filter"
       [inPlaceSearch]="inPlaceSearch"
-      [refreshFilters]="refreshFilters"
-      (changeAppliedFilters)="changeAppliedFilters.emit($event)">
+      [refreshFilters]="refreshFilters">
     </ds-search-facet-filter-wrapper>
   </div>
 </div>
diff --git a/src/app/shared/search/search-filters/search-filter/search-filter.component.ts b/src/app/shared/search/search-filters/search-filter/search-filter.component.ts
index f41c61342c..d1d3bd729d 100644
--- a/src/app/shared/search/search-filters/search-filter/search-filter.component.ts
+++ b/src/app/shared/search/search-filters/search-filter/search-filter.component.ts
@@ -1,4 +1,4 @@
-import { Component, Inject, Input, OnInit, Output, EventEmitter } from '@angular/core';
+import { Component, Inject, Input, OnInit } from '@angular/core';
 
 import { BehaviorSubject, Observable, of as observableOf } from 'rxjs';
 import { filter, map, startWith, switchMap, take } from 'rxjs/operators';
@@ -11,7 +11,6 @@ import { SearchService } from '../../../../core/shared/search/search.service';
 import { SearchConfigurationService } from '../../../../core/shared/search/search-configuration.service';
 import { SEARCH_CONFIG_SERVICE } from '../../../../my-dspace-page/my-dspace-page.component';
 import { SequenceService } from '../../../../core/shared/sequence.service';
-import { AppliedFilter } from '../../models/applied-filter.model';
 
 @Component({
   selector: 'ds-search-filter',
@@ -39,11 +38,6 @@ export class SearchFilterComponent implements OnInit {
    */
   @Input() refreshFilters: BehaviorSubject<boolean>;
 
-  /**
-   * Emits the {@link AppliedFilter}s of this search filter
-   */
-  @Output() changeAppliedFilters: EventEmitter<AppliedFilter[]> = new EventEmitter();
-
   /**
    * True when the filter is 100% collapsed in the UI
    */
diff --git a/src/app/shared/search/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.spec.ts b/src/app/shared/search/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.spec.ts
index 949fc33892..c3f73aa899 100644
--- a/src/app/shared/search/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.spec.ts
+++ b/src/app/shared/search/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.spec.ts
@@ -13,7 +13,6 @@ import { PageInfo } from '../../../../../core/shared/page-info.model';
 import { CommonModule } from '@angular/common';
 import { SearchService } from '../../../../../core/shared/search/search.service';
 import {
-  CHANGE_APPLIED_FILTERS,
   FILTER_CONFIG,
   IN_PLACE_SEARCH,
   SearchFilterService,
@@ -77,7 +76,6 @@ describe('SearchHierarchyFilterComponent', () => {
         { provide: IN_PLACE_SEARCH, useValue: false },
         { provide: FILTER_CONFIG, useValue: Object.assign(new SearchFilterConfig(), { name: testSearchFilter }) },
         { provide: REFRESH_FILTER, useValue: new BehaviorSubject<boolean>(false) },
-        { provide: CHANGE_APPLIED_FILTERS, useValue: new EventEmitter() },
       ],
       schemas: [NO_ERRORS_SCHEMA],
     }).compileComponents();
diff --git a/src/app/shared/search/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.ts b/src/app/shared/search/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.ts
index 649624bcb4..a5328a779c 100644
--- a/src/app/shared/search/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.ts
+++ b/src/app/shared/search/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.ts
@@ -1,4 +1,4 @@
-import { Component, Inject, OnInit, EventEmitter } from '@angular/core';
+import { Component, Inject, OnInit } from '@angular/core';
 import { renderFacetFor } from '../search-filter-type-decorator';
 import { FilterType } from '../../../models/filter-type.model';
 import { facetLoad, SearchFacetFilterComponent } from '../search-facet-filter/search-facet-filter.component';
@@ -10,7 +10,7 @@ import { SearchService } from '../../../../../core/shared/search/search.service'
 import {
   FILTER_CONFIG,
   IN_PLACE_SEARCH,
-  SearchFilterService, REFRESH_FILTER, CHANGE_APPLIED_FILTERS
+  SearchFilterService, REFRESH_FILTER,
 } from '../../../../../core/shared/search/search-filter.service';
 import { Params, Router } from '@angular/router';
 import { RemoteDataBuildService } from '../../../../../core/cache/builders/remote-data-build.service';
@@ -24,7 +24,6 @@ import { PageInfo } from '../../../../../core/shared/page-info.model';
 import { environment } from '../../../../../../environments/environment';
 import { addOperatorToFilterValue } from '../../../search.utils';
 import { VocabularyTreeviewModalComponent } from '../../../../form/vocabulary-treeview-modal/vocabulary-treeview-modal.component';
-import { AppliedFilter } from '../../../models/applied-filter.model';
 
 @Component({
   selector: 'ds-search-hierarchy-filter',
@@ -49,9 +48,8 @@ export class SearchHierarchyFilterComponent extends SearchFacetFilterComponent i
               @Inject(IN_PLACE_SEARCH) public inPlaceSearch: boolean,
               @Inject(FILTER_CONFIG) public filterConfig: SearchFilterConfig,
               @Inject(REFRESH_FILTER) public refreshFilters: BehaviorSubject<boolean>,
-              @Inject(CHANGE_APPLIED_FILTERS) public changeAppliedFilters: EventEmitter<AppliedFilter[]>,
   ) {
-    super(searchService, filterService, rdbs, router, searchConfigService, inPlaceSearch, filterConfig, refreshFilters, changeAppliedFilters);
+    super(searchService, filterService, rdbs, router, searchConfigService, inPlaceSearch, filterConfig, refreshFilters);
   }
 
   vocabularyExists$: Observable<boolean>;
diff --git a/src/app/shared/search/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts b/src/app/shared/search/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts
index 509ef48bf8..9562c7e991 100644
--- a/src/app/shared/search/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts
+++ b/src/app/shared/search/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts
@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, EventEmitter, NO_ERRORS_SCHEMA } from '@angular/core';
+import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@@ -6,7 +6,7 @@ import {
   FILTER_CONFIG,
   IN_PLACE_SEARCH,
   REFRESH_FILTER,
-  SearchFilterService, CHANGE_APPLIED_FILTERS
+  SearchFilterService,
 } from '../../../../../core/shared/search/search-filter.service';
 import { SearchFilterConfig } from '../../../models/search-filter-config.model';
 import { FilterType } from '../../../models/filter-type.model';
@@ -105,7 +105,6 @@ describe('SearchRangeFilterComponent', () => {
         { provide: SEARCH_CONFIG_SERVICE, useValue: new SearchConfigurationServiceStub() },
         { provide: IN_PLACE_SEARCH, useValue: false },
         { provide: REFRESH_FILTER, useValue: new BehaviorSubject<boolean>(false) },
-        { provide: CHANGE_APPLIED_FILTERS, useValue: new EventEmitter() },
         {
           provide: SearchFilterService, useValue: {
             getSelectedValuesForFilter: () => selectedValues,
diff --git a/src/app/shared/search/search-filters/search-filter/search-range-filter/search-range-filter.component.ts b/src/app/shared/search/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
index 48c039c538..9cc9e88660 100644
--- a/src/app/shared/search/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
+++ b/src/app/shared/search/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
@@ -1,14 +1,13 @@
 import { BehaviorSubject, combineLatest as observableCombineLatest, of as observableOf , Subscription } from 'rxjs';
 import { map, startWith } from 'rxjs/operators';
 import { isPlatformBrowser } from '@angular/common';
-import { Component, Inject, OnDestroy, OnInit, PLATFORM_ID, EventEmitter } from '@angular/core';
+import { Component, Inject, OnDestroy, OnInit, PLATFORM_ID } from '@angular/core';
 import { RemoteDataBuildService } from '../../../../../core/cache/builders/remote-data-build.service';
 import { FilterType } from '../../../models/filter-type.model';
 import { renderFacetFor } from '../search-filter-type-decorator';
 import { facetLoad, SearchFacetFilterComponent } from '../search-facet-filter/search-facet-filter.component';
 import { SearchFilterConfig } from '../../../models/search-filter-config.model';
 import {
-  CHANGE_APPLIED_FILTERS,
   FILTER_CONFIG,
   IN_PLACE_SEARCH,
   REFRESH_FILTER,
@@ -86,9 +85,8 @@ export class SearchRangeFilterComponent extends SearchFacetFilterComponent imple
               @Inject(FILTER_CONFIG) public filterConfig: SearchFilterConfig,
               @Inject(PLATFORM_ID) private platformId: any,
               @Inject(REFRESH_FILTER) public refreshFilters: BehaviorSubject<boolean>,
-              @Inject(CHANGE_APPLIED_FILTERS) public changeAppliedFilters: EventEmitter<AppliedFilter[]>,
               private route: RouteService) {
-    super(searchService, filterService, rdbs, router, searchConfigService, inPlaceSearch, filterConfig, refreshFilters, changeAppliedFilters);
+    super(searchService, filterService, rdbs, router, searchConfigService, inPlaceSearch, filterConfig, refreshFilters);
 
   }
 
@@ -121,7 +119,6 @@ export class SearchRangeFilterComponent extends SearchFacetFilterComponent imple
       }));
 
     this.selectedAppliedFilters$ = observableOf(appliedFilters);
-    this.changeAppliedFilters.emit(appliedFilters);
   }
 
   /**
diff --git a/src/app/shared/search/search-filters/search-filters.component.html b/src/app/shared/search/search-filters/search-filters.component.html
index 820be2ebdf..e392cd2663 100644
--- a/src/app/shared/search/search-filters/search-filters.component.html
+++ b/src/app/shared/search/search-filters/search-filters.component.html
@@ -1,7 +1,7 @@
 <h3>{{"search.filters.head" | translate}}</h3>
 <div *ngIf="(filters | async)?.hasSucceeded">
     <div *ngFor="let filter of (filters | async)?.payload; trackBy: trackUpdate">
-        <ds-search-filter [filter]="filter" [inPlaceSearch]="inPlaceSearch" [refreshFilters]="refreshFilters" (changeAppliedFilters)="updateAppliedFilters(filter.name, $event)"></ds-search-filter>
+        <ds-search-filter [filter]="filter" [inPlaceSearch]="inPlaceSearch" [refreshFilters]="refreshFilters"></ds-search-filter>
     </div>
 </div>
 <a class="btn btn-primary" [routerLink]="[searchLink]" [queryParams]="clearParams | async" queryParamsHandling="merge" role="button"><i class="fas fa-undo"></i> {{"search.filters.reset" | translate}}</a>
diff --git a/src/app/shared/search/search-filters/search-filters.component.ts b/src/app/shared/search/search-filters/search-filters.component.ts
index 5cf98db2df..65f3029a6f 100644
--- a/src/app/shared/search/search-filters/search-filters.component.ts
+++ b/src/app/shared/search/search-filters/search-filters.component.ts
@@ -1,4 +1,4 @@
-import { Component, Inject, Input, OnDestroy, OnInit, Output, EventEmitter } from '@angular/core';
+import { Component, Inject, Input, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 
 import { BehaviorSubject, Observable } from 'rxjs';
@@ -10,7 +10,6 @@ import { SearchFilterConfig } from '../models/search-filter-config.model';
 import { SearchConfigurationService } from '../../../core/shared/search/search-configuration.service';
 import { SEARCH_CONFIG_SERVICE } from '../../../my-dspace-page/my-dspace-page.component';
 import { currentPath } from '../../utils/route.utils';
-import { hasValue } from '../../empty.util';
 import { AppliedFilter } from '../models/applied-filter.model';
 
 @Component({
@@ -23,7 +22,7 @@ import { AppliedFilter } from '../models/applied-filter.model';
 /**
  * This component represents the part of the search sidebar that contains filters.
  */
-export class SearchFiltersComponent implements OnInit, OnDestroy {
+export class SearchFiltersComponent implements OnInit {
   /**
    * An observable containing configuration about which filters are shown and how they are shown
    */
@@ -55,11 +54,6 @@ export class SearchFiltersComponent implements OnInit, OnDestroy {
    */
   @Input() refreshFilters: BehaviorSubject<boolean>;
 
-  /**
-   * Emits the {@link AppliedFilter}s by search filter name
-   */
-  @Output() changeAppliedFilters: EventEmitter<Map<string, AppliedFilter[]>> = new EventEmitter();
-
   appliedFilters: Map<string, AppliedFilter[]> = new Map();
 
   /**
@@ -67,8 +61,6 @@ export class SearchFiltersComponent implements OnInit, OnDestroy {
    */
   searchLink: string;
 
-  subs = [];
-
   /**
    * Initialize instance variables
    * @param {SearchService} searchService
@@ -107,22 +99,4 @@ export class SearchFiltersComponent implements OnInit, OnDestroy {
     return config ? config.name : undefined;
   }
 
-  /**
-   * Updates the map of {@link AppliedFilter}s and emits it to it's parent component
-   *
-   * @param filterName
-   * @param appliedFilters
-   */
-  updateAppliedFilters(filterName: string, appliedFilters: AppliedFilter[]): void {
-    this.appliedFilters.set(filterName, appliedFilters);
-    this.changeAppliedFilters.emit(this.appliedFilters);
-  }
-
-  ngOnDestroy() {
-    this.subs.forEach((sub) => {
-      if (hasValue(sub)) {
-        sub.unsubscribe();
-      }
-    });
-  }
 }
diff --git a/src/app/shared/search/search-filters/themed-search-filters.component.ts b/src/app/shared/search/search-filters/themed-search-filters.component.ts
index d520ac2b0a..e935c2f2f1 100644
--- a/src/app/shared/search/search-filters/themed-search-filters.component.ts
+++ b/src/app/shared/search/search-filters/themed-search-filters.component.ts
@@ -1,10 +1,9 @@
-import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { Component, Input } from '@angular/core';
 import { ThemedComponent } from '../../theme-support/themed.component';
 import { SearchFiltersComponent } from './search-filters.component';
 import { Observable } from 'rxjs/internal/Observable';
 import { RemoteData } from '../../../core/data/remote-data';
 import { SearchFilterConfig } from '../models/search-filter-config.model';
-import { AppliedFilter } from '../models/applied-filter.model';
 
 /**
  * Themed wrapper for SearchFiltersComponent
@@ -20,11 +19,9 @@ export class ThemedSearchFiltersComponent extends ThemedComponent<SearchFiltersC
   @Input() inPlaceSearch: boolean;
   @Input() refreshFilters: Observable<any>;
   @Input() filters: Observable<RemoteData<SearchFilterConfig[]>>;
-  @Output() changeAppliedFilters: EventEmitter<Map<string, AppliedFilter[]>> = new EventEmitter();
 
   protected inAndOutputNames: (keyof SearchFiltersComponent & keyof this)[] = [
     'filters', 'currentConfiguration', 'currentScope', 'inPlaceSearch', 'refreshFilters',
-    'changeAppliedFilters',
   ];
 
   protected getComponentName(): string {
diff --git a/src/app/shared/search/search-labels/search-labels.component.html b/src/app/shared/search/search-labels/search-labels.component.html
index 1dbf910dfb..4e84de0ceb 100644
--- a/src/app/shared/search/search-labels/search-labels.component.html
+++ b/src/app/shared/search/search-labels/search-labels.component.html
@@ -1,8 +1,6 @@
 <div class="labels">
-  <ng-container *ngFor="let appliedFilters of (appliedFilters | keyvalue)">
-    <ds-search-label-loader *ngFor="let appliedFilter of appliedFilters.value"
-                            [appliedFilter]="appliedFilter"
-                            [inPlaceSearch]="inPlaceSearch">
-    </ds-search-label-loader>
-  </ng-container>
+  <ds-search-label-loader *ngFor="let appliedFilter of appliedFilters$ | async"
+                          [appliedFilter]="appliedFilter"
+                          [inPlaceSearch]="inPlaceSearch">
+  </ds-search-label-loader>
 </div>
diff --git a/src/app/shared/search/search-labels/search-labels.component.ts b/src/app/shared/search/search-labels/search-labels.component.ts
index 388ce08e46..9d011bcd2d 100644
--- a/src/app/shared/search/search-labels/search-labels.component.ts
+++ b/src/app/shared/search/search-labels/search-labels.component.ts
@@ -1,5 +1,7 @@
-import { Component, Input } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { AppliedFilter } from '../models/applied-filter.model';
+import { SearchService } from '../../../core/shared/search/search.service';
+import { BehaviorSubject } from 'rxjs';
 
 @Component({
   selector: 'ds-search-labels',
@@ -10,16 +12,22 @@ import { AppliedFilter } from '../models/applied-filter.model';
 /**
  * Component that represents the labels containing the currently active filters
  */
-export class SearchLabelsComponent {
+export class SearchLabelsComponent implements OnInit {
 
   /**
    * True when the search component should show results on the current page
    */
   @Input() inPlaceSearch: boolean;
 
-  /**
-   * The {@link AppliedFilter}s by filter name
-   */
-  @Input() appliedFilters: Map<string, AppliedFilter[]>;
+  appliedFilters$: BehaviorSubject<AppliedFilter[]>;
+
+  constructor(
+    protected searchService: SearchService,
+  ) {
+  }
+
+  ngOnInit(): void {
+    this.appliedFilters$ = this.searchService.appliedFilters$;
+  }
 
 }
diff --git a/src/app/shared/search/search-sidebar/search-sidebar.component.html b/src/app/shared/search/search-sidebar/search-sidebar.component.html
index ad1c574597..5faba679ea 100644
--- a/src/app/shared/search/search-sidebar/search-sidebar.component.html
+++ b/src/app/shared/search/search-sidebar/search-sidebar.component.html
@@ -21,8 +21,7 @@
                                [currentConfiguration]="configuration"
                                [filters]="filters"
                                [refreshFilters]="refreshFilters"
-                               [inPlaceSearch]="inPlaceSearch"
-                               (changeAppliedFilters)="changeAppliedFilters.emit($event)">
+                               [inPlaceSearch]="inPlaceSearch">
             </ds-themed-search-filters>
             <ds-advanced-search [configuration]="configuration"
                                 [filtersConfig]="(filters | async)?.payload">
diff --git a/src/app/shared/search/search-sidebar/search-sidebar.component.ts b/src/app/shared/search/search-sidebar/search-sidebar.component.ts
index 8f7e3236e9..9eb31cffe1 100644
--- a/src/app/shared/search/search-sidebar/search-sidebar.component.ts
+++ b/src/app/shared/search/search-sidebar/search-sidebar.component.ts
@@ -7,7 +7,6 @@ import { SortOptions } from '../../../core/cache/models/sort-options.model';
 import { ViewMode } from '../../../core/shared/view-mode.model';
 import { RemoteData } from '../../../core/data/remote-data';
 import { SearchFilterConfig } from '../models/search-filter-config.model';
-import { AppliedFilter } from '../models/applied-filter.model';
 
 /**
  * This component renders a simple item page.
@@ -96,11 +95,6 @@ export class SearchSidebarComponent {
    */
   @Output() changeConfiguration: EventEmitter<SearchConfigurationOption> = new EventEmitter<SearchConfigurationOption>();
 
-  /**
-   * Emits the {@link AppliedFilter}s by search filter name
-   */
-  @Output() changeAppliedFilters: EventEmitter<Map<string, AppliedFilter[]>> = new EventEmitter();
-
   /**
    * Emits event when the user select a new view mode
    */
diff --git a/src/app/shared/search/search-sidebar/themed-search-sidebar.component.ts b/src/app/shared/search/search-sidebar/themed-search-sidebar.component.ts
index 2ffb1f8060..ce9f580000 100644
--- a/src/app/shared/search/search-sidebar/themed-search-sidebar.component.ts
+++ b/src/app/shared/search/search-sidebar/themed-search-sidebar.component.ts
@@ -8,7 +8,6 @@ import { PaginatedSearchOptions } from '../models/paginated-search-options.model
 import { BehaviorSubject, Observable } from 'rxjs';
 import { RemoteData } from '../../../core/data/remote-data';
 import { SearchFilterConfig } from '../models/search-filter-config.model';
-import { AppliedFilter } from '../models/applied-filter.model';
 
 /**
  * Themed wrapper for SearchSidebarComponent
@@ -33,14 +32,12 @@ export class ThemedSearchSidebarComponent extends ThemedComponent<SearchSidebarC
   @Input() refreshFilters: BehaviorSubject<boolean>;
   @Output() toggleSidebar: EventEmitter<boolean> = new EventEmitter();
   @Output() changeConfiguration: EventEmitter<SearchConfigurationOption> = new EventEmitter();
-  @Output() changeAppliedFilters: EventEmitter<Map<string, AppliedFilter[]>> = new EventEmitter();
   @Output() changeViewMode: EventEmitter<ViewMode> = new EventEmitter();
 
   protected inAndOutputNames: (keyof SearchSidebarComponent & keyof this)[] = [
     'configuration', 'configurationList', 'currentScope', 'currentSortOption',
     'resultCount', 'filters', 'viewModeList', 'showViewModes', 'inPlaceSearch',
     'searchOptions', 'sortOptionsList', 'refreshFilters', 'toggleSidebar', 'changeConfiguration',
-    'changeAppliedFilters',
     'changeViewMode',
   ];
 
diff --git a/src/app/shared/search/search.component.html b/src/app/shared/search/search.component.html
index e65d5858e4..0119241161 100644
--- a/src/app/shared/search/search.component.html
+++ b/src/app/shared/search/search.component.html
@@ -61,7 +61,6 @@
                        [viewModeList]="viewModeList"
                        [showViewModes]="showViewModes"
                        (changeConfiguration)="changeContext($event.context)"
-                       (changeAppliedFilters)="appliedFilters = $event"
                        (changeViewMode)="changeViewMode()"></ds-themed-search-sidebar>
     <ds-themed-search-sidebar id="search-sidebar-sm" *ngIf="(isXsOrSm$ | async)"
                        [configurationList]="configurationList"
@@ -77,7 +76,6 @@
                        [showViewModes]="showViewModes"
                        (toggleSidebar)="closeSidebar()"
                        (changeConfiguration)="changeContext($event.context)"
-                       (changeAppliedFilters)="appliedFilters = $event"
                        (changeViewMode)="changeViewMode()">
     </ds-themed-search-sidebar>
 </ng-template>
@@ -93,7 +91,7 @@
     </ds-themed-search-form>
     <div class="row mb-3 mb-md-1">
         <div class="labels col-sm-9">
-            <ds-search-labels *ngIf="searchEnabled" [appliedFilters]="appliedFilters" [inPlaceSearch]="inPlaceSearch">
+            <ds-search-labels *ngIf="searchEnabled" [inPlaceSearch]="inPlaceSearch">
             </ds-search-labels>
         </div>
     </div>
diff --git a/src/app/shared/search/search.component.ts b/src/app/shared/search/search.component.ts
index ff7b7fc652..df8d1e4d64 100644
--- a/src/app/shared/search/search.component.ts
+++ b/src/app/shared/search/search.component.ts
@@ -38,7 +38,6 @@ import { WorkspaceItem } from '../../core/submission/models/workspaceitem.model'
 import { ITEM_MODULE_PATH } from '../../item-page/item-page-routing-paths';
 import { COLLECTION_MODULE_PATH } from '../../collection-page/collection-page-routing-paths';
 import { COMMUNITY_MODULE_PATH } from '../../community-page/community-page-routing-paths';
-import { AppliedFilter } from './models/applied-filter.model';
 
 @Component({
   selector: 'ds-search',
@@ -269,11 +268,6 @@ export class SearchComponent implements OnInit {
    */
   @Output() selectObject: EventEmitter<ListableObject> = new EventEmitter<ListableObject>();
 
-  /**
-   * The {@link AppliedFilter}s by filter name
-   */
-  appliedFilters: Map<string, AppliedFilter[]> = new Map();
-
   constructor(protected service: SearchService,
               protected sidebarService: SidebarService,
               protected windowService: HostWindowService,