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 95bae11fc..01570fd13 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 @@ -149,6 +149,4 @@ - - 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 3566c48a7..9ea60c614 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 @@ -1,5 +1,5 @@ -import {ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild} from '@angular/core'; -import {ActivatedRoute, Router} from '@angular/router'; +import { ChangeDetectorRef, Component, ElementRef, NgZone, OnInit, ViewChild } from '@angular/core'; +import { ActivatedRoute, Router } from '@angular/router'; import { AddRedactionRequest, FileUploadControllerService, @@ -8,25 +8,25 @@ import { ProjectControllerService, StatusControllerService } from '@redaction/red-ui-http'; -import {TranslateService} from '@ngx-translate/core'; +import { TranslateService } from '@ngx-translate/core'; import {NotificationService, NotificationType} from '../../../notification/notification.service'; -import {MatDialog} from '@angular/material/dialog'; -import {AppStateService} from '../../../state/app-state.service'; -import {FileDetailsDialogComponent} from './file-details-dialog/file-details-dialog.component'; -import {ViewerSyncService} from '../service/viewer-sync.service'; -import {Annotations} from '@pdftron/webviewer'; -import {PdfViewerComponent} from '../pdf-viewer/pdf-viewer.component'; -import {AnnotationUtils} from '../../../utils/annotation-utils'; -import {ManualRedactionDialogComponent} from '../manual-redaction-dialog/manual-redaction-dialog.component'; -import {UserService} from '../../../user/user.service'; -import {debounce} from '../../../utils/debounce'; +import { MatDialog } from '@angular/material/dialog'; +import { AppStateService } from '../../../state/app-state.service'; +import { FileDetailsDialogComponent } from './file-details-dialog/file-details-dialog.component'; +import { ViewerSyncService } from '../service/viewer-sync.service'; +import { Annotations } from '@pdftron/webviewer'; +import { PdfViewerComponent } from '../pdf-viewer/pdf-viewer.component'; +import { AnnotationUtils } from '../../../utils/annotation-utils'; +import { ManualRedactionDialogComponent } from '../manual-redaction-dialog/manual-redaction-dialog.component'; +import { UserService } from '../../../user/user.service'; +import { debounce } from '../../../utils/debounce'; import scrollIntoView from 'scroll-into-view-if-needed'; -import {AnnotationFilters} from '../../../utils/types'; -import {FiltersService} from '../service/filters.service'; -import {FileDownloadService} from '../service/file-download.service'; -import {saveAs} from 'file-saver'; -import {FileType} from '../model/file-type'; -import {ConfirmationDialogComponent} from '../../../common/confirmation-dialog/confirmation-dialog.component'; +import { AnnotationFilters } from '../../../utils/types'; +import { FiltersService } from '../service/filters.service'; +import { FileDownloadService } from '../service/file-download.service'; +import { saveAs } from 'file-saver'; +import { FileType } from '../model/file-type'; +import { ConfirmationDialogComponent } from '../../../common/confirmation-dialog/confirmation-dialog.component'; @Component({ selector: 'redaction-file-preview-screen', @@ -37,7 +37,6 @@ export class FilePreviewScreenComponent implements OnInit { private _readyViewers: string[] = []; private projectId: string; private _activeViewer: 'ANNOTATED' | 'REDACTED' = 'ANNOTATED'; - private _manualRedactionEntry: AddRedactionRequest; @ViewChild(PdfViewerComponent) private _viewerComponent: PdfViewerComponent; @ViewChild('annotations') private _annotationsElement: ElementRef; @@ -48,7 +47,7 @@ export class FilePreviewScreenComponent implements OnInit { public displayedAnnotations: { [key: number]: { annotations: Annotations.Annotation[] } } = {}; public selectedAnnotation: Annotations.Annotation; public filters: AnnotationFilters; - public expandedFilters: AnnotationFilters = {hint: false}; + public expandedFilters: AnnotationFilters = { hint: false }; public activeViewerPage: number; constructor( @@ -66,7 +65,8 @@ export class FilePreviewScreenComponent implements OnInit { private readonly _fileDownloadService: FileDownloadService, private readonly _fileUploadControllerService: FileUploadControllerService, private readonly _projectControllerService: ProjectControllerService, - private readonly _filtersService: FiltersService) { + private readonly _filtersService: FiltersService, + private ngZone: NgZone) { this._activatedRoute.params.subscribe(params => { this.projectId = params.projectId; this.fileId = params.fileId; @@ -166,19 +166,12 @@ export class FilePreviewScreenComponent implements OnInit { } handleManualAnnotationRequest($event: ManualRedactionEntry) { - this._manualRedactionEntry = $event; - document.getElementById('open-manual-redaction-dialog-btn').click(); - } - - openManualRedactionDialog() { - const ref = this._dialog.open(ManualRedactionDialogComponent, { - width: '600px', - maxWidth: '90vw', - data: this._manualRedactionEntry - }); - - ref.afterClosed().subscribe(() => { - this._manualRedactionEntry = null; + this.ngZone.run(() => { + this._dialog.open(ManualRedactionDialogComponent, { + width: '600px', + maxWidth: '90vw', + data: $event + }); }); } @@ -230,44 +223,49 @@ export class FilePreviewScreenComponent implements OnInit { acceptSuggestionAnnotation($event: MouseEvent, annotation: Annotations.Annotation) { $event.stopPropagation(); - const dialogRef = this._dialog.open(ConfirmationDialogComponent, { - width: '400px', - maxWidth: '90vw' - }); + this.ngZone.run(() => { + const dialogRef = this._dialog.open(ConfirmationDialogComponent, { + width: '400px', + maxWidth: '90vw' + }); - const parts = annotation.Id.split(':'); - const annotationId = parts[parts.length - 1]; + const parts = annotation.Id.split(':'); + const annotationId = parts[parts.length - 1]; - dialogRef.afterClosed().subscribe(result => { - if (result) { - this._manualRedactionControllerService.approveRequest(this.appStateService.activeProjectId, this.appStateService.activeFile.fileId, annotationId).subscribe(ok => { - this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.confirm-annotation.success.label'), null, NotificationType.SUCCESS); - }, (err) => { - this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.confirm-annotation.failed.label', err), null, NotificationType.ERROR); - }); - } + dialogRef.afterClosed().subscribe(result => { + if (result) { + this._manualRedactionControllerService.approveRequest(this.appStateService.activeProjectId, this.appStateService.activeFile.fileId, annotationId).subscribe(ok => { + this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.confirm-annotation.success.label'), null, NotificationType.SUCCESS); + }, (err) => { + this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.confirm-annotation.failed.label', err), null, NotificationType.ERROR); + }); + } + }); }); } suggestRemoveAnnotation($event: MouseEvent, annotation: Annotations.Annotation) { $event.stopPropagation(); - const dialogRef = this._dialog.open(ConfirmationDialogComponent, { - width: '400px', - maxWidth: '90vw' + this.ngZone.run(() => { + const dialogRef = this._dialog.open(ConfirmationDialogComponent, { + width: '400px', + maxWidth: '90vw' + }); + + const parts = annotation.Id.split(':'); + const annotationId = parts[parts.length - 1]; + + dialogRef.afterClosed().subscribe(result => { + if (result) { + this._manualRedactionControllerService.undo(this.appStateService.activeProjectId, this.appStateService.activeFile.fileId, annotationId).subscribe(ok => { + this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.success.label'), null, NotificationType.SUCCESS); + }, (err) => { + this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.failed.label', err), null, NotificationType.ERROR); + }); + } + }); }); - const parts = annotation.Id.split(':'); - const annotationId = parts[parts.length - 1]; - - dialogRef.afterClosed().subscribe(result => { - if (result) { - this._manualRedactionControllerService.undo(this.appStateService.activeProjectId, this.appStateService.activeFile.fileId, annotationId).subscribe(ok => { - this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.success.label'), null, NotificationType.SUCCESS); - }, (err) => { - this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.failed.label', err), null, NotificationType.ERROR); - }); - } - }); } public downloadFile(type: FileType | string) {