RED-6829 - INC15516657: Performance issues

apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.html

@@ -31,6 +31,7 @@
                 [attr.help-mode-key]="'workload_in_editor'"
                 [primaryFiltersSlug]="'primaryFilters'"
                 [secondaryFiltersSlug]="'secondaryFilters'"
+                [fileId]="state.file()?.id"
             ></iqser-popup-filter>
         </div>
     </div>

apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, Component, computed, effect, ElementRef, HostListener, OnDestroy, ViewChild } from '@angular/core';
+import { ChangeDetectorRef, Component, computed, effect, ElementRef, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core';
 import { AnnotationWrapper } from '@models/file/annotation.wrapper';
 import { AnnotationProcessingService } from '../../services/annotation-processing.service';
 import { MatDialog } from '@angular/material/dialog';
@@ -30,6 +30,7 @@ import { REDDocumentViewer } from '../../../pdf-viewer/services/document-viewer.
 import { SuggestionsService } from '../../services/suggestions.service';
 import { ListItem } from '@models/file/list-item';
 import { PageRotationService } from '../../../pdf-viewer/services/page-rotation.service';
+import { getLocalStorageDataByFileId } from '@utils/local-storage';
 
 const COMMAND_KEY_ARRAY = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Escape'];
 const ALL_HOTKEY_ARRAY = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'];
@@ -39,7 +40,7 @@ const ALL_HOTKEY_ARRAY = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'];
     templateUrl: './file-workload.component.html',
     styleUrls: ['./file-workload.component.scss'],
 })
-export class FileWorkloadComponent extends AutoUnsubscribe implements OnDestroy {
+export class FileWorkloadComponent extends AutoUnsubscribe implements OnInit, OnDestroy {
     readonly iconButtonTypes = IconButtonTypes;
     readonly circleButtonTypes = CircleButtonTypes;
 
@@ -115,6 +116,20 @@ export class FileWorkloadComponent extends AutoUnsubscribe implements OnDestroy
         );
     }
 
+    ngOnInit(): void {
+        setTimeout(() => {
+            const showExcludePages = getLocalStorageDataByFileId(this.state.file()?.id, 'show-exclude-pages') ?? false;
+            if (showExcludePages) {
+                this.excludedPagesService.show();
+            }
+
+            const showDocumentInfo = getLocalStorageDataByFileId(this.state.file()?.id, 'show-document-info') ?? false;
+            if (showDocumentInfo) {
+                this.documentInfoService.show();
+            }
+        });
+    }
+
     get activeAnnotations(): AnnotationWrapper[] {
         return this.displayedAnnotations.get(this.pdf.currentPage()) || [];
     }

apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.ts

@@ -19,6 +19,7 @@ import {
     CircleButtonTypes,
     ConfirmOption,
     ConfirmOptions,
+    copyLocalStorageFiltersValues,
     CustomError,
     Debounce,
     ErrorService,
@@ -41,7 +42,7 @@ import { AnnotationDrawService } from '../pdf-viewer/services/annotation-draw.se
 import { AnnotationProcessingService } from './services/annotation-processing.service';
 import { Dictionary, File, ViewModes } from '@red/domain';
 import { PermissionsService } from '@services/permissions.service';
-import { combineLatest, firstValueFrom, of, pairwise } from 'rxjs';
+import { combineLatest, first, firstValueFrom, of, pairwise } from 'rxjs';
 import { PreferencesKeys, UserPreferenceService } from '@users/user-preference.service';
 import { byId, byPage, download, handleFilterDelta, hasChanges } from '../../utils';
 import { FilesService } from '@services/files/files.service';
@@ -336,6 +337,7 @@ export class FilePreviewScreenComponent
         }
 
         this.pdfProxyService.configureElements();
+        this.#restoreOldFilters();
         document.documentElement.addEventListener('fullscreenchange', this.fullscreenListener);
     }
 
@@ -822,4 +824,18 @@ export class FilePreviewScreenComponent
     private _isJapaneseString(text: string) {
         return text.match(/[\u3000-\u303f\u3040-\u309f\u30a0-\u30ff\uff00-\uff9f\u4e00-\u9faf\u3400-\u4dbf]/);
     }
