[ACS-5523] move viewer and preview to aca-content (#3303)

* move aca-viewer to secondary entry

* move aca-preview to aca-content

projects/aca-content/preview/ng-package.json

@@ -0,0 +1,5 @@
+{
+  "lib": {
+    "entryFile": "src/public-api.ts"
+  }
+}

projects/aca-content/preview/src/lib/components/preview.component.html

@@ -0,0 +1,36 @@
+<ng-container *ngIf="nodeId">
+  <adf-alfresco-viewer
+    [ngClass]="{
+      'right_side--hide': !showRightSide
+    }"
+    [nodeId]="nodeId"
+    [allowNavigate]="navigateMultiple"
+    [allowRightSidebar]="true"
+    [allowPrint]="false"
+    [showRightSidebar]="true"
+    [allowDownload]="false"
+    [allowFullScreen]="false"
+    [canNavigateBefore]="!!previousNodeId"
+    [canNavigateNext]="!!nextNodeId"
+    [overlayMode]="true"
+    (showViewerChange)="onVisibilityChanged($event)"
+    (navigateBefore)="onNavigateBefore($event)"
+    (navigateNext)="onNavigateNext($event)"
+  >
+    <adf-viewer-sidebar *ngIf="infoDrawerOpened$ | async">
+      <aca-info-drawer [node]="selection.file"></aca-info-drawer>
+    </adf-viewer-sidebar>
+
+    <adf-viewer-open-with *ngIf="openWith.length">
+      <ng-container *ngFor="let action of openWith; trackBy: trackByActionId">
+        <app-toolbar-menu-item [actionRef]="action"></app-toolbar-menu-item>
+      </ng-container>
+    </adf-viewer-open-with>
+
+    <adf-viewer-toolbar-actions *ngIf="!simplestMode">
+      <ng-container *ngFor="let action of viewerToolbarActions; trackBy: trackByActionId">
+        <aca-toolbar-action [actionRef]="action"></aca-toolbar-action>
+      </ng-container>
+    </adf-viewer-toolbar-actions>
+  </adf-alfresco-viewer>
+</ng-container>

projects/aca-content/preview/src/lib/components/preview.component.scss

@@ -0,0 +1,27 @@
+.app-preview {
+  width: 100%;
+  height: 100%;
+}
+
+.adf-viewer-toolbar .adf-toolbar-divider {
+  display: none;
+}
+
+.adf-viewer-toolbar-actions {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+
+  .adf-toolbar-divider {
+    display: inline;
+  }
+}
+
+// todo: remove this when viewer supports extensions
+.adf-viewer-toolbar .mat-toolbar > button:last-child {
+  display: none;
+}
+
+.adf-alfresco-viewer.right_side--hide .adf-viewer__sidebar__right {
+  width: 0;
+}

projects/aca-content/preview/src/lib/components/preview.component.spec.ts

