[ADF-2367] [Demo shell] Fix default site (#3004)

* fix default site scenario

* add default my files object in the list

demo-shell/src/app/components/files/files.component.html

@@ -29,7 +29,7 @@
     </mat-accordion>
 
     <div class="adf-site-container-style" id="site-container">
-        <adf-sites-dropdown (change)="getSiteContent($event)" [hideMyFiles]="false" >
+        <adf-sites-dropdown (change)="onSiteChange($event)" [hideMyFiles]="false" >
         </adf-sites-dropdown>
     </div>
     <div class="document-list-container" fxLayout="row" fxLayoutAlign="start stretch" fxLayoutGap="16px">

demo-shell/src/app/components/files/files.component.ts

@@ -365,8 +365,8 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
         }
     }
 
-    getSiteContent(site: SiteEntry) {
-        this.currentFolderId = site && site.entry.guid ? site.entry.guid : DEFAULT_FOLDER_TO_SHOW;
+    onSiteChange(site: SiteEntry) {
+        this.currentFolderId = site.entry.guid;
     }
 
     getDocumentListCurrentFolderId() {

lib/content-services/site-dropdown/sites-dropdown.component.html

@@ -1,6 +1,7 @@
 <div id="site-dropdown-container" class="adf-site-dropdown-container">
     <mat-form-field>
         <mat-select
+            data-automation-id="site-my-files-option"
             class="adf-site-dropdown-list-element"
             id="site-dropdown"
             placeholder="{{placeholder | translate}}"
@@ -8,7 +9,6 @@
             data-automation-id="site-my-files-select"
             [(value)]="selected"
             (selectionChange)="selectedSite($event)">
-            <mat-option *ngIf="!hideMyFiles" data-automation-id="site-my-files-option" id="default_site_option" [value]="MY_FILES_VALUE">{{'DROPDOWN.MY_FILES_OPTION' | translate}}</mat-option>
             <mat-option *ngFor="let site of siteList?.list.entries" [value]="site">
                 {{ site.entry.title | translate}}
             </mat-option>

lib/content-services/site-dropdown/sites-dropdown.component.spec.ts

@@ -23,48 +23,13 @@ import { DropdownSitesComponent } from './sites-dropdown.component';
 
 declare let jasmine: any;
 
-let sitesList = {
-    'list': {
-        'pagination': {
-            'count': 2,
-            'hasMoreItems': false,
-            'totalItems': 2,
-            'skipCount': 0,
-            'maxItems': 100
-        },
-        'entries': [
-            {
-                'entry': {
-                    'role': 'SiteManager',
-                    'visibility': 'PUBLIC',
-                    'guid': 'fake-1',
-                    'description': 'fake-test-site',
-                    'id': 'fake-test-site',
-                    'preset': 'site-dashboard',
-                    'title': 'fake-test-site'
-                }
-            },
-            {
-                'entry': {
-                    'role': 'SiteManager',
-                    'visibility': 'PUBLIC',
-                    'guid': 'fake-2',
-                    'description': 'This is a Sample Alfresco Team site.',
-                    'id': 'swsdp',
-                    'preset': 'site-dashboard',
-                    'title': 'fake-test-2'
-                }
-            }
-        ]
-    }
-};
-
 describe('DropdownSitesComponent', () => {
 
     let component: any;
     let fixture: ComponentFixture<DropdownSitesComponent>;
     let debug: DebugElement;
     let element: HTMLElement;
+    let sitesList: any;
 
     beforeEach(async(() => {
 
@@ -83,6 +48,42 @@ describe('DropdownSitesComponent', () => {
         debug = fixture.debugElement;
         element = fixture.nativeElement;
         component = fixture.componentInstance;
+
+        sitesList = {
+            'list': {
+                'pagination': {
+                    'count': 2,
+                    'hasMoreItems': false,
+                    'totalItems': 2,
+                    'skipCount': 0,
+                    'maxItems': 100
+                },
+                'entries': [
+                    {
+                        'entry': {
+                            'role': 'SiteManager',
+                            'visibility': 'PUBLIC',
+                            'guid': 'fake-1',
+                            'description': 'fake-test-site',
+                            'id': 'fake-test-site',
+                            'preset': 'site-dashboard',
+                            'title': 'fake-test-site'
+                        }
+                    },
+                    {
+                        'entry': {
+                            'role': 'SiteManager',
+                            'visibility': 'PUBLIC',
+                            'guid': 'fake-2',
+                            'description': 'This is a Sample Alfresco Team site.',
+                            'id': 'swsdp',
+                            'preset': 'site-dashboard',
+                            'title': 'fake-test-2'
+                        }
+                    }
+                ]
+            }
+        };
     });
 
     describe('Rendering tests', () => {
@@ -128,13 +129,14 @@ describe('DropdownSitesComponent', () => {
                 responseText: sitesList
             });
 
-            openSelectbox();
-
             fixture.whenStable().then(() => {
                 fixture.detectChanges();
-                expect(window.document.querySelector('[data-automation-id="site-my-files-option"]')).not.toBeNull();
+                debug.query(By.css('.mat-select-trigger')).triggerEventHandler('click', null);
+                fixture.detectChanges();
+                let options: any = debug.queryAll(By.css('mat-option'));
+                expect(options[0].nativeElement.innerText).toContain('DROPDOWN.MY_FILES_OPTION');
             });
-        }));
+        });
 
         it('should hide the "My files" option if the developer desires that way', async(() => {
             component.hideMyFiles = true;
@@ -145,11 +147,12 @@ describe('DropdownSitesComponent', () => {
                 responseText: sitesList
             });
 
-            openSelectbox();
-
             fixture.whenStable().then(() => {
                 fixture.detectChanges();
-                expect(window.document.querySelector('[data-automation-id="site-my-files-option"]')).toBeNull();
+                debug.query(By.css('.mat-select-trigger')).triggerEventHandler('click', null);
+                fixture.detectChanges();
+                let options: any = debug.queryAll(By.css('mat-option'));
+                expect(options[0].nativeElement.innerText).not.toContain('DROPDOWN.MY_FILES_OPTION');
             });
         }));
 
@@ -219,12 +222,12 @@ describe('DropdownSitesComponent', () => {
             });
 
             component.change.subscribe(() => {
-                expect(options[1].nativeElement.innerText).toContain('PERSONAL_FILES');
-                expect(options[2].nativeElement.innerText).toContain('FILE_LIBRARIES');
+                expect(options[2].nativeElement.innerText).toContain('PERSONAL_FILES');
+                expect(options[3].nativeElement.innerText).toContain('FILE_LIBRARIES');
             });
         }));
 
-        it('should load sites by default', (done) => {
+        it('should load sites by default', async(() => {
             fixture.detectChanges();
             jasmine.Ajax.requests.mostRecent().respondWith({
                 status: 200,
@@ -232,23 +235,15 @@ describe('DropdownSitesComponent', () => {
                 responseText: sitesList
             });
 
-            openSelectbox();
-
-            let options: any = [];
             fixture.whenStable().then(() => {
                 fixture.detectChanges();
-                options = debug.queryAll(By.css('mat-option'));
-                options[0].triggerEventHandler('click', null);
+                debug.query(By.css('.mat-select-trigger')).triggerEventHandler('click', null);
                 fixture.detectChanges();
-            });
-
-            component.change.subscribe(() => {
+                let options: any = debug.queryAll(By.css('mat-option'));
                 expect(options[1].nativeElement.innerText).toContain('fake-test-site');
                 expect(options[2].nativeElement.innerText).toContain('fake-test-2');
-
-                done();
             });
-        });
+        }));
 
         it('should raise an event when a site is selected', (done) => {
             fixture.detectChanges();

lib/content-services/site-dropdown/sites-dropdown.component.ts

@@ -18,7 +18,6 @@
 import { Component, EventEmitter, Input, OnInit, Output, ViewEncapsulation } from '@angular/core';
 import { SitesService } from '@alfresco/adf-core';
 import { SitePaging, SiteEntry } from 'alfresco-js-api';
-import { Observable } from 'rxjs/Observable';
 
 @Component({
     selector: 'adf-sites-dropdown',
@@ -57,18 +56,14 @@ export class DropdownSitesComponent implements OnInit {
 
     selected: SiteEntry = null;
 
-    public MY_FILES_VALUE = 'default';
+    public MY_FILES_VALUE = '-my-';
 
     constructor(private sitesService: SitesService) {
     }
 
     ngOnInit() {
         if (!this.siteList) {
-            this.setDefaultSiteList().subscribe((result) => {
-                    this.selected = this.siteList.list.entries.find(site => site.entry.id === this.value);
-                },
-                (error) => {
-                });
+            this.setDefaultSiteList();
         }
 
     }
@@ -77,16 +72,25 @@ export class DropdownSitesComponent implements OnInit {
         this.change.emit(event.value);
     }
 
-    private setDefaultSiteList(): Observable<SitePaging> {
-        let sitesObservable = this.sitesService.getSites();
-
-        sitesObservable.subscribe((result) => {
+    private setDefaultSiteList() {
+        this.sitesService.getSites().subscribe((result) => {
                 this.siteList = result;
+
+                if (!this.hideMyFiles) {
+                    let myItem = { entry: { id: '-my-', guid: '-my-', title: 'DROPDOWN.MY_FILES_OPTION' } };
+
+                    this.siteList.list.entries.unshift(myItem);
+
+                    if (!this.value) {
+                        this.value = '-my-';
+                    }
+                }
+
+                this.selected = this.siteList.list.entries.find(site => site.entry.id === this.value);
             },
             (error) => {
             });
 
-        return sitesObservable;
     }
 
 }

lib/core/core.module.ts

@@ -80,7 +80,6 @@ export function createTranslateLoader(http: HttpClient, logService: LogService)
     return new TranslateLoaderService(http, logService);
 }
 
-
 export function providers() {
     return [
         AuthenticationService,