111731: Hide advanced search section when no filters are available and hide it on the home page

Author: alexandrevryghem

src/app/core/shared/search/search-configuration.service.ts

@@ -29,6 +29,8 @@ import { ViewMode } from '../view-mode.model';
 import { SearchFilterConfig } from '../../../shared/search/models/search-filter-config.model';
 import { FacetConfigResponse } from '../../../shared/search/models/facet-config-response.model';
 import { addOperatorToFilterValue } from '../../../shared/search/search.utils';
+import { FilterConfig } from './search-filters/search-config.model';
+import { FilterType } from '../../../shared/search/models/filter-type.model';
 
 /**
  * Service that performs all actions that have to do with the current search configuration
@@ -251,6 +253,21 @@ export class SearchConfigurationService implements OnDestroy {
     }));
   }
 
+  /**
+   * Return the {@link FilterConfig}s of the filters that should be displayed for the current configuration/scope
+   *
+   * @param configuration The search configuration
+   * @param scope The scope if exists
+   */
+  public getConfigurationAdvancedSearchFilters(configuration: string, scope?: string): Observable<FilterConfig[]> {
+    return this.getConfigurationSearchConfig(configuration, scope).pipe(
+      map((searchConfiguration: SearchConfig) => {
+        return searchConfiguration.filters
+          .filter((filterConfig: FilterConfig) => filterConfig.type !== FilterType.range);
+      }),
+    );
+  }
+
   setPaginationId(paginationId): void {
     if (isNotEmpty(paginationId)) {
       const currentValue: PaginatedSearchOptions = this.paginatedSearchOptions.getValue();

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

@@ -1,8 +1,8 @@
 import { Component, Input, OnInit, OnDestroy } from '@angular/core';
-import { map, Observable, of as observableOf, Subscription } from 'rxjs';
+import { 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 { FilterConfig } 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, Params } from '@angular/router';
@@ -11,17 +11,31 @@ import { hasValue, isNotEmpty } from '../../empty.util';
 import { SearchService } from '../../../core/shared/search/search.service';
 import { FilterType } from '../models/filter-type.model';
 
+/**
+ * This component represents the advanced search in the search sidebar.
+ */
 @Component({
   selector: 'ds-advanced-search',
   templateUrl: './advanced-search.component.html',
   styleUrls: ['./advanced-search.component.scss'],
 })
 export class AdvancedSearchComponent implements OnInit, OnDestroy {
 
+  /**
+   * The current search configuration
+   */
   @Input() configuration: string;
 
+  /**
+   * The facet configurations, used to determine if suggestions should be retrieved for the selected search filter
+   */
   @Input() filtersConfig: SearchFilterConfig[];
 
+  /**
+   * The current search scope
+   */
+  @Input() scope: string;
+
   advancedFilters$: Observable<FilterConfig[]>;
 
   advancedFilterMap: Map<string, FilterConfig> = new Map();
@@ -51,9 +65,7 @@ export class AdvancedSearchComponent implements OnInit, OnDestroy {
   }
 
   ngOnInit(): void {
-    this.advancedFilters$ = this.searchConfigurationService.getConfigurationSearchConfig(this.configuration).pipe(
-      map((searchConfiguration: SearchConfig) => searchConfiguration.filters.filter((filter: FilterConfig) => filter.type !== FilterType.range)),
-    );
+    this.advancedFilters$ = this.searchConfigurationService.getConfigurationAdvancedSearchFilters(this.configuration, this.scope);
     this.subs.push(this.advancedFilters$.subscribe((filters: FilterConfig[]) => {
       const filterMap: Map<string, FilterConfig> = new Map();
       if (filters.length > 0) {

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

@@ -23,8 +23,10 @@
                                [refreshFilters]="refreshFilters"
                                [inPlaceSearch]="inPlaceSearch">
             </ds-themed-search-filters>
-            <ds-advanced-search [configuration]="configuration"
-                                [filtersConfig]="(filters | async)?.payload">
+            <ds-advanced-search *ngIf="inPlaceSearch && (this.showAdvancedSearch$ | async) === true"
+                                [configuration]="configuration"
+                                [filtersConfig]="(filters | async)?.payload"
+                                [scope]="currentScope">
             </ds-advanced-search>
             <ds-themed-search-settings [currentSortOption]="currentSortOption"
                                        [sortOptionsList]="sortOptionsList"></ds-themed-search-settings>

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

@@ -3,19 +3,30 @@ import { TranslateModule } from '@ngx-translate/core';
 import { SearchSidebarComponent } from './search-sidebar.component';
 import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap';
 import { By } from '@angular/platform-browser';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { SearchConfigurationServiceStub } from '../../testing/search-configuration-service.stub';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { SearchConfigurationService } from '../../../core/shared/search/search-configuration.service';
 
 describe('SearchSidebarComponent', () => {
   let comp: SearchSidebarComponent;
   let fixture: ComponentFixture<SearchSidebarComponent>;
-  // waitForAsync beforeEach
+
+  let searchConfigurationService: SearchConfigurationServiceStub;
+
   beforeEach(waitForAsync(() => {
+    searchConfigurationService = new SearchConfigurationServiceStub();
+
     TestBed.configureTestingModule({
-      imports: [TranslateModule.forRoot(), NgbCollapseModule],
+      imports: [
+        TranslateModule.forRoot(),
+        NgbCollapseModule,
+      ],
       declarations: [SearchSidebarComponent],
-      schemas: [NO_ERRORS_SCHEMA],
-    })
-      .compileComponents();  // compile template and css
+      providers: [
+        { provide: SearchConfigurationService, useValue: searchConfigurationService },
+      ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    }).compileComponents();
   }));
 
   // synchronous beforeEach

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

@@ -1,4 +1,5 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { Component, EventEmitter, Input, Output, OnInit } from '@angular/core';
+import { map } from 'rxjs/operators';
 
 import { SearchConfigurationOption } from '../search-switch-configuration/search-configuration-option.model';
 import { BehaviorSubject, Observable } from 'rxjs';
@@ -7,6 +8,8 @@ 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 { SearchConfigurationService } from '../../../core/shared/search/search-configuration.service';
+import { FilterConfig } from '../../../core/shared/search/search-filters/search-config.model';
 
 /**
  * This component renders a simple item page.
@@ -23,7 +26,7 @@ import { SearchFilterConfig } from '../models/search-filter-config.model';
 /**
  * Component representing the sidebar on the search page
  */
-export class SearchSidebarComponent {
+export class SearchSidebarComponent implements OnInit {
 
   /**
    * The configuration to use for the search options
@@ -100,4 +103,17 @@ export class SearchSidebarComponent {
    */
   @Output() changeViewMode: EventEmitter<ViewMode> = new EventEmitter<ViewMode>();
 
+  showAdvancedSearch$: Observable<boolean>;
+
+  constructor(
+    protected searchConfigurationService: SearchConfigurationService,
+  ) {
+  }
+
+  ngOnInit(): void {
+    this.showAdvancedSearch$ = this.searchConfigurationService.getConfigurationAdvancedSearchFilters(this.configuration, this.currentScope).pipe(
+      map((advancedFilters: FilterConfig[]) => advancedFilters.length > 0),
+    );
+  }
+
 }

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

@@ -72,6 +72,7 @@
                        [searchOptions]="(searchOptions$ | async)"
                        [sortOptionsList]="(sortOptionsList$ | async)"
                        [currentSortOption]="(currentSortOptions$ | async)"
+                       [inPlaceSearch]="inPlaceSearch"
                        [viewModeList]="viewModeList"
                        [showViewModes]="showViewModes"
                        (toggleSidebar)="closeSidebar()"

src/app/shared/testing/search-configuration-service.stub.ts

@@ -1,7 +1,13 @@
 import { BehaviorSubject, of as observableOf, Observable } from 'rxjs';
 import { Params } from '@angular/router';
-import { SearchConfig } from '../../core/shared/search/search-filters/search-config.model';
-
+import {
+  FilterConfig,
+  SearchConfig,
+} from '../../core/shared/search/search-filters/search-config.model';
+
+/**
+ * Stub class of {@link SearchConfigurationService}
+ */
 export class SearchConfigurationServiceStub {
 
   public paginationID = 'test-id';
@@ -25,6 +31,10 @@ export class SearchConfigurationServiceStub {
     return observableOf(a);
   }
 
+  getConfigurationAdvancedSearchFilters(_configuration: string, _scope?: string): Observable<FilterConfig[]> {
+    return observableOf([]);
+  }
+
   getConfig () {
     return observableOf({ hasSucceeded: true, payload: [] });
   }