[ACA-4728] refactor viewer and preview, save and restore previous sor…

…ting in viewer and document pages when client sorting, add viewer unit tests
Alfresco · Mar 14, 2024 · c0b78b1 · c0b78b1
1 parent fd92766
commit c0b78b1
Show file tree

Hide file tree

Showing 25 changed files with 840 additions and 971 deletions.
diff --git a/projects/aca-content/preview/ng-package.json b/projects/aca-content/preview/ng-package.json
diff --git a/projects/aca-content/preview/src/lib/preview.module.ts b/projects/aca-content/preview/src/lib/preview.module.ts
diff --git a/projects/aca-content/preview/src/public-api.ts b/projects/aca-content/preview/src/public-api.ts
diff --git a/projects/aca-content/preview/src/test.ts b/projects/aca-content/preview/src/test.ts
diff --git a/projects/aca-content/src/lib/aca-content.module.ts b/projects/aca-content/src/lib/aca-content.module.ts
@@ -63,7 +63,7 @@ import { CommentsTabComponent } from './components/info-drawer/comments-tab/comm
 import { LibraryMetadataTabComponent } from './components/info-drawer/library-metadata-tab/library-metadata-tab.component';
 import { MetadataTabComponent } from './components/info-drawer/metadata-tab/metadata-tab.component';
 import { VersionsTabComponent } from './components/info-drawer/versions-tab/versions-tab.component';
-import { PreviewComponent } from '@alfresco/aca-content/preview';
+import { PreviewComponent } from '@alfresco/aca-content/viewer';
 import { ToggleEditOfflineComponent } from './components/toolbar/toggle-edit-offline/toggle-edit-offline.component';
 import { ToggleFavoriteLibraryComponent } from './components/toolbar/toggle-favorite-library/toggle-favorite-library.component';
 import { ToggleFavoriteComponent } from './components/toolbar/toggle-favorite/toggle-favorite.component';

diff --git a/projects/aca-content/src/lib/components/favorite-libraries/favorite-libraries.component.html b/projects/aca-content/src/lib/components/favorite-libraries/favorite-libraries.component.html
@@ -45,6 +45,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.LIBRARIES.MENU.FAVORITE_LIBRARIES.TITL
                 [class]="column.class"
                 [sortable]="column.sortable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
                 <ng-template let-context>
                   <adf-dynamic-column [id]="column.template" [context]="context"> </adf-dynamic-column>
@@ -64,6 +65,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.LIBRARIES.MENU.FAVORITE_LIBRARIES.TITL
                 [class]="column.class"
                 [sortable]="column.sortable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
               </data-column>
             </ng-container>

diff --git a/projects/aca-content/src/lib/components/favorites/favorites.component.html b/projects/aca-content/src/lib/components/favorites/favorites.component.html
@@ -40,6 +40,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.FAVORITES.TITLE' | translate }}</h1>
                 [class]="column.class"
                 [sortable]="column.sortable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
                 <ng-template let-context>
                   <adf-dynamic-column [id]="column.template" [context]="context"> </adf-dynamic-column>
@@ -59,6 +60,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.FAVORITES.TITLE' | translate }}</h1>
                 [class]="column.class"
                 [sortable]="column.sortable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
               </data-column>
             </ng-container>

diff --git a/projects/aca-content/src/lib/components/files/files.component.html b/projects/aca-content/src/lib/components/files/files.component.html
@@ -23,15 +23,14 @@
           [node]="nodeResult"
           [allowDropFiles]="true"
           [navigate]="false"
-          [sorting]="['name', 'ASC']"
+          [sorting]="['name', 'asc']"
           [imageResolver]="imageResolver"
           [headerFilters]="true"
           [filterValue]="queryParams"
           [isResizingEnabled]="true"
           [blurOnResize]="false"
           (node-dblclick)="handleNodeClick($event)"
           (name-click)="handleNodeClick($event)"
-          (sorting-changed)="onSortingChanged($event)"
           (filterSelection)="onFilterSelected($event)"
           (error)="onError()"
         >

