[ADF-2054] Created a new widget to handle uploading file from Share (#2810)

* [ADF-2054] start creating custom upload widget for share integration

* [ADF-2054] changed content node selector service to allow different opening approach

* [ADF-2054] addedd support for multi resource files

* [ADF-2054] fixed base case for upload when only local files are selected

* [ADF-2054] start adding and fixing tests for new share attach button widget

* [ADF-2054] changed test to perfrom a correct check

* [ADF-2054] removed fdescribe

* [ADF-2054] added test for share-widget component

* [ADF-2054] added peer reviews changes

* [ADF-2054] created a module folder for content widgets

* [ADF-2054] fixed wrong import

* [ADF-2054] fixed rebase errors

* [ADF-2054] restored some files changed by rebase

* [ADF-2054] added link to content services to fix packaging issue

* [ADF-2054] renamed widget

lib/content-services/content-node-selector/content-node-dialog.service.spec.ts

@@ -15,25 +15,45 @@
  * limitations under the License.
  */
 
-/*tslint:disable: ban*/
-
-import { async, TestBed } from '@angular/core/testing';
-import { MinimalNodeEntryEntity } from 'alfresco-js-api';
-import { AppConfigService } from '@alfresco/adf-core';
+import { async, TestBed, fakeAsync, tick } from '@angular/core/testing';
+import { MinimalNodeEntryEntity, SitePaging } from 'alfresco-js-api';
+import { AppConfigService, SitesService } from '@alfresco/adf-core';
 import { DocumentListService } from '../document-list/services/document-list.service';
 import { ContentNodeDialogService } from './content-node-dialog.service';
 import { MatDialog } from '@angular/material';
+import { Observable } from 'rxjs/Observable';
 
 const fakeNode: MinimalNodeEntryEntity = <MinimalNodeEntryEntity> {
         id: 'fake',
         name: 'fake-name'
 };
 
+const fakeSiteList: SitePaging = {
+       list: {
+        pagination: {
+            count: 1,
+            hasMoreItems: false,
+            totalItems: 1,
+            skipCount: 0,
+            maxItems: 100
+        },
+        entries: [
+            {
+                entry: {
+                    id: 'FAKE',
+                    guid: 'FAKE-GUID',
+                    title: 'FAKE-SITE-TITLE'
+                }
+            }
+        ]
+    }
+};
+
 describe('ContentNodeDialogService', () => {
 
     let service: ContentNodeDialogService;
-    // let documentListService: DocumentListService;
-    // let contentDialogService: ContentNodeDialogService;
+    let documentListService: DocumentListService;
+    let sitesService: SitesService;
     let materialDialog: MatDialog;
 
     beforeEach(async(() => {
@@ -42,6 +62,7 @@ describe('ContentNodeDialogService', () => {
             providers: [
                 ContentNodeDialogService,
                 DocumentListService,
+                SitesService,
                 MatDialog
             ]
         }).compileComponents();
@@ -52,7 +73,9 @@ describe('ContentNodeDialogService', () => {
         appConfig.config.ecmHost = 'http://localhost:9876/ecm';
 
         service = TestBed.get(ContentNodeDialogService);
+        documentListService = TestBed.get(DocumentListService);
         materialDialog = TestBed.get(MatDialog);
+        sitesService =  TestBed.get(SitesService);
         spyOn(materialDialog, 'open').and.stub();
         spyOn(materialDialog, 'closeAll').and.stub();
 
@@ -67,7 +90,7 @@ describe('ContentNodeDialogService', () => {
         expect(materialDialog.open).toHaveBeenCalled();
     });
 
-    it('should be able to open the dialog when node has NOT permission', () => {
+    it('should NOT be able to open the dialog when node has NOT permission', () => {
         service.openCopyMoveDialog('fake-action', fakeNode, 'noperm').subscribe(
             () => { },
             (error) => {
@@ -76,6 +99,21 @@ describe('ContentNodeDialogService', () => {
             });
     });
 
+    it('should be able to open the dialog using a folder id', fakeAsync(() => {
+        spyOn(documentListService, 'getFolderNode').and.returnValue(Promise.resolve(fakeNode));
+        service.openFileBrowseDialogByFolderId('fake-folder-id').subscribe();
+        tick();
+        expect(materialDialog.open).toHaveBeenCalled();
+    }));
+
+    it('should be able to open the dialog using the first user site', fakeAsync(() => {
+        spyOn(sitesService, 'getSites').and.returnValue(Observable.of(fakeSiteList));
+        spyOn(documentListService, 'getFolderNode').and.returnValue(Promise.resolve(fakeNode));
+        service.openFileBrowseDialogBySite().subscribe();
+        tick();
+        expect(materialDialog.open).toHaveBeenCalled();
+    }));
+
     it('should be able to close the material dialog', () => {
         service.close();
         expect(materialDialog.closeAll).toHaveBeenCalled();

lib/content-services/content-node-selector/content-node-dialog.service.ts

@@ -21,8 +21,8 @@ import { ContentService } from '@alfresco/adf-core';
 import { Subject } from 'rxjs/Subject';
 import { Observable } from 'rxjs/Observable';
 import { ShareDataRow } from '../document-list/data/share-data-row.model';
-import { MinimalNodeEntryEntity } from 'alfresco-js-api';
-import { DataColumn } from '@alfresco/adf-core';
+import { MinimalNodeEntryEntity, SitePaging } from 'alfresco-js-api';
+import { DataColumn, SitesService } from '@alfresco/adf-core';
 import { DocumentListService } from '../document-list/services/document-list.service';
 import { ContentNodeSelectorComponent } from './content-node-selector.component';
 import { ContentNodeSelectorComponentData } from './content-node-selector.component-data.interface';
@@ -31,11 +31,26 @@ import { ContentNodeSelectorComponentData } from './content-node-selector.compon
 export class ContentNodeDialogService {
 
     constructor(private dialog: MatDialog,
-                private contentService?: ContentService,
-                private documentListService?: DocumentListService) { }
+                private contentService: ContentService,
+                private documentListService: DocumentListService,
+                private siteService: SitesService) { }
+
+    openFileBrowseDialogByFolderId(folderNodeId: string): Observable<MinimalNodeEntryEntity[]> {
+        return Observable.fromPromise(this.documentListService.getFolderNode(folderNodeId))
+            .switchMap((node: MinimalNodeEntryEntity) => {
+                return this.openUploadFileDialog('Choose', node);
+        });
+    }
+
+    openFileBrowseDialogBySite(): Observable<MinimalNodeEntryEntity[]> {
+       return this.siteService.getSites().switchMap((response: SitePaging) => {
+            return this.openFileBrowseDialogByFolderId(response.list.entries[0].entry.guid);
+        });
+    }
 
     openCopyMoveDialog(action: string, contentEntry: MinimalNodeEntryEntity, permission?: string): Observable<MinimalNodeEntryEntity[]> {
         if (this.contentService.hasPermission(contentEntry, permission)) {
+
             const select = new Subject<MinimalNodeEntryEntity[]>();
             select.subscribe({
                 complete: this.close.bind(this)
@@ -45,17 +60,43 @@ export class ContentNodeDialogService {
                 title: `${action} '${contentEntry.name}' to ...`,
                 actionName: action,
                 currentFolderId: contentEntry.parentId,
-                rowFilter: this.rowFilter.bind(this, contentEntry.id),
                 imageResolver: this.imageResolver.bind(this),
+                rowFilter : this.rowFilter.bind(this, contentEntry.id),
+                isSelectionValid: this.hasEntityCreatePermission.bind(this),
                 select: select
             };
-            this.dialog.open(ContentNodeSelectorComponent, { data, panelClass: 'adf-content-node-selector-dialog', width: '630px' });
+
+            this.openContentNodeDialog(data, 'adf-content-node-selector-dialog', '630px');
+
             return select;
         } else {
             return Observable.throw({ statusCode: 403 });
         }
     }
 
+    openUploadFileDialog(action: string, contentEntry: MinimalNodeEntryEntity): Observable<MinimalNodeEntryEntity[]> {
+            const select = new Subject<MinimalNodeEntryEntity[]>();
+            select.subscribe({
+                complete: this.close.bind(this)
+            });
+
+            const data: ContentNodeSelectorComponentData = {
+                title: `${action} '${contentEntry.name}' to ...`,
+                actionName: action,
+                currentFolderId: contentEntry.id,
+                imageResolver: this.imageResolver.bind(this),
+                isSelectionValid: this.isNodeFile.bind(this),
+                select: select
+            };
+
+            this.openContentNodeDialog(data, 'adf-content-node-selector-dialog', '630px');
+            return select;
+    }
+
+    private openContentNodeDialog(data: ContentNodeSelectorComponentData, currentPanelClass: string, chosenWidth: string) {
+        this.dialog.open(ContentNodeSelectorComponent, { data, panelClass: currentPanelClass, width: chosenWidth });
+    }
+
     private imageResolver(row: ShareDataRow, col: DataColumn): string | null {
         const entry: MinimalNodeEntryEntity = row.node.entry;
         if (!this.contentService.hasPermission(entry, 'create')) {
@@ -75,7 +116,16 @@ export class ContentNodeDialogService {
         }
     }
 
+    private isNodeFile(entry: MinimalNodeEntryEntity): boolean {
+        return entry.isFile;
+    }
+
+    private hasEntityCreatePermission(entry: MinimalNodeEntryEntity): boolean {
+        return this.contentService.hasPermission(entry, 'create');
+    }
+
     close() {
         this.dialog.closeAll();
     }
+
 }

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

@@ -74,6 +74,10 @@ describe('ContentNodeSelectorComponent', () => {
         _observer.next(result);
     }
 
+    function returnAlwaysTrue(entry: MinimalNodeEntryEntity) {
+        return true;
+    }
+
     function setupTestbed(plusProviders) {
         TestBed.configureTestingModule({
             imports: [
@@ -597,6 +601,7 @@ describe('ContentNodeSelectorComponent', () => {
             beforeEach(() => {
                 const alfrescoContentService = TestBed.get(ContentService);
                 spyOn(alfrescoContentService, 'hasPermission').and.callFake(() => hasPermission);
+                component.isSelectionValid = returnAlwaysTrue.bind(this);
             });
 
             it('should become enabled after loading node with the necessary permissions', async(() => {
@@ -664,14 +669,14 @@ describe('ContentNodeSelectorComponent', () => {
                 fixture.detectChanges();
             });
 
-            it('should be disabled when resetting the chosen node', () => {
+            it('should emit null when the chosenNode is reset', () => {
                 hasPermission = true;
                 component.onNodeSelect({ detail: { node: { entry: <MinimalNodeEntryEntity> {} } } });
                 fixture.detectChanges();
 
                 component.select.subscribe((nodes) => {
                     expect(nodes).toBeDefined();
-                    expect(nodes).not.toBeNull();
+                    expect(nodes).toBeNull();
                 });
 
                 component.resetChosenNode();

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

@@ -26,7 +26,6 @@ import {
 } from '@angular/core';
 import {
     AlfrescoApiService,
-    ContentService,
     HighlightDirective,
     UserPreferencesService
 } from '@alfresco/adf-core';
@@ -38,6 +37,10 @@ import { ImageResolver } from '../document-list/data/image-resolver.model';
 import { ContentNodeSelectorService } from './content-node-selector.service';
 import { debounceTime } from 'rxjs/operators';
 
+export type ValidationFunction = (entry: MinimalNodeEntryEntity) => boolean;
+
+const defaultValidation = () => true;
+
 @Component({
     selector: 'adf-content-node-selector-panel',
     styleUrls: ['./content-node-selector-panel.component.scss'],
@@ -46,19 +49,6 @@ import { debounceTime } from 'rxjs/operators';
 })
 export class ContentNodeSelectorPanelComponent implements OnInit {
 
-    nodes: NodePaging | null = null;
-    siteId: null | string;
-    searchTerm: string = '';
-    showingSearchResults: boolean = false;
-    loadingSearchResults: boolean = false;
-    inDialog: boolean = false;
-    _chosenNode: MinimalNodeEntryEntity = null;
-    folderIdToShow: string | null = null;
-    paginationStrategy: PaginationStrategy;
-    pagination: Pagination;
-    skipCount: number = 0;
-    infiniteScroll: boolean = false;
-
     @Input()
     currentFolderId: string = null;
 
@@ -77,6 +67,9 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
     @Input()
     pageSize: number;
 
+    @Input()
+    isSelectionValid: ValidationFunction = defaultValidation;
+
     @Output()
     select: EventEmitter<MinimalNodeEntryEntity[]> = new EventEmitter<MinimalNodeEntryEntity[]>();
 
@@ -86,12 +79,22 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
     @ViewChild(HighlightDirective)
     highlighter: HighlightDirective;
 
+    nodes: NodePaging | null = null;
+    siteId: null | string;
+    searchTerm: string = '';
+    showingSearchResults: boolean = false;
+    loadingSearchResults: boolean = false;
+    inDialog: boolean = false;
+    _chosenNode: MinimalNodeEntryEntity = null;
+    folderIdToShow: string | null = null;
+    paginationStrategy: PaginationStrategy;
+    pagination: Pagination;
+    skipCount: number = 0;
+    infiniteScroll: boolean = false;
     debounceSearch: number= 200;
-
     searchInput: FormControl = new FormControl();
 
     constructor(private contentNodeSelectorService: ContentNodeSelectorService,
-                private contentService: ContentService,
                 private apiService: AlfrescoApiService,
                 private preferences: UserPreferencesService) {
         this.searchInput.valueChanges
@@ -101,13 +104,16 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
             .subscribe((searchValue) => {
                 this.search(searchValue);
             });
-
         this.pageSize = this.preferences.paginationSize;
     }
 
     set chosenNode(value: MinimalNodeEntryEntity) {
         this._chosenNode = value;
-        this.select.next([value]);
+        let valuesArray = null;
+        if (value) {
+            valuesArray = [value];
+        }
+        this.select.next(valuesArray);
     }
 
     get chosenNode() {
@@ -270,7 +276,7 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
      * @param entry
      */
     private attemptNodeSelection(entry: MinimalNodeEntryEntity): void {
-        if (this.contentService.hasPermission(entry, 'create')) {
+        if (this.isSelectionValid(entry)) {
             this.chosenNode = entry;
         } else {
             this.resetChosenNode();

lib/content-services/content-node-selector/content-node-selector.component-data.interface.ts

@@ -26,5 +26,6 @@ export interface ContentNodeSelectorComponentData {
     dropdownSiteList?: SitePaging;
     rowFilter?: any;
     imageResolver?: any;
+    isSelectionValid?: (entry: MinimalNodeEntryEntity) => boolean;
     select: Subject<MinimalNodeEntryEntity[]>;
 }

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

@@ -11,6 +11,7 @@
         [dropdownSiteList]="dropdownSiteList || data?.dropdownSiteList"
         [rowFilter]="rowFilter || data?.rowFilter"
         [imageResolver]="imageResolver || data?.imageResolver"
+        [isSelectionValid]="data?.isSelectionValid"
         (select)="onSelect($event)">
     </adf-content-node-selector-panel>
 </section>

lib/content-services/content-node-selector/public-api.ts

@@ -19,3 +19,4 @@ export * from './content-node-selector.component-data.interface';
 export * from './content-node-selector-panel.component';
 export * from './content-node-selector.component';
 export * from './content-node-selector.service';
+export * from './content-node-dialog.service';

lib/content-services/i18n/en.json

@@ -7,6 +7,7 @@
       "IMAGE_NOT_AVAILABLE": "Preview not available"
     },
     "FIELD": {
+      "SOURCE": "Select source from ",
       "UPLOAD": "UPLOAD",
       "REQUIRED": "*Required",
       "VALIDATOR": {