From 432536184ab342c9df65242ca26d2479e611d562 Mon Sep 17 00:00:00 2001
From: Timo Bejan <timo@devplant.ro>
Date: Thu, 12 Nov 2020 18:54:54 +0200
Subject: [PATCH] added cache for files

---
 apps/red-ui/ngsw-config.json                  | 11 +++++
 .../file-preview-screen.component.html        |  5 +-
 .../file/pdf-viewer/pdf-viewer.component.ts   | 48 +++++++++++--------
 .../red-ui/src/app/state/app-state.service.ts | 29 +----------
 4 files changed, 44 insertions(+), 49 deletions(-)

diff --git a/apps/red-ui/ngsw-config.json b/apps/red-ui/ngsw-config.json
index 3e250575f..53fbcb039 100644
--- a/apps/red-ui/ngsw-config.json
+++ b/apps/red-ui/ngsw-config.json
@@ -17,5 +17,16 @@
                 "files": ["/assets/**", "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"]
             }
         }
+    ],
+    "dataGroups": [
+        {
+            "name": "file-downloads",
+            "urls": ["/download/original/**"],
+            "cacheConfig": {
+                "maxAge": "7d",
+                "maxSize": 1000,
+                "strategy": "performance"
+            }
+        }
     ]
 }
diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
index 15f89db76..e7780c0ba 100644
--- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
+++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
@@ -1,4 +1,4 @@
-<section [class.hidden]="!viewReady">
+<section>
     <div class="page-header">
         <div class="flex-1">
             <div
@@ -35,8 +35,7 @@
                 (manualAnnotationRequested)="openManualRedactionDialog($event)"
                 (pageChanged)="viewerPageChanged($event)"
                 (viewerReady)="viewerReady($event)"
-                *ngIf="fileData"
-                [fileData]="redactedView ? fileData.redactedFileData : fileData.annotatedFileData"
+                [fileData]="redactedView ? fileData?.redactedFileData : fileData?.annotatedFileData"
                 [fileStatus]="appStateService.activeFile"
             ></redaction-pdf-viewer>
         </div>
diff --git a/apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts b/apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts
index c0442132b..1c9038e85 100644
--- a/apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts
+++ b/apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts
@@ -57,19 +57,25 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
     }
 
     ngOnChanges(changes: SimpleChanges): void {
-        if (changes.fileData && !changes.fileData.firstChange) {
-            this._changeDocument();
-        }
-        if (changes.canPerformActions) {
-            this._handleCustomActions();
+        if (this.instance) {
+            if (changes.fileData) {
+                if (!this._viewerState) {
+                    this._loadDocument();
+                } else {
+                    this._changeDocument();
+                }
+            }
+            if (changes.canPerformActions) {
+                this._handleCustomActions();
+            }
         }
     }
 
     ngAfterViewInit(): void {
-        this._loadViewer(this.fileData);
+        this._loadViewer();
     }
 
-    private _loadViewer(pdfBlob: any) {
+    private _loadViewer() {
         const license = this._appConfigService.getConfig(AppConfigKey.PDFTRON_LICENSE);
         WebViewer(
             {
@@ -109,9 +115,7 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
                 }
             });
 
-            instance.loadDocument(pdfBlob, {
-                filename: this.fileStatus ? this.fileStatus.filename : 'document.pdf'
-            });
+            this._loadDocument();
         });
     }
 
@@ -179,12 +183,10 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
     }
 
     private _handleCustomActions() {
-        if (this.instance) {
-            if (this.canPerformActions) {
-                this.instance.enableElements(['add-redaction', 'add-dictionary']);
-            } else {
-                this.instance.disableElements(['add-redaction', 'add-dictionary']);
-            }
+        if (this.canPerformActions) {
+            this.instance.enableElements(['add-redaction', 'add-dictionary']);
+        } else {
+            this.instance.disableElements(['add-redaction', 'add-dictionary']);
         }
     }
 
@@ -233,6 +235,15 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
         }
     }
 
+    private _loadDocument() {
+        if (this.fileData) {
+            console.log('load');
+            this.instance.loadDocument(this.fileData, {
+                filename: this.fileStatus ? this.fileStatus.filename : 'document.pdf'
+            });
+        }
+    }
+
     private _changeDocument() {
         // sync layout and display mode
 
@@ -251,14 +262,13 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
             leftPanelState: instance.isElementOpen('leftPanel')
         };
 
-        this.instance.loadDocument(this.fileData, {
-            filename: this.fileStatus ? this.fileStatus.filename : 'document.pdf'
-        });
+        this._loadDocument();
 
         this._viewerState = viewerState;
     }
 
     private _restoreViewerState() {
+        console.log('emit');
         this.viewerReady.emit(this.instance);
         this._restoreState(this._viewerState, this.instance);
     }
diff --git a/apps/red-ui/src/app/state/app-state.service.ts b/apps/red-ui/src/app/state/app-state.service.ts
index 9c6c2d80d..e39a90c13 100644
--- a/apps/red-ui/src/app/state/app-state.service.ts
+++ b/apps/red-ui/src/app/state/app-state.service.ts
@@ -13,12 +13,11 @@ import {
 import { NotificationService, NotificationType } from '../notification/notification.service';
 import { TranslateService } from '@ngx-translate/core';
 import { Router } from '@angular/router';
-import { UserService, UserWrapper } from '../user/user.service';
-import { forkJoin, of, timer } from 'rxjs';
+import { UserService } from '../user/user.service';
+import { forkJoin, timer } from 'rxjs';
 import { tap } from 'rxjs/operators';
 import { download } from '../utils/file-download-utils';
 import { humanize } from '../utils/functions';
-import { AnnotationWrapper } from '../screens/file/model/annotation.wrapper';
 import { FileStatusWrapper } from '../screens/file/model/file-status.wrapper';
 import { ProjectWrapper } from './model/project.wrapper';
 
@@ -59,30 +58,6 @@ export class AppStateService {
             activeProject: null,
             activeFile: null
         };
-
-        timer(5000, 5000)
-            .pipe(
-                tap(() => {
-                    this.reloadActiveProjectFiles();
-                })
-            )
-            .subscribe();
-
-        timer(5000, 5000)
-            .pipe(
-                tap(() => {
-                    this.updateDictionaryVersion();
-                })
-            )
-            .subscribe();
-
-        timer(5000, 30000)
-            .pipe(
-                tap(() => {
-                    this.loadAllProjects();
-                })
-            )
-            .subscribe();
     }
 
     get dictionaryVersion() {