[ADF-4056][ADF-4060][ADF-3930] Content Node Selector fix (#4293)

* remove target when search

* content panel component infinite pagiantion and dropdown integration

* fix insight karma

lib/content-services/content-node-selector/content-node-selector-panel.component.html

@@ -65,6 +65,7 @@
             [contextMenuActions]="false"
             [contentActions]="false"
             [allowDropFiles]="false"
+            [sorting]="'server'"
             [where]="where"
             (folderChange)="onFolderChange()"
             (ready)="onFolderLoaded()"
@@ -89,7 +90,7 @@
         </adf-document-list>
 
         <adf-infinite-pagination
-            [target]="documentList"
+            [target]="target"
             [loading]="loadingSearchResults"
             (loadMore)="getNextPageOfSearch($event)"
             data-automation-id="content-node-selector-search-pagination">

lib/content-services/content-node-selector/content-node-selector-panel.component.scss

@@ -84,6 +84,7 @@
                 height: 200px;
                 overflow: auto;
                 border: 1px solid mat-color($foreground, base, 0.07);
+                padding: 1px;
 
                 .adf-highlight {
                     color: mat-color($primary);

lib/content-services/content-node-selector/content-node-selector-panel.component.spec.ts

@@ -116,6 +116,10 @@ describe('ContentNodeSelectorComponent', () => {
                 fixture.detectChanges();
             });
 
+            it('should the document list use the server ordering', () => {
+                expect(component.documentList.sorting).toBe('server');
+            });
+
             it('should trigger the select event when selection has been made', (done) => {
                 const expectedNode = <Node> {};
                 component.select.subscribe((nodes) => {
@@ -350,6 +354,13 @@ describe('ContentNodeSelectorComponent', () => {
                 const expectedDefaultFolderNode = <NodeEntry> { entry: { path: { elements: [] } } };
 
                 spyOn(documentListService, 'getFolderNode').and.returnValue(of(expectedDefaultFolderNode));
+                spyOn(documentListService, 'getFolder').and.returnValue(of({
+                    list: {
+                        pagination: {},
+                        entries: [],
+                        source: {}
+                    }
+                }));
 
                 const sitesService = TestBed.get(SitesService);
                 spyOn(sitesService, 'getSites').and.returnValue(of({ list: { entries: [] } }));
@@ -364,6 +375,8 @@ describe('ContentNodeSelectorComponent', () => {
                     });
 
                 component.currentFolderId = 'cat-girl-nuku-nuku';
+                component.documentList.ngOnInit();
+
                 fixture.detectChanges();
             });
 
@@ -775,6 +788,44 @@ describe('ContentNodeSelectorComponent', () => {
                     const paginationLoading = fixture.debugElement.query(spinnerSelector);
                     expect(paginationLoading).not.toBeNull();
                 }));
+
+                it('Should infinite pagination target be null when we use it for search ', fakeAsync(() => {
+                    component.showingSearchResults = true;
+
+                    typeToSearchBox('shenron');
+
+                    tick(debounceSearch);
+
+                    fixture.detectChanges();
+
+                    tick(debounceSearch);
+
+                    expect(component.target).toBeNull();
+                }));
+
+                it('Should infinite pagination target be present when search finish', fakeAsync(() => {
+                    component.showingSearchResults = true;
+
+                    typeToSearchBox('shenron');
+
+                    tick(debounceSearch);
+
+                    fixture.detectChanges();
+
+                    typeToSearchBox('');
+
+                    tick(debounceSearch);
+
+                    fixture.detectChanges();
+
+                    expect(component.target).not.toBeNull();
+                }));
+
+                it('Should infinite pagination target on init be the document list', fakeAsync(() => {
+                    component.showingSearchResults = true;
+
+                    expect(component.target).toEqual(component.documentList);
+                }));
             });
         });
 

lib/content-services/content-node-selector/content-node-selector-panel.component.ts

@@ -21,7 +21,7 @@ import {
     UserPreferencesService,
     PaginationModel,
     UserPreferenceValues,
-    InfinitePaginationComponent
+    InfinitePaginationComponent, PaginatedComponent
 } from '@alfresco/adf-core';
 import { FormControl } from '@angular/forms';
 import { Node, NodePaging, Pagination, SiteEntry, SitePaging } from '@alfresco/js-api';
@@ -163,6 +163,8 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
     debounceSearch: number = 200;
     searchInput: FormControl = new FormControl();
 
+    target: PaginatedComponent;
+
     constructor(private contentNodeSelectorService: ContentNodeSelectorService,
                 private customResourcesService: CustomResourcesService,
                 private userPreferencesService: UserPreferencesService) {
@@ -194,6 +196,7 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
     }
 
     ngOnInit() {
+        this.target = this.documentList;
         this.folderIdToShow = this.currentFolderId;
 
         this.breadcrumbTransform = this.breadcrumbTransform ? this.breadcrumbTransform : null;
@@ -232,6 +235,7 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
     siteChanged(chosenSite: SiteEntry): void {
         this.siteId = chosenSite.entry.guid;
         this.updateResults();
+
     }
 
     /**
@@ -274,7 +278,6 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
         this.searchTerm = '';
         this.nodePaging = null;
         this.pagination.maxItems = this.pageSize;
-        this.infinitePaginationComponent.reset();
         this.chosenNode = null;
         this.showingSearchResults = false;
     }
@@ -283,6 +286,8 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
      * Update the result list depending on the criteria
      */
     private updateResults(): void {
+        this.target = this.searchTerm.length > 0 ? null : this.documentList;
+
         if (this.searchTerm.length === 0) {
             this.clear();
         } else {
@@ -296,7 +301,9 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
     private startNewSearch(): void {
         this.nodePaging = null;
         this.pagination.maxItems = this.pageSize;
+        if (this.target) {
             this.infinitePaginationComponent.reset();
+        }
         this.chosenNode = null;
         this.folderIdToShow = null;
         this.querySearch();

lib/content-services/karma.conf.js

@@ -22,10 +22,13 @@ module.exports = function (config) {
                 watched: false
             },
 
-            {pattern: 'node_modules/alfresco-js-api/dist/alfresco-js-api.min.js', included: true, watched: false},
             {pattern: 'node_modules/moment/min/moment.min.js', included: true, watched: false},
 
+            {pattern: 'node_modules/pdfjs-dist/build/pdf.worker.js.map', included: false, served: true, watched: false},
+            {pattern: 'node_modules/pdfjs-dist/build/pdf.js.map', included: false, served: true, watched: false},
+            {pattern: 'node_modules/pdfjs-dist/web/pdf_viewer.js.map', included: false, served: true, watched: false},
             {pattern: 'lib/content-services/i18n/**/en.json', included: false, served: true, watched: false},
+            {pattern: 'lib/core/assets/images/ft_ic_folder.svg', included: false, served: true, watched: false},
             {pattern: 'lib/core/i18n/**/en.json', included: false, served: true, watched: false},
             {pattern: 'lib/content-services/**/*.ts', included: false, served: true, watched: false},
             {pattern: 'lib/config/app.config.json', included: false, served: true, watched: false},
@@ -35,6 +38,7 @@ module.exports = function (config) {
 
         proxies: {
             '/base/assets/': '/base/lib/content-services/assets/',
+            '/base/lib/content-services/assets/images/ft_ic_folder.svg': '/base/lib/core/assets/images/ft_ic_folder.svg',
             '/assets/': '/base/lib/content-services/assets/',
             '/assets/adf-content-services/i18n/en.json': '/base/lib/content-services/i18n/en.json',
             '/assets/adf-core/i18n/en.json': '/base/lib/core/i18n/en.json',

lib/core/karma.conf.js

@@ -23,7 +23,6 @@ module.exports = function (config) {
                 watched: false
             },
 
-            {pattern: 'node_modules/alfresco-js-api/dist/alfresco-js-api.min.js', included: true, watched: false},
             {pattern: 'node_modules/moment/min/moment.min.js', included: true, watched: false},
 
             {pattern: 'lib/core/i18n/**/en.json', included: false, served: true, watched: false},

lib/core/pagination/infinite-pagination.component.html

@@ -1,4 +1,5 @@
 <div *ngIf="pagination?.hasMoreItems || isLoading" class="adf-infinite-pagination">
+
     <button mat-button
         *ngIf="!isLoading"
         class="adf-infinite-pagination-load-more"

lib/core/pagination/infinite-pagination.component.spec.ts

@@ -23,7 +23,7 @@ import { PaginatedComponent } from './paginated-component.interface';
 import { BehaviorSubject } from 'rxjs';
 import { setupTestBed } from '../testing/setupTestBed';
 import { CoreTestingModule } from '../testing/core.testing.module';
-import { Component } from '@angular/core';
+import { Component, ChangeDetectorRef } from '@angular/core';
 import { PaginationModel } from '../models/pagination.model';
 import { RequestPaginationModel } from '../models/request-pagination.model';
 
@@ -57,6 +57,7 @@ describe('InfinitePaginationComponent', () => {
     let fixture: ComponentFixture<InfinitePaginationComponent>;
     let component: InfinitePaginationComponent;
     let pagination: Pagination;
+    let changeDetectorRef: ChangeDetectorRef;
 
     setupTestBed({
         imports: [CoreTestingModule],
@@ -68,6 +69,7 @@ describe('InfinitePaginationComponent', () => {
     beforeEach(() => {
         fixture = TestBed.createComponent(InfinitePaginationComponent);
         component = fixture.componentInstance;
+        changeDetectorRef = fixture.componentRef.injector.get(ChangeDetectorRef);
 
         component.target = TestBed.createComponent(TestPaginatedComponent).componentInstance;
         pagination = {
@@ -86,7 +88,7 @@ describe('InfinitePaginationComponent', () => {
             pagination.hasMoreItems = true;
             component.isLoading = true;
             component.target = null;
-            fixture.detectChanges();
+            changeDetectorRef.detectChanges();
 
             let loadingSpinner = fixture.debugElement.query(By.css('[data-automation-id="adf-infinite-pagination-spinner"]'));
             expect(loadingSpinner).not.toBeNull();
@@ -96,7 +98,7 @@ describe('InfinitePaginationComponent', () => {
             pagination.hasMoreItems = true;
             component.target.updatePagination(pagination);
             component.isLoading = false;
-            fixture.detectChanges();
+            changeDetectorRef.detectChanges();
 
             let loadingSpinner = fixture.debugElement.query(By.css('[data-automation-id="adf-infinite-pagination-spinner"]'));
             expect(loadingSpinner).toBeNull();
@@ -106,7 +108,7 @@ describe('InfinitePaginationComponent', () => {
             pagination.hasMoreItems = true;
             component.target.updatePagination(pagination);
             component.isLoading = false;
-            fixture.detectChanges();
+            changeDetectorRef.detectChanges();
 
             let loadMoreButton = fixture.debugElement.query(By.css('[data-automation-id="adf-infinite-pagination-button"]'));
             expect(loadMoreButton).not.toBeNull();
@@ -117,7 +119,7 @@ describe('InfinitePaginationComponent', () => {
 
             component.target.pagination.next(pagination);
 
-            fixture.detectChanges();
+            changeDetectorRef.detectChanges();
 
             component.onLoadMore();
 
@@ -133,7 +135,7 @@ describe('InfinitePaginationComponent', () => {
 
             component.target.pagination.next(pagination);
 
-            fixture.detectChanges();
+            changeDetectorRef.detectChanges();
 
             fixture.whenStable().then(() => {
                 let loadMoreButton = fixture.debugElement.query(By.css('[data-automation-id="adf-infinite-pagination-button"]'));
@@ -145,7 +147,7 @@ describe('InfinitePaginationComponent', () => {
         it('should NOT show anything if pagination has NO more items', () => {
             pagination.hasMoreItems = false;
             component.target.updatePagination(pagination);
-            fixture.detectChanges();
+            changeDetectorRef.detectChanges();
 
             let loadMoreButton = fixture.debugElement.query(By.css('[data-automation-id="adf-infinite-pagination-button"]'));
             expect(loadMoreButton).toBeNull();
@@ -160,7 +162,7 @@ describe('InfinitePaginationComponent', () => {
 
             component.isLoading = false;
             component.pageSize = 5;
-            fixture.detectChanges();
+            changeDetectorRef.detectChanges();
 
             component.loadMore.subscribe((newPagination: Pagination) => {
                 expect(newPagination.skipCount).toBe(0);
@@ -178,7 +180,7 @@ describe('InfinitePaginationComponent', () => {
 
             component.isLoading = false;
             component.pageSize = 5;
-            fixture.detectChanges();
+            changeDetectorRef.detectChanges();
 
             component.loadMore.subscribe((newPagination: RequestPaginationModel) => {
                 expect(newPagination.merge).toBe(false);

lib/core/pagination/infinite-pagination.component.ts

@@ -29,6 +29,7 @@ import { PaginationComponentInterface } from './pagination-component.interface';
 import { PaginationModel } from '../models/pagination.model';
 import { RequestPaginationModel } from '../models/request-pagination.model';
 import { UserPreferencesService, UserPreferenceValues } from '../services/user-preferences.service';
+import { Pagination } from '@alfresco/js-api';
 
 @Component({
     selector: 'adf-infinite-pagination',
@@ -40,9 +41,35 @@ import { UserPreferencesService, UserPreferenceValues } from '../services/user-p
 })
 export class InfinitePaginationComponent implements OnInit, OnDestroy, PaginationComponentInterface {
 
+    static DEFAULT_PAGINATION: Pagination = new Pagination({
+        skipCount: 0,
+        maxItems: 25,
+        totalItems: 0
+    });
+
+    _target: PaginatedComponent;
+
     /** Component that provides custom pagination support. */
     @Input()
-    target: PaginatedComponent;
+    set target(target: PaginatedComponent) {
+        if (target) {
+            this._target = target;
+            this.paginationSubscription = target.pagination.subscribe((pagination: PaginationModel) => {
+                this.isLoading = false;
+                this.pagination = pagination;
+
+                if (!this.pagination.hasMoreItems) {
+                    this.pagination.hasMoreItems = false;
+                }
+
+                this.cdr.detectChanges();
+            });
+        }
+    }
+
+    get target() {
+        return this._target;
+    }
 
     /** Number of items that are added with each "load more" event. */
     @Input()
@@ -56,7 +83,7 @@ export class InfinitePaginationComponent implements OnInit, OnDestroy, Paginatio
     @Output()
     loadMore: EventEmitter<RequestPaginationModel> = new EventEmitter<RequestPaginationModel>();
 
-    pagination: PaginationModel;
+    pagination: PaginationModel = InfinitePaginationComponent.DEFAULT_PAGINATION;
 
     requestPaginationModel: RequestPaginationModel = {
         skipCount: 0,
@@ -69,19 +96,6 @@ export class InfinitePaginationComponent implements OnInit, OnDestroy, Paginatio
     }
 
     ngOnInit() {
-        if (this.target) {
-            this.paginationSubscription = this.target.pagination.subscribe((pagination: PaginationModel) => {
-                this.isLoading = false;
-                this.pagination = pagination;
-
-                if (!this.pagination.hasMoreItems) {
-                    this.pagination.hasMoreItems = false;
-                }
-
-                this.cdr.detectChanges();
-            });
-        }
-
         this.userPreferencesService.select(UserPreferenceValues.PaginationSize).subscribe((pagSize) => {
             this.pageSize = this.pageSize || pagSize;
             this.requestPaginationModel.maxItems = this.pageSize;
@@ -96,16 +110,19 @@ export class InfinitePaginationComponent implements OnInit, OnDestroy, Paginatio
 
         this.loadMore.next(this.requestPaginationModel);
 
-        if (this.target) {
+        if (this._target) {
             this.isLoading = true;
-            this.target.updatePagination(<RequestPaginationModel> this.requestPaginationModel);
+            this._target.updatePagination(<RequestPaginationModel> this.requestPaginationModel);
         }
     }
 
     reset() {
         this.pagination.skipCount = 0;
         this.pagination.maxItems = this.pageSize;
-        this.target.updatePagination(this.pagination);
+
+        if (this._target) {
+            this._target.updatePagination(this.pagination);
+        }
     }
 
     ngOnDestroy() {

lib/insights/karma.conf.js

@@ -31,7 +31,6 @@ module.exports = function (config) {
                 watched: false
             },
 
-            {pattern: '../../node_modules/alfresco-js-api/dist/alfresco-js-api.min.js', included: true, watched: false},
             {pattern: '../../node_modules/moment/min/moment.min.js', included: true, watched: false},
 
             {pattern: './i18n/**/en.json', included: false, served: true, watched: false},

lib/process-services/karma.conf.js

@@ -30,7 +30,6 @@ module.exports = function (config) {
                 watched: false
             },
 
-            { pattern: 'node_modules/alfresco-js-api/dist/alfresco-js-api.min.js', included: true, watched: false },
             { pattern: 'node_modules/moment/min/moment.min.js', included: true, watched: false },
 
             { pattern: 'lib/core/i18n/**/en.json', included: false, served: true, watched: false },