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 78622fce5..e3b945e79 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
@@ -36,7 +36,6 @@ export class FilePreviewScreenComponent implements OnInit {
   public selectedAnnotation: Annotations.Annotation;
   public filters: AnnotationFilters;
   public expandedFilters: AnnotationFilters = { hint: false };
-  public activeViewerPage: number;
 
   constructor(
     public readonly appStateService: AppStateService,
@@ -129,9 +128,9 @@ export class FilePreviewScreenComponent implements OnInit {
   }
 
   public handleAnnotationsAdded(annotations: Annotations.Annotation[]) {
-    this._changeDetectorRef.detectChanges();
     AnnotationUtils.addAnnotations(this.annotations, annotations);
     this.applyFilters();
+    this._changeDetectorRef.detectChanges();
   }
 
   public get displayedPages(): number[] {
@@ -167,12 +166,9 @@ export class FilePreviewScreenComponent implements OnInit {
     });
   }
 
-  public viewerPageChanged(pageNumber: number) {
-    if (Number.isInteger(pageNumber)) {
-      this.activeViewerPage = this._viewerSyncService.activeViewerPage;
-      this._scrollViews();
-    }
-    this._changeDetectorRef.detectChanges();
+
+  get activeViewerPage(){
+    return this._viewerSyncService.activeViewerPage;
   }
 
   @debounce()
@@ -304,4 +300,8 @@ export class FilePreviewScreenComponent implements OnInit {
       }
     }
   }
+
+  viewerPageChanged($event: number) {
+    this._changeDetectorRef.detectChanges();
+  }
 }