[ACA-1607] Libraries - add/remove favorite library action (#816)

* workaround rework

* avorite unfavorite i18n reference

* extension definition

* is favorite library default value

* add action tooltip

* toglle favorite library state

* add toggle favorite library directive

* remove default isFavorite library value

* rework favorite library directive

* mark selected as favorite on favorite libaries route

* update tests

* add context menu delete library action

* update e2e

e2e/suites/actions/context-menu-single-selection.test.ts

@@ -126,10 +126,10 @@ describe('Context menu actions - single selection : ', () => {
       expect(await dataTable.hasContextMenu()).toBe(false, 'Context menu is displayed');
     });
 
-    it('Context menu does not appear for a library - [C286276]', async () => {
+    it('Context menu appears for a library - [C286276]', async () => {
       await page.clickFileLibrariesAndWait();
       await dataTable.rightClickOnItem(siteName);
-      expect(await dataTable.hasContextMenu()).toBe(false, 'Context menu is displayed for a site');
+      expect(await dataTable.hasContextMenu()).toBe(true, 'Context menu is displayed for a site');
     });
   });
 

src/app/components/favorite-libraries/favorite-libraries.component.html

@@ -15,9 +15,17 @@
 
     <app-page-layout-content>
         <div class="main-content">
-            <adf-document-list #documentList acaDocumentList [display]="documentDisplayMode$ | async" [node]="list"
+            <adf-document-list #documentList
-                [loading]="dataIsLoading" selectionMode="single" [navigate]="false" [sorting]="[ 'title', 'asc' ]"
+                acaDocumentList
-                (node-dblclick)="navigateTo($event.detail?.node)" (name-click)="navigateTo($event.detail?.node)">
+                acaContextActions
+                [display]="documentDisplayMode$ | async"
+                [node]="list"
+                [loading]="dataIsLoading"
+                selectionMode="single"
+                [navigate]="false"
+                [sorting]="[ 'title', 'asc' ]"
+                (node-dblclick)="navigateTo($event.detail?.node)"
+                (name-click)="navigateTo($event.detail?.node)">
 
                 <empty-folder-content>
                     <ng-template>

src/app/components/libraries/libraries.component.html

@@ -15,6 +15,7 @@
       <div class="main-content">
           <adf-document-list #documentList
               acaDocumentList
+              acaContextActions
               [display]="documentDisplayMode$ | async"
               currentFolderId="-mysites-"
               selectionMode="single"

src/app/components/toolbar/toggle-favorite-library/toggle-favorite-library.component.spec.ts

@@ -25,7 +25,6 @@
 
 import { TestBed } from '@angular/core/testing';
 import {
-  setupTestBed,
   CoreModule,
   AlfrescoApiService,
   AlfrescoApiServiceMock
@@ -37,31 +36,41 @@ import { Store } from '@ngrx/store';
 import { AppTestingModule } from '../../../testing/app-testing.module';
 import { ContentManagementService } from '../../../services/content-management.service';
 import { of } from 'rxjs';
+import { Router } from '@angular/router';
 
 describe('ToggleFavoriteLibraryComponent', () => {
   let fixture;
   let component;
   let contentManagementService;
   const selection = { library: { entry: { id: 'libraryId' } } };
+  const mockRouter = {
+    url: ''
+  };
 
-  setupTestBed({
+  beforeEach(() => {
-    imports: [CoreModule, AppTestingModule],
+    TestBed.configureTestingModule({
-    declarations: [ToggleFavoriteLibraryComponent, LibraryFavoriteDirective],
+      imports: [CoreModule, AppTestingModule],
-    providers: [
+      declarations: [ToggleFavoriteLibraryComponent, LibraryFavoriteDirective],
-      {
+      providers: [
-        provide: AlfrescoApiService,
+        {
-        useClass: AlfrescoApiServiceMock
+          provide: Router,
-      },
+          useValue: mockRouter
-      {
+        },
-        provide: Store,
+        {
-        useValue: {
+          provide: AlfrescoApiService,
-          dispatch: () => {},
+          useClass: AlfrescoApiServiceMock
-          select: () => of(selection)
+        },
-        }
+        {
-      },
+          provide: Store,
-      ContentManagementService
+          useValue: {
-    ],
+            dispatch: () => {},
-    schemas: [NO_ERRORS_SCHEMA]
+            select: () => of(selection)
+          }
+        },
+        ContentManagementService
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    });
   });
 
   beforeEach(() => {
@@ -76,7 +85,17 @@ describe('ToggleFavoriteLibraryComponent', () => {
   it('should get library selection from Store', done => {
     fixture.detectChanges();
     component.selection$.subscribe(selected => {
-      expect(selected).toEqual(selection);
+      expect(selected.library.entry.id).toEqual(selection.library.entry.id);
+      done();
+    });
+  });
+
+  it('should mark selection as favorite when on favorite libraries route', done => {
+    mockRouter.url = '/favorite/libraries';
+    fixture.detectChanges();
+
+    component.selection$.subscribe(selected => {
+      expect(selected.library.isFavorite).toBe(true);
       done();
     });
   });

src/app/components/toolbar/toggle-favorite-library/toggle-favorite-library.component.ts

@@ -30,6 +30,8 @@ import { appSelection } from '../../../store/selectors/app.selectors';
 import { Observable } from 'rxjs';
 import { SelectionState } from '@alfresco/adf-extensions';
 import { ContentManagementService } from '../../../services/content-management.service';
+import { distinctUntilChanged, map } from 'rxjs/operators';
+import { Router } from '@angular/router';
 
 @Component({
   selector: 'app-toggle-favorite-library',
@@ -39,6 +41,11 @@ import { ContentManagementService } from '../../../services/content-management.s
       #favoriteLibrary="favoriteLibrary"
       (toggle)="onToggleEvent()"
       [acaFavoriteLibrary]="(selection$ | async).library"
+      [attr.title]="
+        favoriteLibrary.isFavorite()
+          ? ('APP.ACTIONS.REMOVE_FAVORITE' | translate)
+          : ('APP.ACTIONS.ADD_FAVORITE' | translate)
+      "
     >
       <mat-icon *ngIf="favoriteLibrary.isFavorite()">star</mat-icon>
       <mat-icon *ngIf="!favoriteLibrary.isFavorite()">star_border</mat-icon>
@@ -53,11 +60,26 @@ export class ToggleFavoriteLibraryComponent implements OnInit {
 
   constructor(
     private store: Store<AppStore>,
-    private content: ContentManagementService
+    private content: ContentManagementService,
+    private router: Router
   ) {}
 
   ngOnInit() {
-    this.selection$ = this.store.select(appSelection);
+    const isFavoriteLibraries = this.router.url.startsWith(
+      '/favorite/libraries'
+    );
+
+    this.selection$ = this.store.select(appSelection).pipe(
+      distinctUntilChanged(),
+      map(selection => {
+        // favorite libraries list should already be marked as favorite
+        if (selection.library && isFavoriteLibraries) {
+          (<any>selection.library).isFavorite = true;
+          return selection;
+        }
+        return selection;
+      })
+    );
   }
 
   onToggleEvent() {

src/app/directives/library-favorite.directive.ts

@@ -37,10 +37,6 @@ import { AlfrescoApiService } from '@alfresco/adf-core';
 interface LibraryEntity {
   entry: Site;
   isLibrary: boolean;
-}
-
-interface FavoriteLibrary {
-  entry: Site;
   isFavorite: boolean;
 }
 
@@ -55,7 +51,7 @@ export class LibraryFavoriteDirective implements OnChanges {
   @Output() toggle: EventEmitter<any> = new EventEmitter();
   @Output() error: EventEmitter<any> = new EventEmitter();
 
-  private targetLibrary: any = null;
+  private targetLibrary = null;
 
   @HostListener('click')
   onClick() {
@@ -66,9 +62,11 @@ export class LibraryFavoriteDirective implements OnChanges {
 
   ngOnChanges(changes) {
     if (!changes.library.currentValue) {
+      this.targetLibrary = null;
       return;
     }
 
+    this.targetLibrary = changes.library.currentValue;
     this.markFavoriteLibrary(changes.library.currentValue);
   }
 
@@ -77,10 +75,6 @@ export class LibraryFavoriteDirective implements OnChanges {
   }
 
   toggleFavorite() {
-    if (!this.targetLibrary) {
-      return;
-    }
-
     if (this.targetLibrary.isFavorite) {
       this.removeFavorite(this.targetLibrary.entry.guid);
     } else {
@@ -90,22 +84,18 @@ export class LibraryFavoriteDirective implements OnChanges {
   }
 
   private async markFavoriteLibrary(library: LibraryEntity) {
-    this.targetLibrary = await this.getFavoriteSite(library);
+    if (this.targetLibrary.isFavorite === undefined) {
+      await this.getFavoriteSite(library);
+    } else {
+      this.targetLibrary = library;
+    }
   }
 
-  private getFavoriteSite(library: LibraryEntity): Promise<FavoriteLibrary> {
+  private getFavoriteSite(library: LibraryEntity) {
-    return this.alfrescoApiService.peopleApi
+    this.alfrescoApiService.peopleApi
       .getFavoriteSite('-me-', library.entry.id)
-      .then(() => {
+      .then(() => (this.targetLibrary.isFavorite = true))
-        return {
+      .catch(() => (this.targetLibrary.isFavorite = false));
-          entry: { ...this.library.entry },
-          isFavorite: true
-        };
-      })
-      .catch(() => ({
-        entry: { ...this.library.entry },
-        isFavorite: false
-      }));
   }
 
   private createFavoriteBody(library: LibraryEntity): FavoriteBody {

src/assets/app.extensions.json

@@ -623,12 +623,21 @@
         "id": "app.context.menu.favorite",
         "comment": "workaround for Recent Files and Search API issue",
         "type": "custom",
-        "order": 501,
+        "order": 601,
         "component": "app.toolbar.toggleFavorite",
         "rules": {
           "visible": "app.toolbar.favorite.canToggle"
         }
       },
+      {
+        "id": "app.context.menu.libraries.toggleFavorite",
+        "type": "custom",
+        "order": 602,
+        "component": "app.toolbar.toggleFavoriteLibrary",
+        "rules": {
+          "visible": "app.libraries.toolbar"
+        }
+      },
       {
         "id": "app.context.menu.copy",
         "title": "APP.ACTIONS.COPY",
@@ -665,6 +674,18 @@
           "visible": "app.selection.canDelete"
         }
       },
+      {
+        "id": "app.toolbar.deleteLibrary",
+        "order": 901,
+        "title": "APP.ACTIONS.DELETE",
+        "icon": "delete",
+        "actions": {
+          "click": "DELETE_LIBRARY"
+        },
+        "rules": {
+          "visible": "app.libraries.toolbar"
+        }
+      },
       {
         "id": "app.context.menu.versions",
         "title": "APP.ACTIONS.VERSIONS",

src/assets/i18n/en.json

@@ -189,6 +189,8 @@
             "PERMISSIONS": "Permissions",
             "RESTORE": "Restore",
             "FAVORITE": "Favorite",
+            "ADD_FAVORITE": "Add favorite",
+            "REMOVE_FAVORITE": "Remove favorite",
             "UNSHARE": "Unshare",
             "DETAILS": "View details",
             "VERSIONS": "Manage Versions",