+
+    #restoreOldFilters() {
+        combineLatest([
+            this._filterService.getGroup$('primaryFilters').pipe(first(filterGroup => !!filterGroup?.filters.length)),
+            this._filterService.getGroup$('secondaryFilters').pipe(first(secondaryFilters => !!secondaryFilters?.filters.length)),
+        ]).subscribe(([primaryFilters, secondaryFilters]) => {
+            const localStorageFiltersString = localStorage.getItem('workload-filters') ?? '{}';
+            const localStorageFilters = JSON.parse(localStorageFiltersString)[this.fileId];
+            if (localStorageFilters) {
+                copyLocalStorageFiltersValues(primaryFilters.filters, localStorageFilters.primaryFilters);
+                copyLocalStorageFiltersValues(secondaryFilters.filters, localStorageFilters.secondaryFilters);
+            }
+        });
+    }
 }

apps/red-ui/src/app/modules/file-preview/file-preview.module.ts

@@ -72,7 +72,6 @@ const routes: IqserRoutes = [
         path: '',
         component: FilePreviewScreenComponent,
         pathMatch: 'full',
-        data: { reuse: true },
         canDeactivate: [PendingChangesGuard, DocumentUnloadedGuard],
     },
 ];

apps/red-ui/src/app/modules/shared-dossiers/components/file-actions/file-actions.component.ts

@@ -32,6 +32,7 @@ import { ROTATION_ACTION_BUTTONS } from '../../../pdf-viewer/utils/constants';
 import { Roles } from '@users/roles';
 import { FileAttributesService } from '@services/entity-services/file-attributes.service';
 import { toObservable } from '@angular/core/rxjs-interop';
+import { setLocalStorageDataByFileId } from '@utils/local-storage';
 
 @Component({
     selector: 'redaction-file-actions',
@@ -160,7 +161,7 @@ export class FileActionsComponent implements OnChanges {
             {
                 id: 'toggle-document-info-btn',
                 type: ActionTypes.circleBtn,
-                action: () => this._documentInfoService.toggle(),
+                action: () => this.#toggleDocumentInfo(),
                 tooltip: _('file-preview.document-info'),
                 ariaExpanded: toObservable(this._documentInfoService?.shown, { injector: this._injector }),
                 icon: 'red:status-info',
@@ -169,7 +170,7 @@ export class FileActionsComponent implements OnChanges {
             {
                 id: 'toggle-exclude-pages-btn',
                 type: ActionTypes.circleBtn,
-                action: () => this._excludedPagesService.toggle(),
+                action: () => this.#toggleExcludePages(),
                 tooltip: _('file-preview.exclude-pages'),
                 ariaExpanded: toObservable(this._excludedPagesService?.shown, { injector: this._injector }),
                 showDot: !!this.file.excludedPages?.length,
@@ -456,4 +457,22 @@ export class FileActionsComponent implements OnChanges {
         await this._filesService.setToNew(this.file);
         this._loadingService.stop();
     }
+
+    async #toggleExcludePages() {
+        this._excludedPagesService.toggle();
+        const shown = await this._excludedPagesService.shown();
+        setLocalStorageDataByFileId(this.file.id, 'show-exclude-pages', shown);
+        if (shown) {
+            setLocalStorageDataByFileId(this.file.id, 'show-document-info', false);
+        }
+    }
+
+    async #toggleDocumentInfo() {
+        this._documentInfoService.toggle();
+        const shown = await this._documentInfoService.shown();
+        setLocalStorageDataByFileId(this.file.id, 'show-document-info', shown);
+        if (shown) {
+            setLocalStorageDataByFileId(this.file.id, 'show-exclude-pages', false);
+        }
+    }
 }

apps/red-ui/src/app/utils/local-storage.ts

@@ -0,0 +1,12 @@
+export function setLocalStorageDataByFileId(fileId: string, key: string, value: string | number | boolean): void {
+    let data = localStorage.getItem(key) ?? '{}';
+    data = JSON.parse(data);
+    data[fileId] = value;
+    localStorage.setItem(key, JSON.stringify(data));
+}
+
+export function getLocalStorageDataByFileId(fileId: string, key: string): string | number | boolean {
+    let data = localStorage.getItem(key) ?? '{}';
+    data = JSON.parse(data);
+    return data[fileId];
+}

libs/common-ui

@@ -1 +1 @@
-Subproject commit 7efa3b7ad2aa442e38308128eb1b4ed99f1febc0
+Subproject commit cc8d040654ab4d3bc1e8e95368a69d495bb3b9b7