[ADF-2150] improved queryBody mechanism (#2852)

* [ADF-2150] changed query body parameter to a function

* [ADF-2150] added an example page where to try change query body

* [ADF-2150] improved queryBody mechanism

* [ADF-2150] fixed content node test

* [ADF-2150] extended docs added another way to use the query node

* [ADF-2150] fixed test for search on content node

* [ADF-2150] added some improvements to service config

* [ADF-2150] changed the documentation accordingly

* [ADF-2150] added PR changes

* [ADF-2150] fixed jdoc

* [ADF-2150] added checkbox to switch from service approach to input object approach

* [ADF-2150] fixed build error on demo shell

lib/content-services/search/components/search-control.component.html

@@ -27,8 +27,8 @@
 
 <adf-search #auto="searchAutocomplete"
             class="adf-search-result-autocomplete"
-            [queryBody]="customQueryBody"
-            [maxResults]="liveSearchMaxResults">
+            [maxResults]="liveSearchMaxResults"
+            [queryBody]="customQueryBody">
     <ng-template let-data>
         <mat-list *ngIf="isSearchBarActive()" id="autocomplete-search-result-list">
             <mat-list-item

lib/content-services/search/components/search-control.component.ts

@@ -63,6 +63,7 @@ export class SearchControlComponent implements OnInit, OnDestroy {
     @Input()
     liveSearchMaxResults: number = 5;
 
+    /** @deprecated in 2.1.0 */
     @Input()
     customQueryBody: QueryBody;
 

lib/content-services/search/components/search.component.spec.ts

@@ -23,10 +23,10 @@ import { SearchModule } from '../../index';
 import { differentResult, folderResult, result, SimpleSearchTestComponent } from '../../mock';
 
 function fakeNodeResultSearch(searchNode: QueryBody): Observable<any> {
-    if (searchNode.query.query === 'FAKE_SEARCH_EXMPL') {
+    if (searchNode && searchNode.query.query === 'FAKE_SEARCH_EXMPL') {
         return Observable.of(differentResult);
     }
-    if (searchNode.filterQueries.length === 1 &&
+    if (searchNode && searchNode.filterQueries.length === 1 &&
         searchNode.filterQueries[0].query === "TYPE:'cm:folder'") {
         return Observable.of(folderResult);
     }
@@ -132,18 +132,18 @@ describe('SearchComponent', () => {
         });
 
         it('should perform a search based on the query node given', async(() => {
-            spyOn(searchService, 'search')
-                .and.callFake((searchObj) => fakeNodeResultSearch(searchObj));
+            spyOn(searchService, 'searchByQueryBody')
+                    .and.callFake((searchObj) => fakeNodeResultSearch(searchObj));
             let fakeSearchNode: QueryBody = {
                 query: {
-                    query: ''
+                    query: 'TEST-FAKE-NODE'
                 },
                 filterQueries: [
                     { 'query': "TYPE:'cm:folder'" }
                 ]
             };
-            component.setSearchNodeTo(fakeSearchNode);
             component.setSearchWordTo('searchTerm');
+            component.setSearchNodeTo(fakeSearchNode);
             fixture.detectChanges();
             fixture.whenStable().then(() => {
                 fixture.detectChanges();
@@ -156,7 +156,7 @@ describe('SearchComponent', () => {
 
         it('should perform a search with a defaultNode if no searchnode is given', async(() => {
             spyOn(searchService, 'search')
-                .and.callFake((searchObj) => fakeNodeResultSearch(searchObj));
+                .and.returnValue(Observable.of(result));
             component.setSearchWordTo('searchTerm');
             fixture.detectChanges();
             fixture.whenStable().then(() => {
@@ -169,7 +169,7 @@ describe('SearchComponent', () => {
         }));
 
         it('should perform a search with the searchNode given', async(() => {
-            spyOn(searchService, 'search')
+            spyOn(searchService, 'searchByQueryBody')
                 .and.callFake((searchObj) => fakeNodeResultSearch(searchObj));
             let fakeSearchNode: QueryBody = {
                 query: {
@@ -179,6 +179,7 @@ describe('SearchComponent', () => {
                     { 'query': "TYPE:'cm:folder'" }
                 ]
             };
+            component.setSearchWordTo('searchTerm');
             component.setSearchNodeTo(fakeSearchNode);
             fixture.detectChanges();
             fixture.whenStable().then(() => {

lib/content-services/search/components/search.component.ts

@@ -18,8 +18,6 @@
 import { SearchService } from '@alfresco/adf-core';
 import {
     AfterContentInit,
-    ChangeDetectionStrategy,
-    ChangeDetectorRef,
     Component,
     ContentChild,
     ElementRef,
@@ -40,7 +38,6 @@ import { Subject } from 'rxjs/Subject';
     styleUrls: ['./search.component.scss'],
     encapsulation: ViewEncapsulation.None,
     preserveWhitespaces: false,
-    changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'searchAutocomplete',
     host: {
         'class': 'adf-search'
@@ -63,12 +60,13 @@ export class SearchComponent implements AfterContentInit, OnChanges {
     @Input()
     skipResults: number = 0;
 
-    @Input()
-    searchTerm: string = '';
-
+    /** @deprecated in 2.1.0 */
     @Input()
     queryBody: QueryBody;
 
+    @Input()
+    searchTerm: string = '';
+
     @Input('class')
     set classList(classList: string) {
         if (classList && classList.length) {
@@ -101,13 +99,13 @@ export class SearchComponent implements AfterContentInit, OnChanges {
     _classList: { [key: string]: boolean } = {};
 
     constructor(private searchService: SearchService,
-                private changeDetectorRef: ChangeDetectorRef,
                 private _elementRef: ElementRef) {
         this.keyPressedStream.asObservable()
             .debounceTime(200)
             .subscribe((searchedWord: string) => {
                 this.loadSearchResults(searchedWord);
             });
+
     }
 
     ngAfterContentInit() {
@@ -115,14 +113,12 @@ export class SearchComponent implements AfterContentInit, OnChanges {
     }
 
     ngOnChanges(changes) {
-        this.resetResults();
-
+        if (changes.queryBody &&
+            this.hasDifferentQueryBody(changes.queryBody.previousValue, changes.queryBody.currentValue)) {
+            this.loadSearchResults();
+        }
         if (changes.searchTerm && changes.searchTerm.currentValue) {
             this.loadSearchResults(changes.searchTerm.currentValue);
-        } else if (changes.queryBody && changes.queryBody.currentValue) {
-            this.loadSearchResults();
-        } else {
-            this.loadSearchResults(this.searchTerm);
         }
     }
 
@@ -135,23 +131,27 @@ export class SearchComponent implements AfterContentInit, OnChanges {
         this.loadSearchResults(this.searchTerm);
     }
 
+    private hasDifferentQueryBody(previousQueryBody: QueryBody, currentQueryBody: QueryBody) {
+        return JSON.stringify(previousQueryBody) !== JSON.stringify(currentQueryBody);
+    }
+
     private cleanResults() {
         if (this.results) {
             this.results = {};
         }
     }
 
-    private hasValidSearchQuery(searchOpts: QueryBody) {
-        return searchOpts && searchOpts.query && searchOpts.query.query;
-    }
-
     private loadSearchResults(searchTerm?: string) {
-        let searchOpts: QueryBody = this.getQueryBody(searchTerm);
-
-        if (this.hasValidSearchQuery(searchOpts)) {
-            this.searchService
-                .search(searchOpts)
-                .subscribe(
+        this.resetResults();
+        if (searchTerm) {
+            let search$;
+            if (this.queryBody) {
+                search$ = this.searchService.searchByQueryBody(this.queryBody);
+            } else {
+                search$ = this.searchService
+                    .search(searchTerm, this.maxResults.toString(), this.skipResults.toString());
+            }
+            search$.subscribe(
                     results => {
                         this.results = <NodePaging> results;
                         this.resultLoaded.emit(this.results);
@@ -169,41 +169,11 @@ export class SearchComponent implements AfterContentInit, OnChanges {
         }
     }
 
-    private getQueryBody(searchTerm: string): QueryBody {
-        if (this.queryBody) {
-            if (!this.queryBody.query.query && searchTerm) {
-                this.queryBody.query.query = searchTerm;
-            }
-            return this.queryBody;
-        } else {
-            return this.generateDefaultSearchNode(searchTerm);
-        }
-    }
-
-    private generateDefaultSearchNode(searchTerm: string): QueryBody {
-        let defaultQueryBody: QueryBody = {
-            query: {
-                query: searchTerm ? `${searchTerm}* OR name:${searchTerm}*` : searchTerm
-            },
-            include: ['path', 'allowableOperations'],
-            paging: {
-                maxItems: this.maxResults.toString(),
-                skipCount: this.skipResults.toString()
-            },
-            filterQueries: [
-                { query: "TYPE:'cm:folder' OR TYPE:'cm:content'" },
-                { query: 'NOT cm:creator:System' }]
-        };
-
-        return defaultQueryBody;
-    }
-
     hidePanel() {
         if (this.isOpen) {
             this._classList['adf-search-show'] = false;
             this._classList['adf-search-hide'] = true;
             this.isOpen = false;
-            this.changeDetectorRef.markForCheck();
         }
     }
 
@@ -211,6 +181,5 @@ export class SearchComponent implements AfterContentInit, OnChanges {
         this.showPanel = !!this.results && !!this.results.list;
         this._classList['adf-search-show'] = this.showPanel;
         this._classList['adf-search-hide'] = !this.showPanel;
-        this.changeDetectorRef.markForCheck();
     }
 }