111731: Added apply filter functionality

src/app/shared/search/advanced-search/advanced-search.component.html

@@ -1,12 +1,12 @@
 <h3>{{ 'search.sidebar.advanced-search.title' | translate }}</h3>
 <div *ngVar="advancedFilterMap$ | async as advancedFilterMap" class="advanced-search b-3 p-3">
   <h5>{{ 'search.sidebar.advanced-search.filter-by' | translate }}</h5>
-  <select [(ngModel)]="currentFilter" class="form-control mb-2">
+  <select [(ngModel)]="currentFilter" (keyup.enter)="applyFilter()" class="form-control mb-2">
     <option *ngFor="let advancedFilter of (advancedFilters$ | async) | keyvalue" [value]="advancedFilter.value.filter">
       {{ 'search.filters.filter.' + advancedFilter.value.filter + '.head' | translate }}
     </option>
   </select>
-  <select [(ngModel)]="currentOperator" class="form-control mb-2">
+  <select [(ngModel)]="currentOperator" (keyup.enter)="applyFilter()" class="form-control mb-2">
     <option *ngFor="let operator of advancedFilterMap.get(currentFilter)?.operators" [value]="operator.operator">
       {{ 'search.filters.operator.' + operator.operator + '.text' | translate }}
     </option>
@@ -17,10 +17,11 @@
                                [action]="router.url"
                                [name]="'f.' + currentFilter"
                                [(ngModel)]="currentValue"
+                               (submitSuggestion)="applyFilter()"
                                (findSuggestions)="findSuggestions($event)"
                                ngDefaultControl>
   </ds-filter-input-suggestions>
-  <button [disabled]="currentValue === ''" class="btn btn-primary mt-2">
+  <button (click)="applyFilter()" [disabled]="currentValue === ''" class="btn btn-primary mt-2">
     {{ 'search.sidebar.advanced-search.add' | translate }}
   </button>
 </div>

src/app/shared/search/advanced-search/advanced-search.component.spec.ts

@@ -2,8 +2,10 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { AdvancedSearchComponent } from './advanced-search.component';
 import { Router } from '@angular/router';
 import { RouterStub } from '../../testing/router.stub';
+import { SearchService } from '../../../core/shared/search/search.service';
 import { SearchConfigurationService } from '../../../core/shared/search/search-configuration.service';
 import { SearchFilterService } from '../../../core/shared/search/search-filter.service';
+import { SearchServiceStub } from '../../testing/search-service.stub';
 import { SearchConfigurationServiceStub } from '../../testing/search-configuration-service.stub';
 import { SearchFilterServiceStub } from '../../testing/search-filter-service.stub';
 import { TranslateModule } from '@ngx-translate/core';
@@ -13,11 +15,13 @@ describe('AdvancedSearchComponent', () => {
   let fixture: ComponentFixture<AdvancedSearchComponent>;
 
   let router: RouterStub;
+  let searchService: SearchServiceStub;
   let searchConfigurationService: SearchConfigurationServiceStub;
   let searchFilterService: SearchFilterServiceStub;
 
   beforeEach(async () => {
     router = new RouterStub();
+    searchService = new SearchServiceStub();
     searchConfigurationService = new SearchConfigurationServiceStub();
     searchFilterService = new SearchFilterServiceStub();
 
@@ -30,6 +34,7 @@ describe('AdvancedSearchComponent', () => {
       ],
       providers: [
         { provide: Router, useValue: router },
+        { provide: SearchService, useValue: searchService },
         { provide: SearchConfigurationService, useValue: searchConfigurationService },
         { provide: SearchFilterService, useValue: searchFilterService },
       ],

src/app/shared/search/advanced-search/advanced-search.component.ts

@@ -1,19 +1,21 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, OnDestroy } from '@angular/core';
-import { map, Observable, of as observableOf } from 'rxjs';
+import { map, Observable, of as observableOf, Subscription } from 'rxjs';
+import { take } from 'rxjs/operators';
 import { SearchConfigurationService } from '../../../core/shared/search/search-configuration.service';
 import { FilterConfig, SearchConfig } from '../../../core/shared/search/search-filters/search-config.model';
 import { SearchFilterService } from '../../../core/shared/search/search-filter.service';
 import { SearchFilterConfig } from '../models/search-filter-config.model';
-import { Router } from '@angular/router';
+import { Router, Params } from '@angular/router';
 import { InputSuggestion } from '../../input-suggestions/input-suggestions.model';
-import { hasValue } from '../../empty.util';
+import { hasValue, isNotEmpty } from '../../empty.util';
+import { SearchService } from '../../../core/shared/search/search.service';
 
 @Component({
   selector: 'ds-advanced-search',
   templateUrl: './advanced-search.component.html',
   styleUrls: ['./advanced-search.component.scss'],
 })
-export class AdvancedSearchComponent implements OnInit {
+export class AdvancedSearchComponent implements OnInit, OnDestroy {
 
   @Input() configuration: string;
 
@@ -37,8 +39,11 @@ export class AdvancedSearchComponent implements OnInit {
    */
   filterSearchResults$: Observable<InputSuggestion[]> = observableOf([]);
 
+  subs: Subscription[] = [];
+
   constructor(
     protected router: Router,
+    protected searchService: SearchService,
     protected searchConfigurationService: SearchConfigurationService,
     protected searchFilterService: SearchFilterService,
   ) {
@@ -63,6 +68,10 @@ export class AdvancedSearchComponent implements OnInit {
     );
   }
 
+  ngOnDestroy(): void {
+    this.subs.forEach((sub: Subscription) => sub.unsubscribe());
+  }
+
   findSuggestions(query: string): void {
     if (hasValue(this.filtersConfig)) {
       for (const filterConfig of this.filtersConfig) {
@@ -73,4 +82,15 @@ export class AdvancedSearchComponent implements OnInit {
     }
   }
 
+  applyFilter(): void {
+    if (isNotEmpty(this.currentValue)) {
+      this.subs.push(this.searchConfigurationService.selectNewAppliedFilterParams(this.currentFilter, this.currentValue.trim(), this.currentOperator).pipe(take(1)).subscribe((params: Params) => {
+        void this.router.navigate([this.searchService.getSearchLink()], {
+          queryParams: params,
+        });
+        this.currentValue = '';
+      }));
+    }
+  }
+
 }