@@ -0,0 +1,792 @@
+/*!
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Alfresco Example Content Application
+ *
+ * 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
+ * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { Router, ActivatedRoute } from '@angular/router';
+import { TestBed, ComponentFixture, fakeAsync, tick } from '@angular/core/testing';
+import {
+  UserPreferencesService,
+  AlfrescoApiService,
+  AlfrescoApiServiceMock,
+  AuthenticationService,
+  TranslationMock,
+  TranslationService,
+  PipeModule
+} from '@alfresco/adf-core';
+import { UploadService, NodesApiService, DiscoveryApiService } from '@alfresco/adf-content-services';
+import { AppState, ClosePreviewAction } from '@alfresco/aca-shared/store';
+import { PreviewComponent } from './preview.component';
+import { BehaviorSubject, Observable, of, throwError } from 'rxjs';
+import { ContentApiService, AppHookService, DocumentBasePageService } from '@alfresco/aca-shared';
+import { Store, StoreModule } from '@ngrx/store';
+import { Node, NodePaging, FavoritePaging, SharedLinkPaging, PersonEntry, ResultSetPaging, RepositoryInfo } from '@alfresco/js-api';
+import { PreviewModule } from '../preview.module';
+import { TranslateModule } from '@ngx-translate/core';
+import { RouterTestingModule } from '@angular/router/testing';
+import { HttpClientModule } from '@angular/common/http';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { EffectsModule } from '@ngrx/effects';
+
+class DocumentBasePageServiceMock extends DocumentBasePageService {
+  canUpdateNode(): boolean {
+    return true;
+  }
+  canUploadContent(): boolean {
+    return true;
+  }
+}
+
+export const INITIAL_APP_STATE: AppState = {
+  appName: 'Alfresco Content Application',
+  logoPath: 'assets/images/alfresco-logo-white.svg',
+  customCssPath: '',
+  webFontPath: '',
+  sharedUrl: '',
+  user: {
+    isAdmin: null,
+    id: null,
+    firstName: '',
+    lastName: ''
+  },
+  selection: {
+    nodes: [],
+    libraries: [],
+    isEmpty: true,
+    count: 0
+  },
+  navigation: {
+    currentFolder: null
+  },
+  currentNodeVersion: null,
+  infoDrawerOpened: false,
+  infoDrawerPreview: false,
+  infoDrawerMetadataAspect: '',
+  showFacetFilter: true,
+  fileUploadingDialog: true,
+  documentDisplayMode: 'list',
+  showLoader: false,
+  repository: {
+    status: {
+      isQuickShareEnabled: true
+    }
+  } as any
+};
+
+describe('PreviewComponent', () => {
+  let fixture: ComponentFixture<PreviewComponent>;
+  let component: PreviewComponent;
+  let router: Router;
+  let route: ActivatedRoute;
+  let preferences: UserPreferencesService;
+  let contentApi: ContentApiService;
+  let uploadService: UploadService;
+  let nodesApiService: NodesApiService;
+  let appHookService: AppHookService;
+  let store: Store<any>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        PreviewModule,
+        NoopAnimationsModule,
+        HttpClientModule,
+        RouterTestingModule,
+        TranslateModule.forRoot(),
+        StoreModule.forRoot(
+          { app: (state) => state },
+          {
+            initialState: {
+              app: INITIAL_APP_STATE
+            },
+            runtimeChecks: {
+              strictStateImmutability: false,
+              strictActionImmutability: false
+            }
+          }
+        ),
+        EffectsModule.forRoot([]),
+        PipeModule
+      ],
+      providers: [
+        { provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock },
+        { provide: TranslationService, useClass: TranslationMock },
+        { provide: DocumentBasePageService, useVale: new DocumentBasePageServiceMock() },
+        {
+          provide: DiscoveryApiService,
+          useValue: {
+            ecmProductInfo$: new BehaviorSubject<RepositoryInfo | null>(null),
+            getEcmProductInfo: (): Observable<RepositoryInfo> => of(new RepositoryInfo({ version: '10.0.0' }))
+          }
+        },
+        {
+          provide: AuthenticationService,
+          useValue: {
+            isEcmLoggedIn: (): boolean => true,
+            getRedirect: (): string | null => null,
+            setRedirect() {},
+            isOauth: (): boolean => false,
+            isOAuthWithoutSilentLogin: (): boolean => false
+          }
+        }
+      ]
+    });
+
+    fixture = TestBed.createComponent(PreviewComponent);
+    component = fixture.componentInstance;
+
+    router = TestBed.inject(Router);
+    route = TestBed.inject(ActivatedRoute);
+    preferences = TestBed.inject(UserPreferencesService);
+    contentApi = TestBed.inject(ContentApiService);
+    uploadService = TestBed.inject(UploadService);
+    nodesApiService = TestBed.inject(NodesApiService);
+    appHookService = TestBed.inject(AppHookService);
+    store = TestBed.inject(Store);
+  });
+
+  it('should extract the property path root', () => {
+    expect(component.getRootField('some.property.path')).toBe('some');
+    expect(component.getRootField('some')).toBe('some');
+    expect(component.getRootField('')).toBe('');
+    expect(component.getRootField(null)).toBe(null);
+  });
+
+  it('should navigate to previous node in sub-folder', () => {
+    spyOn(router, 'navigate').and.stub();
+    const clickEvent = new MouseEvent('click');
+
+    component.previewLocation = 'personal-files';
+    component.folderId = 'folder1';
+    component.previousNodeId = 'previous1';
+    component.onNavigateBefore(clickEvent);
+
+    expect(router.navigate).toHaveBeenCalledWith(['personal-files', 'folder1', 'preview', 'previous1']);
+  });
+
+  it('should navigate back to previous node in the root path', () => {
+    spyOn(router, 'navigate').and.stub();
+    const clickEvent = new MouseEvent('click');
+
+    component.previewLocation = 'personal-files';
+    component.folderId = null;
+    component.previousNodeId = 'previous1';
+    component.onNavigateBefore(clickEvent);
+
+    expect(router.navigate).toHaveBeenCalledWith(['personal-files', 'preview', 'previous1']);
+  });
+
+  it('should not navigate back if node unset', () => {
+    spyOn(router, 'navigate').and.stub();
+    const clickEvent = new MouseEvent('click');
+
+    component.previousNodeId = null;
+    component.onNavigateBefore(clickEvent);
+
+    expect(router.navigate).not.toHaveBeenCalled();
+  });
+
+  it('should navigate to next node in sub-folder', () => {
+    spyOn(router, 'navigate').and.stub();
+    const clickEvent = new MouseEvent('click');
+
+    component.previewLocation = 'personal-files';
+    component.folderId = 'folder1';
+    component.nextNodeId = 'next1';
+    component.onNavigateNext(clickEvent);
+
+    expect(router.navigate).toHaveBeenCalledWith(['personal-files', 'folder1', 'preview', 'next1']);
+  });
+
+  it('should navigate to next node in the root path', () => {
+    spyOn(router, 'navigate').and.stub();
+    const clickEvent = new MouseEvent('click');
+
+    component.previewLocation = 'personal-files';
+    component.folderId = null;
+    component.nextNodeId = 'next1';
+    component.onNavigateNext(clickEvent);
+
+    expect(router.navigate).toHaveBeenCalledWith(['personal-files', 'preview', 'next1']);
+  });
+
+  it('should not navigate back if node unset', () => {
+    spyOn(router, 'navigate').and.stub();
+    const clickEvent = new MouseEvent('click');
+
+    component.nextNodeId = null;
+    component.onNavigateNext(clickEvent);
+
+    expect(router.navigate).not.toHaveBeenCalled();
+  });
+
+  it('should generate preview path for a folder only', () => {
+    component.previewLocation = 'personal-files';
+
+    expect(component.getPreviewPath('folder1', null)).toEqual(['personal-files', 'folder1']);
+  });
+
+  it('should generate preview path for a folder and a node', () => {
+    component.previewLocation = 'personal-files';
+
+    expect(component.getPreviewPath('folder1', 'node1')).toEqual(['personal-files', 'folder1', 'preview', 'node1']);
+  });
+
+  it('should generate preview path for a node only', () => {
+    component.previewLocation = 'personal-files';
+
+    expect(component.getPreviewPath(null, 'node1')).toEqual(['personal-files', 'preview', 'node1']);
+  });
+
+  it('should generate preview for the location only', () => {
+    component.previewLocation = 'personal-files';
+
+    expect(component.getPreviewPath(null, null)).toEqual(['personal-files']);
+  });
+
+  it('should navigate back to root path upon close', () => {
+    spyOn(router, 'navigate').and.stub();
+
+    component.routesSkipNavigation = [];
+    component.previewLocation = 'libraries';
+    component.folderId = null;
+
+    component.onVisibilityChanged(false);
+
+    expect(router.navigate).toHaveBeenCalledWith(['libraries', {}]);
+  });
+
+  it('should navigate back to folder path upon close', () => {
+    spyOn(router, 'navigate').and.stub();
+
+    component.routesSkipNavigation = [];
+    component.previewLocation = 'libraries';
+    component.folderId = 'site1';
+
+    component.onVisibilityChanged(false);
+
+    expect(router.navigate).toHaveBeenCalledWith(['libraries', {}, 'site1']);
+  });
+
+  it('should not navigate to root path for certain routes upon close', () => {
+    spyOn(router, 'navigate').and.stub();
+
+    component.routesSkipNavigation = ['shared'];
+    component.previewLocation = 'shared';
+    component.folderId = 'folder1';
+
+    component.onVisibilityChanged(false);
+
+    expect(router.navigate).toHaveBeenCalledWith(['shared', {}]);
+  });
+
+  it('should not navigate back if viewer is still visible', () => {
+    spyOn(router, 'navigate').and.stub();
+
+    component.routesSkipNavigation = [];
+    component.previewLocation = 'shared';
+
+    component.onVisibilityChanged(true);
+
+    expect(router.navigate).not.toHaveBeenCalled();
+  });
+
+  it('should enable multiple document navigation from route data', () => {
+    route.snapshot.data = {
+      navigateMultiple: true
+    };
+
+    component.ngOnInit();
+
+    expect(component.navigateMultiple).toBeTruthy();
+  });
+
+  it('should not enable multiple document navigation from route data', () => {
+    route.snapshot.data = {};
+
+    component.ngOnInit();
+
+    expect(component.navigateMultiple).toBeFalsy();
+  });
+
+  it('should fetch navigation source from route', () => {
+    route.snapshot.data = {
+      navigateSource: 'personal-files'
+    };
+
+    component.ngOnInit();
+
+    expect(component.navigateSource).toBe('personal-files');
+  });
+
+  it('should fetch case-insensitive source from route', () => {
+    route.snapshot.data = {
+      navigateSource: 'PERSONAL-FILES'
+    };
+
+    component.navigationSources = ['personal-files'];
+    component.ngOnInit();
+
+    expect(component.navigateSource).toBe('PERSONAL-FILES');
+  });
+
+  it('should fetch only permitted navigation source from route', () => {
+    route.snapshot.data = {
+      navigateSource: 'personal-files'
+    };
+
+    component.navigationSources = ['shared'];
+    component.ngOnInit();
+
+    expect(component.navigateSource).toBeNull();
+  });
+
+  it('should display document upon init', () => {
+    route.params = of({
+      folderId: 'folder1',
+      nodeId: 'node1'
+    });
+
+    spyOn(component, 'displayNode').and.stub();
+
+    component.ngOnInit();
+
+    expect(component.folderId).toBe('folder1');
+    expect(component.displayNode).toHaveBeenCalledWith('node1');
+  });
+
+  it('should return empty nearest nodes for missing node id', async () => {
+    const nearest = await component.getNearestNodes(null, 'folder1');
+
+    expect(nearest).toEqual({ left: null, right: null });
+  });
+
+  it('should return empty nearest nodes for missing folder id', async () => {
+    const nearest = await component.getNearestNodes('node1', null);
+
+    expect(nearest).toEqual({ left: null, right: null });
+  });
+
+  it('should return empty nearest nodes for crashed fields id request', async () => {
+    spyOn(component, 'getFileIds').and.returnValue(Promise.reject('err'));
+
+    const nearest = await component.getNearestNodes('node1', 'folder1');
+
+    expect(nearest).toEqual({ left: null, right: null });
+  });
+
+  it('should return nearest nodes', async () => {
+    spyOn(component, 'getFileIds').and.returnValue(Promise.resolve(['node1', 'node2', 'node3', 'node4', 'node5']));
+
+    let nearest = await component.getNearestNodes('node1', 'folder1');
+    expect(nearest).toEqual({ left: null, right: 'node2' });
+
+    nearest = await component.getNearestNodes('node3', 'folder1');
+    expect(nearest).toEqual({ left: 'node2', right: 'node4' });
+
+    nearest = await component.getNearestNodes('node5', 'folder1');
+    expect(nearest).toEqual({ left: 'node4', right: null });
+  });
+
+  it('should return empty nearest nodes if node is already deleted', async () => {
+    spyOn(component, 'getFileIds').and.returnValue(Promise.resolve(['node1', 'node2', 'node3', 'node4', 'node5']));
+
+    const nearest = await component.getNearestNodes('node9', 'folder1');
+    expect(nearest).toEqual({ left: null, right: null });
+  });
+
+  it('should not display node when id is missing', async () => {
+    spyOn(router, 'navigate').and.stub();
+    spyOn(contentApi, 'getNodeInfo').and.returnValue(of(null));
+
+    await component.displayNode(null);
+
+    expect(contentApi.getNodeInfo).not.toHaveBeenCalled();
+    expect(router.navigate).not.toHaveBeenCalled();
+  });
+
+  it('should navigate to original location if node not found', async () => {
+    spyOn(router, 'navigate').and.stub();
+    spyOn(contentApi, 'getNodeInfo').and.returnValue(throwError('error'));
+
+    component.previewLocation = 'personal-files';
+    await component.displayNode('folder1');
+
+    expect(contentApi.getNodeInfo).toHaveBeenCalledWith('folder1');
+    expect(router.navigate).toHaveBeenCalledWith(['personal-files', 'folder1']);
+  });
+
+  it('should navigate to original location if node is not a File', async () => {
+    spyOn(router, 'navigate').and.stub();
+    spyOn(contentApi, 'getNodeInfo').and.returnValue(
+      of({
+        isFile: false
+      } as Node)
+    );
+
+    component.previewLocation = 'personal-files';
+    await component.displayNode('folder1');
+
+    expect(contentApi.getNodeInfo).toHaveBeenCalledWith('folder1');
+    expect(router.navigate).toHaveBeenCalledWith(['personal-files', 'folder1']);
+  });
+
+  it('should navigate to original location in case of Alfresco API errors', async () => {
+    spyOn(router, 'navigate').and.stub();
+    spyOn(contentApi, 'getNodeInfo').and.returnValue(throwError('error'));
+
+    component.previewLocation = 'personal-files';
+    await component.displayNode('folder1');
+
+    expect(contentApi.getNodeInfo).toHaveBeenCalledWith('folder1');
+    expect(router.navigate).toHaveBeenCalledWith(['personal-files', 'folder1']);
+  });
+
+  it('should fetch and sort file ids for personal-files', async () => {
+    preferences.set('personal-files.sorting.key', 'name');
+    preferences.set('personal-files.sorting.direction', 'desc');
+
+    spyOn(contentApi, 'getNodeChildren').and.returnValue(
+      of({
+        list: {
+          entries: [{ entry: { id: 'node1', name: 'node 1' } }, { entry: { id: 'node2', name: 'node 2' } }]
+        }
+      } as NodePaging)
+    );
+
+    const ids = await component.getFileIds('personal-files', 'folder1');
+    expect(ids).toEqual(['node2', 'node1']);
+  });
+
+  it('should fetch file ids for personal-files with default sorting for missing key', async () => {
+    preferences.set('personal-files.sorting.key', 'missing');
+    preferences.set('personal-files.sorting.direction', 'desc');
+
+    spyOn(contentApi, 'getNodeChildren').and.returnValue(
+      of({
+        list: {
+          entries: [{ entry: { id: 'node1', name: 'node 1' } }, { entry: { id: 'node2', name: 'node 2' } }]
+        }
+      } as NodePaging)
+    );
+
+    const ids = await component.getFileIds('personal-files', 'folder1');
+    expect(ids).toEqual(['node1', 'node2']);
+  });
+
+  it('should sort file ids for personal-files with [modifiedAt desc]', async () => {
+    spyOn(preferences, 'get').and.returnValue(null);
+
+    spyOn(contentApi, 'getNodeChildren').and.returnValue(
+      of({
+        list: {
+          entries: [
+            { entry: { id: 'node1', name: 'node 1', modifiedAt: new Date(1) } },
+            { entry: { id: 'node2', name: 'node 2', modifiedAt: new Date(2) } }
+          ]
+        }
+      } as NodePaging)
+    );
+
+    const ids = await component.getFileIds('personal-files', 'folder1');
+    expect(ids).toEqual(['node2', 'node1']);
+  });
+
+  it('should fetch and sort file ids for libraries', async () => {
+    preferences.set('personal-files.sorting.key', 'name');
+    preferences.set('personal-files.sorting.direction', 'desc');
+
+    spyOn(contentApi, 'getNodeChildren').and.returnValue(
+      of({
+        list: {
+          entries: [{ entry: { id: 'node1', name: 'node 1' } }, { entry: { id: 'node2', name: 'node 2' } }]
+        }
+      } as NodePaging)
+    );
+
+    const ids = await component.getFileIds('libraries', 'site1');
+    expect(ids).toEqual(['node2', 'node1']);
+  });
+
+  it('should require folder id to fetch ids for libraries', async () => {
+    const ids = await component.getFileIds('libraries', null);
+    expect(ids).toEqual([]);
+  });
+
+  it('should sort file ids for libraries with [modifiedAt desc]', async () => {
+    spyOn(preferences, 'get').and.returnValue(null);
+
+    spyOn(contentApi, 'getNodeChildren').and.returnValue(
+      of({
+        list: {
+          entries: [
+            { entry: { id: 'node1', name: 'node 1', modifiedAt: new Date(1) } },
+            { entry: { id: 'node2', name: 'node 2', modifiedAt: new Date(2) } }
+          ]
+        }
+      } as NodePaging)
+    );
+
+    const ids = await component.getFileIds('libraries', 'folder1');
+    expect(ids).toEqual(['node2', 'node1']);
+  });
+
+  it('should fetch and sort ids for favorites', async () => {
+    preferences.set('favorites.sorting.key', 'name');
+    preferences.set('favorites.sorting.direction', 'desc');
+
+    spyOn(contentApi, 'getFavorites').and.returnValue(
+      of({
+        list: {
+          entries: [
+            { entry: { target: { file: { id: 'file3', name: 'file 3' } } } },
+            { entry: { target: { file: { id: 'file1', name: 'file 1' } } } },
+            { entry: { target: { file: { id: 'file2', name: 'file 2' } } } }
+          ]
+        }
+      } as FavoritePaging)
+    );
+
+    const ids = await component.getFileIds('favorites');
+    expect(ids).toEqual(['file3', 'file2', 'file1']);
+  });
+
+  it('should sort file ids for favorites with [modifiedAt desc]', async () => {
+    spyOn(preferences, 'get').and.returnValue(null);
+
+    spyOn(contentApi, 'getFavorites').and.returnValue(
+      of({
+        list: {
+          entries: [
+            {
+              entry: {
+                target: { file: { id: 'file3', modifiedAt: new Date(3) } }
+              }
+            },
+            {
+              entry: {
+                target: { file: { id: 'file1', modifiedAt: new Date(1) } }
+              }
+            },
+            {
+              entry: {
+                target: { file: { id: 'file2', modifiedAt: new Date(2) } }
+              }
+            }
+          ]
+        }
+      } as FavoritePaging)
+    );
+
+    const ids = await component.getFileIds('favorites');
+    expect(ids).toEqual(['file3', 'file2', 'file1']);
+  });
+
+  it('should fetch and sort file ids for shared files', async () => {
+    preferences.set('shared.sorting.key', 'name');
+    preferences.set('shared.sorting.direction', 'asc');
+
+    spyOn(contentApi, 'findSharedLinks').and.returnValue(
+      of({
+        list: {
+          entries: [
+            {
+              entry: {
+                nodeId: 'node2',
+                name: 'node 2',
+                modifiedAt: new Date(2)
+              }
+            },
+            {
+              entry: {
+                nodeId: 'node1',
+                name: 'node 1',
+                modifiedAt: new Date(1)
+              }
+            }
+          ]
+        }
+      } as SharedLinkPaging)
+    );
+
+    const ids = await component.getFileIds('shared');
+    expect(ids).toEqual(['node1', 'node2']);
+  });
+
+  it('should sort file ids for favorites with [modifiedAt desc]', async () => {
+    spyOn(preferences, 'get').and.returnValue(null);
+
+    spyOn(contentApi, 'findSharedLinks').and.returnValue(
+      of({
+        list: {
+          entries: [
+            {
+              entry: {
+                nodeId: 'node2',
+                name: 'node 2',
+                modifiedAt: new Date(2)
+              }
+            },
+            {
+              entry: {
+                nodeId: 'node1',
+                name: 'node 1',
+                modifiedAt: new Date(1)
+              }
+            }
+          ]
+        }
+      } as SharedLinkPaging)
+    );
+
+    const ids = await component.getFileIds('shared');
+    expect(ids).toEqual(['node2', 'node1']);
+  });
+
+  it('should fetch and sort ids for recent-files', async () => {
+    preferences.set('recent-files.sorting.key', 'name');
+    preferences.set('recent-files.sorting.direction', 'asc');
+
+    spyOn(contentApi, 'getPerson').and.returnValue(
+      of({
+        entry: { id: 'user' }
+      } as PersonEntry)
+    );
+
+    spyOn(contentApi, 'search').and.returnValue(
+      of({
+        list: {
+          entries: [
+            { entry: { id: 'node2', name: 'node 2', modifiedAt: new Date(2) } },
+            { entry: { id: 'node1', name: 'node 1', modifiedAt: new Date(1) } }
+          ]
+        }
+      } as ResultSetPaging)
+    );
+
+    const ids = await component.getFileIds('recent-files');
+    expect(ids).toEqual(['node1', 'node2']);
+  });
+
+  it('should sort file ids for favorites with [modifiedAt desc]', async () => {
+    spyOn(preferences, 'get').and.returnValue(null);
+
+    spyOn(contentApi, 'getPerson').and.returnValue(
+      of({
+        entry: { id: 'user' }
+      } as PersonEntry)
+    );
+
+    spyOn(contentApi, 'search').and.returnValue(
+      of({
+        list: {
+          entries: [
+            { entry: { id: 'node2', name: 'node 2', modifiedAt: new Date(2) } },
+            { entry: { id: 'node1', name: 'node 1', modifiedAt: new Date(1) } }
+          ]
+        }
+      } as ResultSetPaging)
+    );
+
+    const ids = await component.getFileIds('recent-files');
+    expect(ids).toEqual(['node2', 'node1']);
+  });
+
+  it('should return to parent folder on nodesDeleted event', async () => {
+    spyOn(component, 'navigateToFileLocation');
+    fixture.detectChanges();
+    await fixture.whenStable();
+    appHookService.nodesDeleted.next();
+
+    expect(component.navigateToFileLocation).toHaveBeenCalled();
+  });
+
+  it('should return to parent folder on fileUploadDeleted event', async () => {
+    spyOn(component, 'navigateToFileLocation');
+    fixture.detectChanges();
+    await fixture.whenStable();
+    uploadService.fileUploadDeleted.next();
+
+    expect(component.navigateToFileLocation).toHaveBeenCalled();
+  });
+
+  it('should emit nodeUpdated event on fileUploadComplete event', fakeAsync(() => {
+    spyOn(nodesApiService.nodeUpdated, 'next');
+    fixture.detectChanges();
+    uploadService.fileUploadComplete.next({ data: { entry: {} } } as any);
+    tick(300);
+
+    expect(nodesApiService.nodeUpdated.next).toHaveBeenCalled();
+  }));
+
+  it('should return to parent folder when event emitted from extension', async () => {
+    spyOn(component, 'navigateToFileLocation');
+    fixture.detectChanges();
+    await fixture.whenStable();
+    store.dispatch(new ClosePreviewAction());
+    expect(component.navigateToFileLocation).toHaveBeenCalled();
+  });
+
+  describe('Keyboard navigation', () => {
+    beforeEach(() => {
+      component.nextNodeId = 'nextNodeId';
+      component.previousNodeId = 'previousNodeId';
+      spyOn(router, 'navigate').and.stub();
+    });
+
+    afterEach(() => {
+      fixture.destroy();
+    });
+
+    it('should not navigate on keyboard event if target is child of sidebar container', () => {
+      const parent = document.createElement('div');
+      parent.className = 'adf-viewer__sidebar';
+
+      const child = document.createElement('button');
+      child.addEventListener('keyup', function (e) {
+        component.onNavigateNext(e);
+      });
+      parent.appendChild(child);
+      document.body.appendChild(parent);
+
+      child.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowLeft' }));
+
+      expect(router.navigate).not.toHaveBeenCalled();
+    });
+
+    it('should not navigate on keyboard event if target is child of cdk overlay', () => {
+      const parent = document.createElement('div');
+      parent.className = 'cdk-overlay-container';
+
+      const child = document.createElement('button');
+      child.addEventListener('keyup', function (e) {
+        component.onNavigateNext(e);
+      });
+      parent.appendChild(child);
+      document.body.appendChild(parent);
+
+      child.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowLeft' }));
+
+      expect(router.navigate).not.toHaveBeenCalled();
+    });
+  });
+});

projects/aca-content/preview/src/lib/components/preview.component.ts

@@ -0,0 +1,464 @@
+/*!
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Alfresco Example Content Application
+ *
+ * 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
+ * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { Component, OnInit, OnDestroy, ViewEncapsulation, HostListener } from '@angular/core';
+import { Location } from '@angular/common';
+import { ActivatedRoute, UrlTree, UrlSegmentGroup, UrlSegment, PRIMARY_OUTLET } from '@angular/router';
+import { debounceTime, map, takeUntil } from 'rxjs/operators';
+import { UserPreferencesService, ObjectUtils } from '@alfresco/adf-core';
+import { ClosePreviewAction, ViewerActionTypes, SetSelectedNodesAction } from '@alfresco/aca-shared/store';
+import { PageComponent, AppHookService, ContentApiService } from '@alfresco/aca-shared';
+import { ContentActionRef, ViewerExtensionRef } from '@alfresco/adf-extensions';
+import { SearchRequest } from '@alfresco/js-api';
+import { from } from 'rxjs';
+import { Actions, ofType } from '@ngrx/effects';
+import { NodesApiService } from '@alfresco/adf-content-services';
+
+@Component({
+  selector: 'app-preview',
+  templateUrl: './preview.component.html',
+  styleUrls: ['./preview.component.scss'],
+  encapsulation: ViewEncapsulation.None,
+  host: { class: 'app-preview' }
+})
+export class PreviewComponent extends PageComponent implements OnInit, OnDestroy {
+  previewLocation: string = null;
+  routesSkipNavigation = ['shared', 'recent-files', 'favorites'];
+  navigateSource: string = null;
+  navigationSources = ['favorites', 'libraries', 'personal-files', 'recent-files', 'shared'];
+  folderId: string = null;
+  nodeId: string = null;
+  previousNodeId: string;
+  nextNodeId: string;
+  navigateMultiple = false;
+  openWith: Array<ContentActionRef> = [];
+  contentExtensions: Array<ViewerExtensionRef> = [];
+  showRightSide = false;
+  navigateBackAsClose = false;
+  simplestMode = false;
+
+  recentFileFilters = [
+    'TYPE:"content"',
+    '-PNAME:"0/wiki"',
+    '-TYPE:"app:filelink"',
+    '-TYPE:"fm:post"',
+    '-TYPE:"cm:thumbnail"',
+    '-TYPE:"cm:failedThumbnail"',
+    '-TYPE:"cm:rating"',
+    '-TYPE:"dl:dataList"',
+    '-TYPE:"dl:todoList"',
+    '-TYPE:"dl:issue"',
+    '-TYPE:"dl:contact"',
+    '-TYPE:"dl:eventAgenda"',
+    '-TYPE:"dl:event"',
+    '-TYPE:"dl:task"',
+    '-TYPE:"dl:simpletask"',
+    '-TYPE:"dl:meetingAgenda"',
+    '-TYPE:"dl:location"',
+    '-TYPE:"fm:topic"',
+    '-TYPE:"fm:post"',
+    '-TYPE:"ia:calendarEvent"',
+    '-TYPE:"lnk:link"'
+  ];
+
+  private containersSkipNavigation = ['adf-viewer__sidebar', 'cdk-overlay-container', 'adf-image-viewer'];
+
+  constructor(
+    private contentApi: ContentApiService,
+    private preferences: UserPreferencesService,
+    private route: ActivatedRoute,
+    private nodesApiService: NodesApiService,
+    private actions$: Actions,
+    private location: Location,
+    private appHookService: AppHookService
+  ) {
+    super();
+  }
+
+  ngOnInit() {
+    super.ngOnInit();
+
+    from(this.infoDrawerOpened$)
+      .pipe(takeUntil(this.onDestroy$))
+      .subscribe((val) => {
+        this.showRightSide = val;
+      });
+
+    this.previewLocation = this.router.url.substr(0, this.router.url.indexOf('/', 1)).replace(/\//g, '');
+
+    const routeData = this.route.snapshot.data;
+    this.navigateBackAsClose = !!routeData.navigateBackAsClose;
+    this.simplestMode = !!routeData.simplestMode;
+
+    if (routeData.navigateMultiple) {
+      this.navigateMultiple = true;
+    }
+
+    if (routeData.navigateSource) {
+      const source = routeData.navigateSource.toLowerCase();
+      if (this.navigationSources.includes(source)) {
+        this.navigateSource = routeData.navigateSource;
+      }
+    }
+
+    this.route.params.subscribe((params) => {
+      this.folderId = params.folderId;
+      const id = params.nodeId;
+      if (id) {
+        this.displayNode(id);
+      }
+    });
+
+    this.subscriptions = this.subscriptions.concat([
+      this.appHookService.nodesDeleted.subscribe(() => this.navigateToFileLocation(true)),
+
+      this.uploadService.fileUploadDeleted.subscribe(() => this.navigateToFileLocation(true)),
+
+      this.uploadService.fileUploadComplete.pipe(debounceTime(300)).subscribe((file) => this.nodesApiService.nodeUpdated.next(file.data.entry)),
+
+      this.actions$
+        .pipe(
+          ofType<ClosePreviewAction>(ViewerActionTypes.ClosePreview),
+          map(() => this.navigateToFileLocation(true))
+        )
+        .subscribe(() => {})
+    ]);
+
+    this.extensions
+      .getOpenWithActions()
+      .pipe(takeUntil(this.onDestroy$))
+      .subscribe((actions) => {
+        this.openWith = actions;
+      });
+  }
+
+  ngOnDestroy() {
+    super.ngOnDestroy();
+  }
+
+  /**
+   * Loads the particular node into the Viewer
+   *
+   * @param id Unique identifier for the Node to display
+   */
+  async displayNode(id: string) {
+    if (id) {
+      try {
+        this.node = await this.contentApi.getNodeInfo(id).toPromise();
+        this.store.dispatch(new SetSelectedNodesAction([{ entry: this.node }]));
+
+        if (this.node && this.node.isFile) {
+          const nearest = await this.getNearestNodes(this.node.id, this.node.parentId);
+
+          this.previousNodeId = nearest.left;
+          this.nextNodeId = nearest.right;
+          this.nodeId = this.node.id;
+          return;
+        }
+        await this.router.navigate([this.previewLocation, id]);
+      } catch (err) {
+        if (!err || err.status !== 401) {
+          await this.router.navigate([this.previewLocation, id]);
+        }
+      }
+    }
+  }
+
+  @HostListener('document:keydown', ['$event'])
+  handleKeyboardEvent(event: KeyboardEvent) {
+    const key = event.keyCode;
+    const rightArrow = 39;
+    const leftArrow = 37;
+
+    if (key === rightArrow || key === leftArrow) {
+      event.preventDefault();
+      event.stopImmediatePropagation();
+    }
+  }
+
+  /**
+   * Handles the visibility change of the Viewer component.
+   *
+   * @param isVisible Indicator whether Viewer is visible or hidden.
+   */
+  onVisibilityChanged(isVisible: boolean): void {
+    const shouldNavigate = !isVisible;
+    this.navigateToFileLocation(shouldNavigate);
+  }
+
+  navigateToFileLocation(shouldNavigate: boolean) {
+    if (shouldNavigate) {
+      if (this.navigateBackAsClose) {
+        this.location.back();
+      } else {
+        const shouldSkipNavigation = this.routesSkipNavigation.includes(this.previewLocation);
+        const route = this.getNavigationCommands(this.previewLocation);
+
+        if (!shouldSkipNavigation && this.folderId) {
+          route.push(this.folderId);
+        }
+        this.router.navigate(route);
+      }
+    }
+  }
+
+  /** Handles navigation to a previous document */
+  onNavigateBefore(event: MouseEvent | KeyboardEvent): void {
+    if (event.type !== 'click' && this.shouldNavigate(event.target as HTMLElement)) {
+      return;
+    }
+
+    if (this.previousNodeId) {
+      this.router.navigate(this.getPreviewPath(this.folderId, this.previousNodeId));
+    }
+  }
+
+  /** Handles navigation to a next document */
+  onNavigateNext(event: MouseEvent | KeyboardEvent): void {
+    if (event.type !== 'click' && this.shouldNavigate(event.target as HTMLElement)) {
+      return;
+    }
+
+    if (this.nextNodeId) {
+      this.router.navigate(this.getPreviewPath(this.folderId, this.nextNodeId));
+    }
+  }
+
+  /**
+   * Generates a node preview route based on folder and node IDs.
+   *
+   * @param folderId Folder ID
+   * @param nodeId Node ID
+   */
+  getPreviewPath(folderId: string, nodeId: string): any[] {
+    const route = [this.previewLocation];
+
+    if (folderId) {
+      route.push(folderId);
+    }
+
+    if (nodeId) {
+      route.push('preview', nodeId);
+    }
+
+    return route;
+  }
+
+  /**
+   * Retrieves nearest node information for the given node and folder.
+   *
+   * @param nodeId Unique identifier of the document node
+   * @param folderId Unique identifier of the containing folder node.
+   */
+  async getNearestNodes(nodeId: string, folderId: string): Promise<{ left: string; right: string }> {
+    const empty = {
+      left: null,
+      right: null
+    };
+
+    if (nodeId && folderId) {
+      try {
+        const ids = await this.getFileIds(this.navigateSource, folderId);
+        const idx = ids.indexOf(nodeId);
+
+        if (idx >= 0) {
+          return {
+            left: ids[idx - 1] || null,
+            right: ids[idx + 1] || null
+          };
+        } else {
+          return empty;
+        }
+      } catch {
+        return empty;
+      }
+    } else {
+      return empty;
+    }
+  }
+
+  /**
+   * Retrieves a list of node identifiers for the folder and data source.
+   *
+   * @param source Data source name. Allowed values are: personal-files, libraries, favorites, shared, recent-files.
+   * @param folderId Containing folder node identifier for 'personal-files' and 'libraries' sources.
+   */
+  async getFileIds(source: string, folderId?: string): Promise<string[]> {
+    if ((source === 'personal-files' || source === 'libraries') && folderId) {
+      const sortKey = this.preferences.get('personal-files.sorting.key') || 'modifiedAt';
+      const sortDirection = this.preferences.get('personal-files.sorting.direction') || 'desc';
+      const nodes = await this.contentApi
+        .getNodeChildren(folderId, {
+          // orderBy: `${sortKey} ${sortDirection}`,
+          fields: ['id', this.getRootField(sortKey)],
+          where: '(isFile=true)'
+        })
+        .toPromise();
+
+      const entries = nodes.list.entries.map((obj) => obj.entry);
+      this.sort(entries, sortKey, sortDirection);
+
+      return entries.map((obj) => obj.id);
+    }
+
+    if (source === 'favorites') {
+      const nodes = await this.contentApi
+        .getFavorites('-me-', {
+          where: '(EXISTS(target/file))',
+          fields: ['target']
+        })
+        .toPromise();
+
+      const sortKey = this.preferences.get('favorites.sorting.key') || 'modifiedAt';
+      const sortDirection = this.preferences.get('favorites.sorting.direction') || 'desc';
+      const files = nodes.list.entries.map((obj) => obj.entry.target.file);
+      this.sort(files, sortKey, sortDirection);
+
+      return files.map((f) => f.id);
+    }
+
+    if (source === 'shared') {
+      const sortingKey = this.preferences.get('shared.sorting.key') || 'modifiedAt';
+      const sortingDirection = this.preferences.get('shared.sorting.direction') || 'desc';
+
+      const nodes = await this.contentApi
+        .findSharedLinks({
+          fields: ['nodeId', this.getRootField(sortingKey)]
+        })
+        .toPromise();
+
+      const entries = nodes.list.entries.map((obj) => obj.entry);
+      this.sort(entries, sortingKey, sortingDirection);
+
+      return entries.map((obj) => obj.nodeId);
+    }
+
+    if (source === 'recent-files') {
+      const person = await this.contentApi.getPerson('-me-').toPromise();
+      const username = person.entry.id;
+      const sortingKey = this.preferences.get('recent-files.sorting.key') || 'modifiedAt';
+      const sortingDirection = this.preferences.get('recent-files.sorting.direction') || 'desc';
+
+      const query: SearchRequest = {
+        query: {
+          query: '*',
+          language: 'afts'
+        },
+        filterQueries: [
+          { query: `cm:modified:[NOW/DAY-30DAYS TO NOW/DAY+1DAY]` },
+          { query: `cm:modifier:${username} OR cm:creator:${username}` },
+          {
+            query: this.recentFileFilters.join(' AND ')
+          }
+        ],
+        fields: ['id', this.getRootField(sortingKey)],
+        include: ['path', 'properties', 'allowableOperations'],
+        sort: [
+          {
+            type: 'FIELD',
+            field: 'cm:modified',
+            ascending: false
+          }
+        ]
+      };
+      const nodes = await this.contentApi.search(query).toPromise();
+
+      const entries = nodes.list.entries.map((obj) => obj.entry);
+      this.sort(entries, sortingKey, sortingDirection);
+
+      return entries.map((obj) => obj.id);
+    }
+
+    return [];
+  }
+
+  private sort(items: any[], key: string, direction: string) {
+    const options: Intl.CollatorOptions = {};
+
+    if (key.includes('sizeInBytes') || key === 'name') {
+      options.numeric = true;
+    }
+
+    items.sort((a: any, b: any) => {
+      let left = ObjectUtils.getValue(a, key);
+      if (left) {
+        left = left instanceof Date ? left.valueOf().toString() : left.toString();
+      } else {
+        left = '';
+      }
+
+      let right = ObjectUtils.getValue(b, key);
+      if (right) {
+        right = right instanceof Date ? right.valueOf().toString() : right.toString();
+      } else {
+        right = '';
+      }
+
+      return direction === 'asc' ? left.localeCompare(right, undefined, options) : right.localeCompare(left, undefined, options);
+    });
+  }
+
+  /**
+   * Get the root field name from the property path.
+   * Example: 'property1.some.child.property' => 'property1'
+   *
+   * @param path Property path
+   */
+  getRootField(path: string) {
+    if (path) {
+      return path.split('.')[0];
+    }
+    return path;
+  }
+
+  private getNavigationCommands(url: string): any[] {
+    const urlTree: UrlTree = this.router.parseUrl(url);
+    const urlSegmentGroup: UrlSegmentGroup = urlTree.root.children[PRIMARY_OUTLET];
+
+    if (!urlSegmentGroup) {
+      return [url];
+    }
+
+    const urlSegments: UrlSegment[] = urlSegmentGroup.segments;
+
+    return urlSegments.reduce(function (acc, item) {
+      acc.push(item.path, item.parameters);
+      return acc;
+    }, []);
+  }
+
+  private shouldNavigate(element: HTMLElement): boolean {
+    let currentElement = element.parentElement;
+
+    while (currentElement && !this.isChild(currentElement.classList)) {
+      currentElement = currentElement.parentElement;
+    }
+
+    return !!currentElement;
+  }
+
+  private isChild(list: DOMTokenList): boolean {
+    return Array.from(list).some((className: string) => this.containersSkipNavigation.includes(className));
+  }
+}

