[ACA-3251] Move InfoDrawer and Toolbar components to aca-shared (#1466)

* moved tool bar

* moved info drawer

* moved appextension service

* moved pagination service

* Fix imports

* * fixed lints

* * fixed space

* added travis configuration

* * comments fixed

* * comments fixed

* * lint fixed

Co-authored-by: dhrn <dharan.g@muraai.com>

projects/aca-shared/src/lib/components/info-drawer/info-drawer.component.html

@@ -0,0 +1,23 @@
+<div *ngIf="isLoading">
+  <mat-progress-bar mode="indeterminate"></mat-progress-bar>
+</div>
+<ng-container *ngIf="!isLoading && !!displayNode">
+  <adf-info-drawer
+    [title]="'APP.INFO_DRAWER.TITLE'"
+    cdkTrapFocus
+    cdkTrapFocusAutoCapture
+  >
+    <adf-info-drawer-tab
+      *ngFor="let tab of tabs"
+      [icon]="tab.icon"
+      [label]="tab.title"
+    >
+      <adf-dynamic-tab
+        [node]="displayNode"
+        [id]="tab.component"
+        [attr.data-automation-id]="tab.component"
+      >
+      </adf-dynamic-tab>
+    </adf-info-drawer-tab>
+  </adf-info-drawer>
+</ng-container>

projects/aca-shared/src/lib/components/info-drawer/info-drawer.component.spec.ts

@@ -0,0 +1,169 @@
+/*!
+ * @license
+ * Alfresco Example Content Application
+ *
+ * Copyright (C) 2005 - 2020 Alfresco Software Limited
+ *
+ * This file is part of the Alfresco Example Content Application.
+ * If the software was purchased under a paid Alfresco license, the terms of
+ * the paid license agreement will prevail.  Otherwise, the software is
+ * provided under the following open source license terms:
+ *
+ * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * The Alfresco Example Content Application is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
+ */
+import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { InfoDrawerComponent } from './info-drawer.component';
+import { TestBed, ComponentFixture, async } from '@angular/core/testing';
+import { Store } from '@ngrx/store';
+import {
+  SetInfoDrawerStateAction,
+  ToggleInfoDrawerAction
+} from '@alfresco/aca-shared/store';
+import { LibTestingModule } from '../../testing/lib-testing-module';
+import { AppExtensionService } from '../../services/app.extension.service';
+import { ContentApiService } from '../../services/content-api.service';
+import { of } from 'rxjs';
+
+describe('InfoDrawerComponent', () => {
+  let fixture: ComponentFixture<InfoDrawerComponent>;
+  let component: InfoDrawerComponent;
+  let contentApiService: ContentApiService;
+  let tab;
+  let appExtensionService: AppExtensionService;
+  const storeMock = {
+    dispatch: jasmine.createSpy('dispatch')
+  };
+  const extensionServiceMock = {
+    getSidebarTabs: () => {}
+  };
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [LibTestingModule],
+      declarations: [InfoDrawerComponent],
+      providers: [
+        ContentApiService,
+        { provide: AppExtensionService, useValue: extensionServiceMock },
+        { provide: Store, useValue: storeMock }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    });
+
+    fixture = TestBed.createComponent(InfoDrawerComponent);
+    component = fixture.componentInstance;
+    appExtensionService = TestBed.get(AppExtensionService);
+    contentApiService = TestBed.get(ContentApiService);
+
+    tab = { title: 'tab1' };
+    spyOn(appExtensionService, 'getSidebarTabs').and.returnValue([tab]);
+  });
+
+  afterEach(() => {
+    fixture.destroy();
+  });
+
+  it('should get tabs configuration on initialization', () => {
+    fixture.detectChanges();
+
+    expect(component.tabs).toEqual([tab]);
+  });
+
+  it('should set state to false OnDestroy event', () => {
+    fixture.detectChanges();
+    component.ngOnDestroy();
+
+    expect(storeMock.dispatch).toHaveBeenCalledWith(
+      new SetInfoDrawerStateAction(false)
+    );
+  });
+
+  it('should set displayNode when node is library', async(() => {
+    spyOn(contentApiService, 'getNodeInfo');
+    const nodeMock: any = {
+      entry: { id: 'nodeId' },
+      isLibrary: true
+    };
+    component.node = nodeMock;
+
+    fixture.detectChanges();
+    component.ngOnChanges();
+
+    expect(component.displayNode).toBe(nodeMock);
+    expect(contentApiService.getNodeInfo).not.toHaveBeenCalled();
+  }));
+
+  it('should call getNodeInfo() when node is a shared file', async(() => {
+    const response: any = { entry: { id: 'nodeId' } };
+    spyOn(contentApiService, 'getNodeInfo').and.returnValue(of(response));
+    const nodeMock: any = { entry: { nodeId: 'nodeId' }, isLibrary: false };
+    component.node = nodeMock;
+
+    fixture.detectChanges();
+    component.ngOnChanges();
+
+    expect(component.displayNode).toBe(response);
+    expect(contentApiService.getNodeInfo).toHaveBeenCalled();
+  }));
+
+  it('should call getNodeInfo() when node is a favorite file', async(() => {
+    const response: any = { entry: { id: 'nodeId' } };
+    spyOn(contentApiService, 'getNodeInfo').and.returnValue(of(response));
+    const nodeMock: any = {
+      entry: { id: 'nodeId', guid: 'guidId' },
+      isLibrary: false
+    };
+    component.node = nodeMock;
+
+    fixture.detectChanges();
+    component.ngOnChanges();
+
+    expect(component.displayNode).toBe(response);
+    expect(contentApiService.getNodeInfo).toHaveBeenCalled();
+  }));
+
+  it('should call getNodeInfo() when node is a recent file', async(() => {
+    const response: any = { entry: { id: 'nodeId' } };
+    spyOn(contentApiService, 'getNodeInfo').and.returnValue(of(response));
+    const nodeMock: any = {
+      entry: {
+        id: 'nodeId',
+        content: { mimeType: 'image/jpeg' }
+      },
+      isLibrary: false
+    };
+    component.node = nodeMock;
+
+    fixture.detectChanges();
+    component.ngOnChanges();
+
+    expect(component.displayNode).toBe(response);
+    expect(contentApiService.getNodeInfo).toHaveBeenCalled();
+  }));
+
+  it('should dispatch close panel on Esc keyboard event', () => {
+    const event = new KeyboardEvent('keydown', {
+      code: 'Escape',
+      key: 'Escape',
+      keyCode: 27
+    } as KeyboardEventInit);
+
+    fixture.detectChanges();
+
+    fixture.debugElement.nativeElement.dispatchEvent(event);
+
+    expect(storeMock.dispatch).toHaveBeenCalledWith(
+      new ToggleInfoDrawerAction()
+    );
+  });
+});