diff --git a/projects/aca-content/src/lib/components/files/files.component.ts b/projects/aca-content/src/lib/components/files/files.component.ts
@@ -22,8 +22,8 @@
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { DataTableModule, PaginationModule, ShowHeaderMode, UserPreferencesService } from '@alfresco/adf-core';
-import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
+import { DataTableModule, PaginationModule, ShowHeaderMode } from '@alfresco/adf-core';
+import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
 import { ActivatedRoute, Params } from '@angular/router';
 import { NodeEntry, Node, PathElement } from '@alfresco/js-api';
 import { NodeActionsService } from '../../services/node-actions.service';
@@ -39,15 +39,7 @@ import {
 } from '@alfresco/aca-shared';
 import { SetCurrentFolderAction, isAdmin, UploadFileVersionAction, showLoaderSelector } from '@alfresco/aca-shared/store';
 import { debounceTime, takeUntil } from 'rxjs/operators';
-import {
-  BreadcrumbModule,
-  DocumentListComponent,
-  DocumentListModule,
-  FilterSearch,
-  FileUploadEvent,
-  UploadModule,
-  ShareDataRow
-} from '@alfresco/adf-content-services';
+import { BreadcrumbModule, DocumentListModule, FileUploadEvent, FilterSearch, ShareDataRow, UploadModule } from '@alfresco/adf-content-services';
 import { DocumentListPresetRef, ExtensionsModule } from '@alfresco/adf-extensions';
 import { CommonModule } from '@angular/common';
 import { TranslateModule } from '@ngx-translate/core';
@@ -77,27 +69,18 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
   templateUrl: './files.component.html',
   encapsulation: ViewEncapsulation.None
 })
