From a4b3bd498d536bded564e7438531d64b453cf110 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina@devplant.ro>
Date: Thu, 18 Mar 2021 23:41:10 +0200
Subject: [PATCH] Fixed enable/disable quick nav buttons

---
 .../file-preview-screen.component.html             |  2 +-
 .../file-preview-screen.component.ts               | 14 ++++++++------
 2 files changed, 9 insertions(+), 7 deletions(-)

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 d7b24a809..94f66155c 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
@@ -229,7 +229,7 @@
                     >
                         <mat-icon svgIcon="red:nav-first"></mat-icon>
                     </div>
-                    <div class="pages" (scroll)="onQuickNavScroll($event)">
+                    <div class="pages" (scroll)="computeQuickNavButtonsState()" id="pages">
                         <redaction-page-indicator
                             (pageSelected)="pageSelectedByClick($event)"
                             *ngFor="let pageNumber of displayedPages"
diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts
index 3dc825054..54111d07d 100644
--- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts
+++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts
@@ -367,12 +367,6 @@ export class FilePreviewScreenComponent implements OnInit, OnDestroy {
         }
     }
 
-    public onQuickNavScroll($event) {
-        const { scrollHeight, scrollTop, clientHeight } = $event.target;
-        this.quickScrollFirstEnabled = scrollTop !== 0;
-        this.quickScrollLastEnabled = scrollHeight !== scrollTop + clientHeight;
-    }
-
     private _scrollAnnotations() {
         if (this.firstSelectedAnnotation?.pageNumber === this.activeViewerPage) {
             return;
@@ -597,6 +591,7 @@ export class FilePreviewScreenComponent implements OnInit, OnDestroy {
     filtersChanged(filters: FilterModel[]) {
         this.displayedAnnotations = this._annotationProcessingService.filterAndGroupAnnotations(this.annotations, filters);
         this.displayedPages = Object.keys(this.displayedAnnotations).map((key) => Number(key));
+        this.computeQuickNavButtonsState();
         this._changeDetectorRef.markForCheck();
     }
 
@@ -606,6 +601,13 @@ export class FilePreviewScreenComponent implements OnInit, OnDestroy {
         }
     }
 
+    public computeQuickNavButtonsState() {
+        const element: HTMLElement = this._quickNavigationElement.nativeElement.querySelector(`#pages`);
+        const { scrollTop, scrollHeight, clientHeight } = element;
+        this.quickScrollFirstEnabled = scrollTop !== 0;
+        this.quickScrollLastEnabled = scrollHeight !== scrollTop + clientHeight;
+    }
+
     private _cleanupAndRedrawManualAnnotations() {
         this._fileDownloadService.loadActiveFileManualAnnotations().subscribe((manualRedactions) => {
             this.fileData.manualRedactions = manualRedactions;