From eda7c07247dde5e6b36562a32c47d4350721cca7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Tue, 18 Jan 2022 23:57:09 +0200 Subject: [PATCH] Fixed reload document on file data change --- .../src/app/models/file/file-data.model.ts | 4 +- .../pdf-viewer/pdf-viewer.component.ts | 41 +++++++++---------- .../services/pdf-viewer-data.service.ts | 10 ++--- 3 files changed, 27 insertions(+), 28 deletions(-) diff --git a/apps/red-ui/src/app/models/file/file-data.model.ts b/apps/red-ui/src/app/models/file/file-data.model.ts index 6e2204c29..7a073a94e 100644 --- a/apps/red-ui/src/app/models/file/file-data.model.ts +++ b/apps/red-ui/src/app/models/file/file-data.model.ts @@ -8,15 +8,17 @@ export class FileDataModel { static readonly DELTA_VIEW_TIME = 10 * 60 * 1000; // 10 minutes; allAnnotations: AnnotationWrapper[]; readonly hasChangeLog$ = new BehaviorSubject(false); + readonly blob$ = new BehaviorSubject(undefined); constructor( public file: File, - public fileData: Blob, + private readonly _blob: Blob, private _redactionLog: IRedactionLog, public viewedPages?: IViewedPage[], private _dictionaryData?: { [p: string]: Dictionary }, private _areDevFeaturesEnabled?: boolean, ) { + this.blob$.next(_blob); this._buildAllAnnotations(); } diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts index b8639aee8..2688a3d5b 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts @@ -27,7 +27,7 @@ import { AnnotationActionsService } from '../../services/annotation-actions.serv import { UserPreferenceService } from '@services/user-preference.service'; import { BASE_HREF } from '../../../../../../tokens'; import { ConfigService } from '@services/config.service'; -import { ConfirmationDialogInput, LoadingService } from '@iqser/common-ui'; +import { AutoUnsubscribe, ConfirmationDialogInput, LoadingService } from '@iqser/common-ui'; import { DossiersDialogService } from '../../../../services/dossiers-dialog.service'; import { loadCompareDocumentWrapper } from '../../../../utils/compare-mode.utils'; import { PdfViewerUtils } from '../../../../utils/pdf-viewer.utils'; @@ -37,6 +37,7 @@ import { toPosition } from '../../../../utils/pdf-calculation.utils'; import { ViewModeService } from '../../services/view-mode.service'; import { MultiSelectService } from '../../services/multi-select.service'; import { FilePreviewStateService } from '../../services/file-preview-state.service'; +import { filter, switchMap, tap } from 'rxjs/operators'; import Tools = Core.Tools; import TextTool = Tools.TextTool; import Annotation = Core.Annotations.Annotation; @@ -62,7 +63,7 @@ const dataElements = { templateUrl: './pdf-viewer.component.html', styleUrls: ['./pdf-viewer.component.scss'], }) -export class PdfViewerComponent implements OnInit, OnChanges { +export class PdfViewerComponent extends AutoUnsubscribe implements OnInit, OnChanges { @Input() file: File; @Input() dossier: Dossier; @Input() canPerformActions = false; @@ -98,7 +99,9 @@ export class PdfViewerComponent implements OnInit, OnChanges { private readonly _stateService: FilePreviewStateService, readonly viewModeService: ViewModeService, readonly multiSelectService: MultiSelectService, - ) {} + ) { + super(); + } private get _toggleTooltipsBtnTitle(): string { return this._translateService.instant(_('pdf-viewer.toggle-tooltips'), { @@ -114,13 +117,17 @@ export class PdfViewerComponent implements OnInit, OnChanges { ); } - private get _fileData(): Blob { - return this._stateService.fileData.fileData; - } - async ngOnInit() { this._setReadyAndInitialState = this._setReadyAndInitialState.bind(this); - await this.loadViewer(); + await this._loadViewer(); + + this.addActiveScreenSubscription = this._stateService.fileData$ + .pipe( + filter(fileData => !!fileData), + switchMap(fileData => fileData.blob$), + tap(() => this._loadDocument()), + ) + .subscribe(); } ngOnChanges(changes: SimpleChanges): void { @@ -128,10 +135,6 @@ export class PdfViewerComponent implements OnInit, OnChanges { return; } - if (changes.fileData) { - this._loadDocument(); - } - if (changes.canPerformActions) { this._handleCustomActions(); } @@ -153,7 +156,7 @@ export class PdfViewerComponent implements OnInit, OnChanges { await pdfNet.initialize(environment.licenseKey ? atob(environment.licenseKey) : null); const compareDocument = await pdfNet.PDFDoc.createFromBuffer(fileReader.result as ArrayBuffer); - const currentDocument = await pdfNet.PDFDoc.createFromBuffer(await this._fileData.arrayBuffer()); + const currentDocument = await pdfNet.PDFDoc.createFromBuffer(await this._stateService.fileData.blob$.value.arrayBuffer()); const loadCompareDocument = async () => { this._loadingService.start(); @@ -206,7 +209,7 @@ export class PdfViewerComponent implements OnInit, OnChanges { this.viewModeService.compareMode = false; const pdfNet = this.instance.Core.PDFNet; await pdfNet.initialize(environment.licenseKey ? atob(environment.licenseKey) : null); - const currentDocument = await pdfNet.PDFDoc.createFromBuffer(await this._fileData.arrayBuffer()); + const currentDocument = await pdfNet.PDFDoc.createFromBuffer(await this._stateService.fileData.blob$.value.arrayBuffer()); this.instance.UI.loadDocument(currentDocument, { filename: this.file ? this.file.filename : 'document.pdf', }); @@ -215,7 +218,7 @@ export class PdfViewerComponent implements OnInit, OnChanges { this.utils.navigateToPage(1); } - async loadViewer() { + private async _loadViewer() { this.instance = await WebViewer( { licenseKey: environment.licenseKey ? atob(environment.licenseKey) : null, @@ -306,8 +309,6 @@ export class PdfViewerComponent implements OnInit, OnChanges { } } }); - - this._loadDocument(); } private _setInitialDisplayMode() { @@ -639,11 +640,7 @@ export class PdfViewerComponent implements OnInit, OnChanges { } private _loadDocument() { - if (!this._fileData) { - return; - } - - this.instance.UI.loadDocument(this._fileData, { + this.instance.UI.loadDocument(this._stateService.fileData.blob$.value, { filename: this.file ? this.file.filename : 'document.pdf', }); } diff --git a/apps/red-ui/src/app/modules/dossier/services/pdf-viewer-data.service.ts b/apps/red-ui/src/app/modules/dossier/services/pdf-viewer-data.service.ts index 6625f138f..591962afb 100644 --- a/apps/red-ui/src/app/modules/dossier/services/pdf-viewer-data.service.ts +++ b/apps/red-ui/src/app/modules/dossier/services/pdf-viewer-data.service.ts @@ -3,7 +3,7 @@ import { forkJoin, Observable, of } from 'rxjs'; import { catchError, map, tap } from 'rxjs/operators'; import { FileDataModel } from '@models/file/file-data.model'; import { PermissionsService } from '@services/permissions.service'; -import { File } from '@red/domain'; +import { File, IRedactionLog, IViewedPage } from '@red/domain'; import { FileManagementService } from '@services/entity-services/file-management.service'; import { RedactionLogService } from './redaction-log.service'; import { ViewedPagesService } from '@services/entity-services/viewed-pages.service'; @@ -31,15 +31,15 @@ export class PdfViewerDataService { } loadDataFor(file: File, fileData?: FileDataModel): Observable { - const file$ = fileData?.file.cacheIdentifier === file.cacheIdentifier ? of(fileData.fileData) : this.downloadOriginalFile(file); - const reactionLog$ = this.loadRedactionLogFor(file.dossierId, file.fileId); + const blob$ = fileData?.file.cacheIdentifier === file.cacheIdentifier ? fileData.blob$ : this.downloadOriginalFile(file); + const redactionLog$ = this.loadRedactionLogFor(file.dossierId, file.fileId); const viewedPages$ = this.getViewedPagesFor(file); const dossier = this._dossiersService.find(file.dossierId); - return forkJoin([file$, reactionLog$, viewedPages$]).pipe( + return forkJoin([blob$, redactionLog$, viewedPages$]).pipe( map( - data => + (data: [blob: Blob, redactionLog: IRedactionLog, viewedPages: IViewedPage[]]) => new FileDataModel( file, ...data,