implemented feedback

src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.html

@@ -34,9 +34,8 @@
                           [name]="filterConfig.paramName"
                           [(ngModel)]="filter"
                           (submitSuggestion)="onSubmit($event)"
-                          (clickSuggestion)="onSubmit($event)"
+                          (clickSuggestion)="onClick($event)"
                           (findSuggestions)="findSuggestions($event)"
-                          [getDisplayValue]="getDisplayValue"
                           ngDefaultControl
     ></ds-input-suggestions>
 </div>

src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.scss

@@ -7,6 +7,9 @@
         &:hover, &focus {
           text-decoration: none;
         }
+        span.badge {
+            vertical-align: text-top;
+        }
     }
     .toggle-more-filters a {
         color: $link-color;

src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts

@@ -43,7 +43,7 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
   filter: string;
   pageChange = false;
   sub: Subscription;
-  filterSearchResults: Observable<string[]> = Observable.of([]);
+  filterSearchResults: Observable<any[]> = Observable.of([]);
 
   constructor(private searchService: SearchService, private filterService: SearchFilterService, private router: Router) {
   }
@@ -108,6 +108,10 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
     this.filterSearchResults = Observable.of([]);
   }
 
+  onClick(data: any) {
+    this.filter = data;
+  }
+
   hasValue(o: any): boolean {
     return hasValue(o);
   }
@@ -144,7 +148,9 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
             .first()
             .map(
               (rd: RemoteData<PaginatedList<FacetValue>>) => {
-                return rd.payload.page.map((facet) => facet.value)
+                return rd.payload.page.map((facet) => {
+                  return {displayValue: this.getDisplayValue(facet, data), value: facet.value}
+                })
               }
             );
         }
@@ -154,7 +160,8 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
     }
   }
 
-  getDisplayValue(value: string, searchValue: string) {
+  getDisplayValue(facet: FacetValue, query: string): string {
-    return new EmphasizePipe().transform(value, searchValue);
+    return new EmphasizePipe().transform(facet.value, query) + ' (' + facet.count + ')';
   }
+
 }

src/app/+search-page/search-options.model.ts

@@ -24,7 +24,7 @@ export class SearchOptions {
     }
     if (isNotEmpty(this.filters)) {
       Object.entries(this.filters).forEach(([key, values]) => {
-        values.forEach((value) => args.push(`${key}=${value},equals`));
+        values.forEach((value) => args.push(`${key}=${value},query`));
       });
     }
     if (isNotEmpty(args)) {

src/app/shared/input-suggestions/input-suggestions.component.html

@@ -12,8 +12,8 @@
     <div class="autocomplete dropdown-menu" [ngClass]="{'show': (show | async) && isNotEmpty(suggestions)}">
         <ul class="list-unstyled">
             <li *ngFor="let suggestionOption of suggestions">
-                <a href="#" class="d-block"  class="dropdown-item" (click)="onClickSuggestion(suggestionOption)" #suggestion>
+                <a href="#" class="d-block"  class="dropdown-item" (click)="onClickSuggestion(suggestionOption.value)" #suggestion>
-                    <span [innerHTML]="getDisplayValue(suggestionOption, inputField.value)"></span>
+                    <span [innerHTML]="suggestionOption.displayValue"></span>
                 </a>
             </li>
         </ul>

src/app/shared/input-suggestions/input-suggestions.component.spec.ts

@@ -14,7 +14,7 @@ describe('InputSuggestionsComponent', () => {
   let fixture: ComponentFixture<InputSuggestionsComponent>;
   let de: DebugElement;
   let el: HTMLElement;
-  const suggestions = ['suggestion uno', 'suggestion dos', 'suggestion tres'];
+  const suggestions = [{displayValue: 'suggestion uno', value: 'suggestion uno'}, {displayValue: 'suggestion dos', value: 'suggestion dos'}, {displayValue: 'suggestion tres', value: 'suggestion tres'}];
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
@@ -299,7 +299,7 @@ describe('InputSuggestionsComponent', () => {
       fixture.detectChanges();
     });
     it('should call onClickSuggestion() with the suggestion as a parameter', () => {
-      expect(comp.onClickSuggestion).toHaveBeenCalledWith(suggestions[clickedIndex]);
+      expect(comp.onClickSuggestion).toHaveBeenCalledWith(suggestions[clickedIndex].value);
     });
   });
 

src/app/shared/input-suggestions/input-suggestions.component.ts

@@ -24,7 +24,7 @@ import { ActivatedRoute } from '@angular/router';
 })
 
 export class InputSuggestionsComponent {
-  @Input() suggestions: string[] = [];
+  @Input() suggestions: any[] = [];
   @Input() debounceTime = 500;
   @Input() placeholder = '';
   @Input() action;
@@ -38,7 +38,6 @@ export class InputSuggestionsComponent {
   selectedIndex = -1;
   @ViewChild('inputField') queryInput: ElementRef;
   @ViewChildren('suggestion') resultViews: QueryList<ElementRef>;
-  @Input() getDisplayValue: (value: string, query: string) => string = (value: string, query: string) => value;
 
   ngOnChanges(changes: SimpleChanges) {
     if (hasValue(changes.suggestions)) {
@@ -90,6 +89,8 @@ export class InputSuggestionsComponent {
 
   onClickSuggestion(data) {
     this.clickSuggestion.emit(data);
+    this.close();
+    this.queryInput.nativeElement.focus();
     return false;
   }
 

src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.html

@@ -5,7 +5,7 @@
   <span class="text-muted">
     <ds-truncatable-part [id]="dso.id" [minLines]="1">
             (<span *ngIf="dso.findMetadata('dc.publisher')" class="item-list-publisher"
-                   [innerHTML]="getFirstValue('dc.publisher')">, </span><span
+                   [innerHTML]="getFirstValue('dc.publisher') + ', '"></span><span
             *ngIf="dso.findMetadata('dc.date.issued')" class="item-list-date"
             [innerHTML]="getFirstValue('dc.date.issued')"></span>)
             <span *ngIf="dso.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']).length > 0"