-export class FilesComponent extends PageComponent implements OnInit, OnDestroy, AfterViewInit {
+export class FilesComponent extends PageComponent implements OnInit, OnDestroy {
   isValidPath = true;
   isAdmin = false;
   selectedNode: NodeEntry;
   queryParams = null;
-
   showLoader$ = this.store.select(showLoaderSelector);
   private nodePath: PathElement[];
 
   columns: DocumentListPresetRef[] = [];
   isFilterHeaderActive = false;
 
-  @ViewChild('documentList', { static: true })
-  documentList: DocumentListComponent;
-
-  constructor(
-    private route: ActivatedRoute,
-    private contentApi: ContentApiService,
-    private nodeActionsService: NodeActionsService,
-    private preferences: UserPreferencesService
-  ) {
+  constructor(private contentApi: ContentApiService, private nodeActionsService: NodeActionsService, private route: ActivatedRoute) {
     super();
   }
 
@@ -119,9 +102,9 @@ export class FilesComponent extends PageComponent implements OnInit, OnDestroy,
           this.isValidPath = true;
 
           if (node?.entry?.isFolder) {
-            this.updateCurrentNode(node.entry);
+            void this.updateCurrentNode(node.entry);
           } else {
-            this.router.navigate(['/personal-files', node.entry.parentId], {
+            void this.router.navigate(['/personal-files', node.entry.parentId], {
               replaceUrl: true
             });
           }
@@ -152,10 +135,6 @@ export class FilesComponent extends PageComponent implements OnInit, OnDestroy,
     }
   }
 
-  ngAfterViewInit() {
-    this.preferences.set('filesPageSortingMode', this.documentList.sortingMode);
-  }
-
   ngOnDestroy() {
     this.store.dispatch(new SetCurrentFolderAction(null));
     super.ngOnDestroy();
@@ -165,7 +144,7 @@ export class FilesComponent extends PageComponent implements OnInit, OnDestroy,
     const currentNodeId = this.route.snapshot.paramMap.get('folderId');
     const urlWithoutParams = decodeURIComponent(this.router.url).split('?')[0];
     const urlToNavigate: string[] = this.getUrlToNavigate(urlWithoutParams, currentNodeId, nodeId);
-    this.router.navigate(urlToNavigate);
+    void this.router.navigate(urlToNavigate);
   }
 
   private getUrlToNavigate(currentURL: string, currentNodeId: string, nextNodeId: string): string[] {
@@ -370,7 +349,7 @@ export class FilesComponent extends PageComponent implements OnInit, OnDestroy,
       this.isFilterHeaderActive = true;
       this.navigateToFilter(activeFilters);
     } else {
-      this.router.navigate(['.'], { relativeTo: this.route });
+      void this.router.navigate(['.'], { relativeTo: this.route });
       this.isFilterHeaderActive = false;
       this.showHeader = ShowHeaderMode.Data;
       this.onAllFilterCleared();
@@ -389,7 +368,7 @@ export class FilesComponent extends PageComponent implements OnInit, OnDestroy,
       objectFromMap[filter.key] = paramValue;
     });
 
-    this.router.navigate([], { relativeTo: this.route, queryParams: objectFromMap });
+    void this.router.navigate([], { relativeTo: this.route, queryParams: objectFromMap });
   }
 
   onError() {

diff --git a/projects/aca-content/src/lib/components/libraries/libraries.component.html b/projects/aca-content/src/lib/components/libraries/libraries.component.html
@@ -44,6 +44,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.LIBRARIES.MENU.MY_LIBRARIES.TITLE' | t
                 [class]="column.class"
                 [sortable]="column.sortable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
                 <ng-template let-context>
                   <adf-dynamic-column [id]="column.template" [context]="context"> </adf-dynamic-column>
@@ -63,6 +64,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.LIBRARIES.MENU.MY_LIBRARIES.TITLE' | t
                 [resizable]="column.resizable"
                 [sortable]="column.sortable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
               </data-column>
             </ng-container>

diff --git a/projects/aca-content/src/lib/components/recent-files/recent-files.component.html b/projects/aca-content/src/lib/components/recent-files/recent-files.component.html
@@ -40,6 +40,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.RECENT.TITLE' | translate }}</h1>
                 [draggable]="column.draggable"
                 [resizable]="column.resizable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
                 <ng-template let-context>
                   <adf-dynamic-column [id]="column.template" [context]="context"> </adf-dynamic-column>
@@ -59,6 +60,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.RECENT.TITLE' | translate }}</h1>
                 [isHidden]="column.isHidden"
                 [draggable]="column.draggable"
                 [resizable]="column.resizable"
+                [sortingKey]="column.sortingKey || column.key"
               >
               </data-column>
             </ng-container>

diff --git a/projects/aca-content/src/lib/components/shared-files/shared-files.component.html b/projects/aca-content/src/lib/components/shared-files/shared-files.component.html
@@ -39,6 +39,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.SHARED.TITLE' | translate }}</h1>
                 [isHidden]="column.isHidden"
                 [draggable]="column.draggable"
                 [resizable]="column.resizable"
+                [sortingKey]="column.sortingKey || column.key"
               >
                 <ng-template let-context>
                   <adf-dynamic-column [id]="column.template" [context]="context"> </adf-dynamic-column>
@@ -58,6 +59,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.SHARED.TITLE' | translate }}</h1>
                 [class]="column.class"
                 [sortable]="column.sortable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
               </data-column>
             </ng-container>

diff --git a/projects/aca-content/src/lib/components/trashcan/trashcan.component.html b/projects/aca-content/src/lib/components/trashcan/trashcan.component.html
@@ -45,6 +45,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.TRASHCAN.TITLE' | translate }}</h1>
                 [class]="column.class"
                 [sortable]="column.sortable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
                 <ng-template let-context>
                   <adf-dynamic-column [id]="column.template" [context]="context"> </adf-dynamic-column>
@@ -64,6 +65,7 @@ <h1 class="aca-page-title">{{ 'APP.BROWSE.TRASHCAN.TITLE' | translate }}</h1>
                 [draggable]="column.draggable"
                 [resizable]="column.resizable"
                 [isHidden]="column.isHidden"
+                [sortingKey]="column.sortingKey || column.key"
               >
               </data-column>
             </ng-container>