[ACA-4728] fix file order in viewer (#3631)

* [ACA-4728] fix file order in viewer

* [ACA-4728] refactor viewer and preview, save and restore previous sorting in viewer and document pages when client sorting, add viewer unit tests

* [ACA-4728] remove duplicated license

* [ACA-4728] add missing imports

* [ACA-4728] address comments, improve initial sorting setting, improve tests, reduce duplication

* [ACA-4728] further reduce code duplication, remove/replace faulty unit tests

* [ACA-4728] move reusable unit test config to testing module

* [ACA-4728] address comments

* [ACA-4728] address comment - remove reduntant if

* [ACA-4728] update headers in new files

projects/aca-shared/src/lib/components/document-base-page/document-base-page.component.ts

@@ -25,7 +25,7 @@
 import { DocumentListComponent, ShareDataRow, UploadService } from '@alfresco/adf-content-services';
 import { ShowHeaderMode } from '@alfresco/adf-core';
 import { ContentActionRef, DocumentListPresetRef, SelectionState } from '@alfresco/adf-extensions';
-import { OnDestroy, OnInit, OnChanges, ViewChild, SimpleChanges, Directive, inject } from '@angular/core';
+import { OnDestroy, OnInit, OnChanges, ViewChild, SimpleChanges, Directive, inject, HostListener } from '@angular/core';
 import { Store } from '@ngrx/store';
 import { NodeEntry, Node, NodePaging } from '@alfresco/js-api';
 import { Observable, Subject, Subscription } from 'rxjs';
@@ -207,6 +207,7 @@ export abstract class PageComponent implements OnInit, OnDestroy, OnChanges {
     return location.href.includes('viewer:view');
   }
 
+  @HostListener('sorting-changed', ['$event'])
   onSortingChanged(event: any) {
     this.filterSorting = event.detail.key + '-' + event.detail.direction;
   }

projects/aca-shared/src/lib/components/document-base-page/document-base-page.spec.ts

@@ -25,64 +25,18 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { PageComponent } from './document-base-page.component';
 import { AppState, ReloadDocumentListAction, SetSelectedNodesAction, ViewNodeAction } from '@alfresco/aca-shared/store';
-import { AppExtensionService } from '@alfresco/aca-shared';
-import { NodeEntry, NodePaging, RepositoryInfo, VersionInfo } from '@alfresco/js-api';
+import { AppExtensionService, LibTestingModule, discoveryApiServiceMockValue, DocumentBasePageServiceMock } from '@alfresco/aca-shared';
+import { NodeEntry, NodePaging } from '@alfresco/js-api';
 import { DocumentBasePageService } from './document-base-page.service';
-import { Store, StoreModule } from '@ngrx/store';
-import { Component, Injectable } from '@angular/core';
+import { Store } from '@ngrx/store';
+import { Component } from '@angular/core';
 import { DiscoveryApiService, DocumentListComponent } from '@alfresco/adf-content-services';
 import { MockStore, provideMockStore } from '@ngrx/store/testing';
-import { AuthModule, MaterialModule, PipeModule } from '@alfresco/adf-core';
+import { AuthModule, MaterialModule } from '@alfresco/adf-core';
 import { HttpClientModule } from '@angular/common/http';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { RouterTestingModule } from '@angular/router/testing';
-import { EffectsModule } from '@ngrx/effects';
-import { BehaviorSubject, Observable, of, Subscription } from 'rxjs';
-
-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,
-  showLoader: false,
-  repository: {
-    status: {
-      isQuickShareEnabled: true
-    }
-  } as any
-};
-
-@Injectable()
-class DocumentBasePageServiceMock extends DocumentBasePageService {
-  canUpdateNode(): boolean {
-    return true;
-  }
-  canUploadContent(): boolean {
-    return true;
-  }
-}
+import { Subscription } from 'rxjs';
 
 @Component({
   selector: 'aca-test',
@@ -107,47 +61,11 @@ describe('PageComponent', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [
-        NoopAnimationsModule,
-        HttpClientModule,
-        RouterTestingModule,
-        MaterialModule,
-        AuthModule.forRoot(),
-        StoreModule.forRoot(
-          { app: (state) => state },
-          {
-            initialState: {
-              app: INITIAL_APP_STATE
-            },
-            runtimeChecks: {
-              strictStateImmutability: false,
-              strictActionImmutability: false
-            }
-          }
-        ),
-        EffectsModule.forRoot([]),
-        PipeModule
-      ],
+      imports: [LibTestingModule, MaterialModule, AuthModule.forRoot()],
       declarations: [TestComponent],
       providers: [
-        {
-          provide: DocumentBasePageService,
-          useClass: DocumentBasePageServiceMock
-        },
-        {
-          provide: DiscoveryApiService,
-          useValue: {
-            ecmProductInfo$: new BehaviorSubject<RepositoryInfo | null>(null),
-            getEcmProductInfo: (): Observable<RepositoryInfo> =>
-              of(
-                new RepositoryInfo({
-                  version: {
-                    major: '10.0.0'
-                  } as VersionInfo
-                })
-              )
-          }
-        },
+        { provide: DocumentBasePageService, useClass: DocumentBasePageServiceMock },
+        { provide: DiscoveryApiService, useValue: discoveryApiServiceMockValue },
         AppExtensionService
       ]
     });
@@ -298,20 +216,7 @@ describe('Info Drawer state', () => {
       providers: [
         { provide: DocumentBasePageService, useClass: DocumentBasePageServiceMock },
         AppExtensionService,
-        {
-          provide: DiscoveryApiService,
-          useValue: {
-            ecmProductInfo$: new BehaviorSubject<RepositoryInfo | null>(null),
-            getEcmProductInfo: (): Observable<RepositoryInfo> =>
-              of(
-                new RepositoryInfo({
-                  version: {
-                    major: '10.0.0'
-                  } as VersionInfo
-                })
-              )
-          }
-        },
+        { provide: DiscoveryApiService, useValue: discoveryApiServiceMockValue },
         provideMockStore({
           initialState: { app: appState }
         })
@@ -337,7 +242,7 @@ describe('Info Drawer state', () => {
     window.history.pushState({}, null, `${locationHref}#test`);
     fixture.detectChanges();
 
-    fixture.whenStable().then(() => {
+    void fixture.whenStable().then(() => {
       component.infoDrawerOpened$.subscribe((state) => {
         expect(state).toBe(true);
         done();
@@ -356,7 +261,7 @@ describe('Info Drawer state', () => {
     window.history.pushState({}, null, `${locationHref}#test(viewer:view)`);
     fixture.detectChanges();
 
-    fixture.whenStable().then(() => {
+    void fixture.whenStable().then(() => {
       component.infoDrawerOpened$.subscribe((state) => {
         expect(state).toBe(true);
         done();

projects/aca-shared/src/lib/testing/lib-testing-module.ts

@@ -22,7 +22,7 @@
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { NgModule } from '@angular/core';
+import { Injectable, NgModule } from '@angular/core';
 import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import {
@@ -40,6 +40,9 @@ import { StoreModule } from '@ngrx/store';
 import { CommonModule } from '@angular/common';
 import { MatIconTestingModule } from '@angular/material/icon/testing';
 import { OverlayModule } from '@angular/cdk/overlay';
+import { RepositoryInfo, VersionInfo } from '@alfresco/js-api';
+import { BehaviorSubject, Observable, of } from 'rxjs';
+import { DocumentBasePageService } from '../../public-api';
 
 export const initialState = {
   app: {
@@ -72,6 +75,28 @@ export const initialState = {
   }
 };
 
+export const discoveryApiServiceMockValue = {
+  ecmProductInfo$: new BehaviorSubject<RepositoryInfo | null>(null),
+  getEcmProductInfo: (): Observable<RepositoryInfo> =>
+    of(
+      new RepositoryInfo({
+        version: {
+          major: '10.0.0'
+        } as VersionInfo
+      })
+    )
+};
+
+@Injectable()
+export class DocumentBasePageServiceMock extends DocumentBasePageService {
+  canUpdateNode(): boolean {
+    return true;
+  }
+  canUploadContent(): boolean {
+    return true;
+  }
+}
+
 @NgModule({
   imports: [
     NoopAnimationsModule,