projects/aca-shared/src/lib/components/info-drawer/info-drawer.component.ts

@@ -0,0 +1,115 @@
+/*!
+ * @license
+ * Alfresco Example Content Application
+ *
+ * Copyright (C) 2005 - 2020 Alfresco Software Limited
+ *
+ * This file is part of the Alfresco Example Content Application.
+ * If the software was purchased under a paid Alfresco license, the terms of
+ * the paid license agreement will prevail.  Otherwise, the software is
+ * provided under the following open source license terms:
+ *
+ * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * The Alfresco Example Content Application is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import {
+  Component,
+  HostListener,
+  Input,
+  OnChanges,
+  OnDestroy,
+  OnInit
+} from '@angular/core';
+import {
+  MinimalNodeEntity,
+  MinimalNodeEntryEntity,
+  SiteEntry
+} from '@alfresco/js-api';
+import { SidebarTabRef } from '@alfresco/adf-extensions';
+import { Store } from '@ngrx/store';
+import {
+  SetInfoDrawerStateAction,
+  ToggleInfoDrawerAction
+} from '@alfresco/aca-shared/store';
+import { AppExtensionService } from '../../services/app.extension.service';
+import { ContentApiService } from '../../services/content-api.service';
+
+@Component({
+  selector: 'aca-info-drawer',
+  templateUrl: './info-drawer.component.html'
+})
+export class InfoDrawerComponent implements OnChanges, OnInit, OnDestroy {
+  @Input()
+  nodeId: string;
+  @Input()
+  node: MinimalNodeEntity;
+
+  isLoading = false;
+  displayNode: MinimalNodeEntryEntity | SiteEntry;
+  tabs: Array<SidebarTabRef> = [];
+
+  @HostListener('keydown.escape')
+  onEscapeKeyboardEvent(): void {
+    this.close();
+  }
+
+  constructor(
+    private store: Store<any>,
+    private contentApi: ContentApiService,
+    private extensions: AppExtensionService
+  ) {}
+
+  ngOnInit() {
+    this.tabs = this.extensions.getSidebarTabs();
+  }
+
+  ngOnDestroy() {
+    this.store.dispatch(new SetInfoDrawerStateAction(false));
+  }
+
+  ngOnChanges() {
+    if (this.node) {
+      if (this.node['isLibrary']) {
+        return this.setDisplayNode(this.node);
+      }
+
+      const entry: any = this.node.entry;
+
+      const id = entry.nodeId || entry.id;
+      return this.loadNodeInfo(id);
+    }
+  }
+
+  private close() {
+    this.store.dispatch(new ToggleInfoDrawerAction());
+  }
+
+  private loadNodeInfo(nodeId: string) {
+    if (nodeId) {
+      this.isLoading = true;
+
+      this.contentApi.getNodeInfo(nodeId).subscribe(
+        entity => {
+          this.setDisplayNode(entity);
+          this.isLoading = false;
+        },
+        () => (this.isLoading = false)
+      );
+    }
+  }
+
+  private setDisplayNode(node: any) {
+    this.displayNode = node;
+  }
+}

projects/aca-shared/src/lib/components/info-drawer/shared-info-drawer.module.ts

@@ -0,0 +1,43 @@
+/*!
+ * @license
+ * Alfresco Example Content Application
+ *
+ * Copyright (C) 2005 - 2020 Alfresco Software Limited
+ *
+ * This file is part of the Alfresco Example Content Application.
+ * If the software was purchased under a paid Alfresco license, the terms of
+ * the paid license agreement will prevail.  Otherwise, the software is
+ * provided under the following open source license terms:
+ *
+ * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * The Alfresco Example Content Application is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { InfoDrawerComponent } from './info-drawer.component';
+import { InfoDrawerModule } from '@alfresco/adf-core';
+import { ExtensionsModule } from '@alfresco/adf-extensions';
+import { MatProgressBarModule } from '@angular/material';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    InfoDrawerModule,
+    MatProgressBarModule,
+    ExtensionsModule
+  ],
+  declarations: [InfoDrawerComponent],
+  exports: [InfoDrawerComponent]
+})
+export class SharedInfoDrawerModule {}