From e545c147d1c23f9f44f93409d0f52458b7d932dc Mon Sep 17 00:00:00 2001
From: Dan Percic <dan@devplant.ro>
Date: Tue, 1 Feb 2022 13:39:45 +0200
Subject: [PATCH] remove file from page indicator

---
 .../file-workload.component.html              |  1 -
 .../page-indicator.component.ts               | 34 ++++++++++++-------
 2 files changed, 21 insertions(+), 14 deletions(-)

diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/file-workload/file-workload.component.html b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/file-workload/file-workload.component.html
index 4375d14c1..36978ca6f 100644
--- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/file-workload/file-workload.component.html
+++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/file-workload/file-workload.component.html
@@ -92,7 +92,6 @@
                     *ngFor="let pageNumber of displayedPages"
                     [activeSelection]="pageHasSelection(pageNumber)"
                     [active]="pageNumber === activeViewerPage"
-                    [file]="file"
                     [number]="pageNumber"
                     [showDottedIcon]="hasOnlyManualRedactionsAndIsExcluded(pageNumber)"
                 ></redaction-page-indicator>
diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/page-indicator/page-indicator.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/page-indicator/page-indicator.component.ts
index d5e3227a7..dc226a6cc 100644
--- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/page-indicator/page-indicator.component.ts
+++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/page-indicator/page-indicator.component.ts
@@ -3,7 +3,7 @@ import { PermissionsService } from '@services/permissions.service';
 import { ConfigService } from '@services/config.service';
 import { DossiersService } from '@services/entity-services/dossiers.service';
 import { ViewedPagesService } from '@services/entity-services/viewed-pages.service';
-import { File, IViewedPage } from '@red/domain';
+import { IViewedPage } from '@red/domain';
 import { AutoUnsubscribe } from '@iqser/common-ui';
 import { FilesMapService } from '@services/entity-services/files-map.service';
 import { FilePreviewStateService } from '../../services/file-preview-state.service';
@@ -16,7 +16,6 @@ import { firstValueFrom } from 'rxjs';
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class PageIndicatorComponent extends AutoUnsubscribe implements OnDestroy, OnChanges {
-    @Input() file: File;
     @Input() active = false;
     @Input() showDottedIcon = false;
     @Input() number: number;
@@ -43,17 +42,26 @@ export class PageIndicatorComponent extends AutoUnsubscribe implements OnDestroy
         return this._viewedPages.find(p => p.page === this.number);
     }
 
+    get dossierId() {
+        return this._stateService.dossierId;
+    }
+
+    get fileId() {
+        return this._stateService.fileId;
+    }
+
     private get _viewedPages(): IViewedPage[] {
         return this._stateService.fileData?.viewedPages || [];
     }
 
     ngOnChanges() {
         this._setReadState();
-        this.handlePageRead();
+        return this.handlePageRead();
     }
 
     async toggleReadState() {
-        if (this._permissionService.canMarkPagesAsViewed(this.file)) {
+        const file = await this._stateService.file;
+        if (this._permissionService.canMarkPagesAsViewed(file)) {
             if (this.read) {
                 await this._markPageUnread();
             } else {
@@ -62,8 +70,9 @@ export class PageIndicatorComponent extends AutoUnsubscribe implements OnDestroy
         }
     }
 
-    handlePageRead() {
-        if (!this._permissionService.canMarkPagesAsViewed(this.file)) {
+    async handlePageRead() {
+        const file = await this._stateService.file;
+        if (!this._permissionService.canMarkPagesAsViewed(file)) {
             return;
         }
 
@@ -81,30 +90,29 @@ export class PageIndicatorComponent extends AutoUnsubscribe implements OnDestroy
     }
 
     private _setReadState() {
-        const readBefore = this.read;
         const activePage = this.activePage;
         if (!activePage) {
             this.read = false;
         } else {
-            //   console.log('setting read to',activePage.showAsUnseen, !activePage.showAsUnseen);
             this.read = !activePage.showAsUnseen;
         }
-        // console.log(this.number, readBefore, activePage, this.read);
-        this._changeDetectorRef.detectChanges();
+        this._changeDetectorRef.markForCheck();
     }
 
     private async _markPageRead() {
-        await firstValueFrom(this._viewedPagesService.addPage({ page: this.number }, this.file.dossierId, this.file.fileId));
+        await firstValueFrom(this._viewedPagesService.addPage({ page: this.number }, this.dossierId, this.fileId));
         if (this.activePage) {
             this.activePage.showAsUnseen = false;
         } else {
-            this._viewedPages.push({ page: this.number, fileId: this.file.fileId });
+            this._viewedPages.push({ page: this.number, fileId: this.fileId });
         }
         this._setReadState();
     }
 
     private async _markPageUnread() {
-        await this._viewedPagesService.removePage(this.file.dossierId, this.file.fileId, this.number).toPromise();
+        const removePage$ = this._viewedPagesService.removePage(this.dossierId, this.fileId, this.number);
+        await firstValueFrom(removePage$);
+
         this._viewedPages.splice(
             this._viewedPages.findIndex(p => p.page === this.number),
             1,