projects/aca-content/preview/src/lib/preview.module.ts

@@ -0,0 +1,61 @@
+/*!
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Alfresco Example Content Application
+ *
+ * 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
+ * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { CoreModule } from '@alfresco/adf-core';
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { ContentDirectiveModule, ContentModule } from '@alfresco/adf-content-services';
+import { SharedDirectivesModule, SharedToolbarModule, InfoDrawerComponent } from '@alfresco/aca-shared';
+import { ExtensionsModule } from '@alfresco/adf-extensions';
+import { PreviewComponent } from './components/preview.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: PreviewComponent,
+    data: {
+      title: 'APP.PREVIEW.TITLE',
+      navigateMultiple: true
+    }
+  }
+];
+
+@NgModule({
+  imports: [
+    CommonModule,
+    RouterModule.forChild(routes),
+    CoreModule.forChild(),
+    ExtensionsModule,
+    ContentModule,
+    ContentDirectiveModule,
+    SharedDirectivesModule,
+    ContentDirectiveModule,
+    SharedToolbarModule,
+    InfoDrawerComponent
+  ],
+  declarations: [PreviewComponent],
+  exports: [PreviewComponent]
+})
+export class PreviewModule {}

projects/aca-content/preview/src/public-api.ts

@@ -0,0 +1,30 @@
+/*!
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Alfresco Example Content Application
+ *
+ * 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
+ * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+/*
+ * Public API Surface of aca-preview
+ */
+
+export * from './lib/components/preview.component';
+export * from './lib/preview.module';

projects/aca-content/preview/src/test.ts

@@ -0,0 +1,49 @@
+/*!
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Alfresco Example Content Application
+ *
+ * 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
+ * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+
+import 'zone.js';
+import 'zone.js/testing';
+import { getTestBed } from '@angular/core/testing';
+import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
+
+declare const require: {
+  context(
+    path: string,
+    deep?: boolean,
+    filter?: RegExp
+  ): {
+    <T>(id: string): T;
+    keys(): string[];
+  };
+};
+
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
+
+// Then we find all the tests.
+const context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().forEach(context);