From 8716739b5220d3481fa58e8705c0db905dba0705 Mon Sep 17 00:00:00 2001 From: Valentin Mihai Date: Wed, 13 Jul 2022 21:11:30 +0300 Subject: [PATCH 1/5] RED-3687 - WIP on removing subscriptions --- .../comments/comments.component.html | 63 +++++----- .../components/comments/comments.component.ts | 11 +- .../file-preview-screen.component.html | 20 +-- .../file-preview-screen.component.ts | 119 +++++++++--------- .../services/manual-redaction.service.ts | 2 +- .../red-ui/src/app/utils/context.component.ts | 41 ++++++ 6 files changed, 150 insertions(+), 106 deletions(-) create mode 100644 apps/red-ui/src/app/utils/context.component.ts diff --git a/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.html b/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.html index 764e2454f..37411ebe8 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.html +++ b/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.html @@ -1,39 +1,34 @@ - - -
-
-
- {{ comment.user | name }} - {{ comment.date | date: 'sophisticatedDate' }} -
- -
- -
+ +
+
+
+ {{ comment.user | name }} + {{ comment.date | date: 'sophisticatedDate' }}
-
{{ comment.text }}
+
+ +
- - +
{{ comment.text }}
+
+ + + +
- -
- - - diff --git a/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts b/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts index 214246329..f0eab09e1 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts +++ b/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts @@ -1,14 +1,15 @@ -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, HostBinding, Input, OnChanges, ViewChild } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, HostBinding, Input, OnInit, ViewChild } from '@angular/core'; import { Dossier, File, IComment } from '@red/domain'; import { AnnotationWrapper } from '@models/file/annotation.wrapper'; import { UserService } from '@services/user.service'; import { PermissionsService } from '@services/permissions.service'; -import { AutoUnsubscribe, InputWithActionComponent, LoadingService, trackByFactory } from '@iqser/common-ui'; +import { InputWithActionComponent, LoadingService, trackByFactory } from '@iqser/common-ui'; import { firstValueFrom, Observable } from 'rxjs'; import { CommentingService } from '../../services/commenting.service'; import { tap } from 'rxjs/operators'; import { FilePreviewStateService } from '../../services/file-preview-state.service'; import { ManualRedactionService } from '../../services/manual-redaction.service'; +import { ContextComponent } from '@utils/context.component'; @Component({ selector: 'redaction-comments', @@ -16,7 +17,7 @@ import { ManualRedactionService } from '../../services/manual-redaction.service' styleUrls: ['./comments.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush, }) -export class CommentsComponent extends AutoUnsubscribe implements OnChanges { +export class CommentsComponent extends ContextComponent implements OnInit { @Input() annotation: AnnotationWrapper; readonly trackBy = trackByFactory(); readonly file$: Observable; @@ -39,12 +40,14 @@ export class CommentsComponent extends AutoUnsubscribe implements OnChanges { this.dossier$ = _stateService.dossier$; } - ngOnChanges() { + ngOnInit() { this.hiddenComments$ = this._commentingService.isActive$(this.annotation.id).pipe( tap(active => { this._hidden = !active; }), ); + + super._initContext([{ file: this.file$ }, { dossier: this.dossier$ }, this.hiddenComments$]); } async addComment(value: string): Promise { diff --git a/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html b/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html index 19f0302e7..31f5076ab 100644 --- a/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html +++ b/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html @@ -1,22 +1,22 @@ - -
+ +
- + - +
- {{ 'file-preview.last-assignee' | translate: { status: file.workflowStatus } }} + {{ 'file-preview.last-assignee' | translate: { status: ctx.file.workflowStatus } }}
@@ -24,8 +24,8 @@
@@ -40,7 +40,7 @@ this._fileDataService.loadAnnotations(file))); + readonly circleButtonTypes = CircleButtonTypes; + + fullScreen = false; @ViewChild('annotationFilterTemplate', { read: TemplateRef, static: false, @@ -192,7 +191,6 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni ngOnDetach() { this._viewerHeaderService.resetCompareButtons(); - super.ngOnDetach(); this._changeRef.markForCheck(); } @@ -219,7 +217,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni this._loadingService.start(); await this.userPreferenceService.saveLastOpenedFileForDossier(this.dossierId, this.fileId); - this._subscribeToFileUpdates(); + this._initContext(); if (file?.analysisRequired && !file.excludedFromAutomaticAnalysis) { const reanalysisService = this._injector.get(ReanalysisService); @@ -487,59 +485,66 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni }, 100); } - private _subscribeToFileUpdates(): void { - this.addActiveScreenSubscription = this.loadAnnotations().subscribe(); + protected _initContext(): void { + const loadAnnotations$ = this.loadAnnotations(); - this.addActiveScreenSubscription = this._dossiersService - .getEntityDeleted$(this.dossierId) - .pipe(tap(() => this._handleDeletedDossier())) - .subscribe(); + const handleDeletedDossier$ = this._dossiersService.getEntityDeleted$(this.dossierId).pipe(tap(() => this._handleDeletedDossier())); - this.addActiveScreenSubscription = this._filesMapService - .watchDeleted$(this.fileId) - .pipe(tap(() => this._handleDeletedFile())) - .subscribe(); + const watchDeleted$ = this._filesMapService.watchDeleted$(this.fileId).pipe(tap(() => this._handleDeletedFile())); - this.addActiveScreenSubscription = combineLatest([this._viewModeService.viewMode$, this.state.file$]) - .pipe( - tap(([viewMode, file]) => { - if (viewMode === ViewModes.TEXT_HIGHLIGHTS && !file.hasHighlights) { - this._viewModeService.switchToStandard(); - } - }), - ) - .subscribe(); - - this.addActiveScreenSubscription = this._documentViewer.pageComplete$.subscribe(() => { - this._setExcludedPageStyles(); - }); - - this.addActiveScreenSubscription = this._documentViewer.keyUp$.subscribe($event => { - this.handleKeyEvent($event); - }); - - this.addActiveScreenSubscription = this.#textSelected$.subscribe(); - this.addActiveScreenSubscription = this.state.dossierFileChange$.subscribe(); - - this.addActiveScreenSubscription = this.state.blob$ - .pipe( - switchMap(blob => from(this._documentViewer.lock()).pipe(map(() => blob))), - tap(() => this._errorService.clear()), - tap(blob => this.pdf.loadDocument(blob, this.state.file, () => this.state.reloadBlob())), - ) - .subscribe(); - - this.addActiveScreenSubscription = this.pdfProxyService.manualAnnotationRequested$.subscribe($event => { - this.openManualAnnotationDialog($event); - }); - - this.addActiveScreenSubscription = this.pdfProxyService.pageChanged$.subscribe(page => - this._ngZone.run(() => { - console.log('viewerPageChanged', page); - return this.#updateQueryParamsPage(page); + const switchToStandard$ = combineLatest([this._viewModeService.viewMode$, this.state.file$]).pipe( + tap(([viewMode, file]) => { + if (viewMode === ViewModes.TEXT_HIGHLIGHTS && !file.hasHighlights) { + this._viewModeService.switchToStandard(); + } }), ); - this.addActiveScreenSubscription = this.pdfProxyService.annotationSelected$.subscribe(); + + const excludedPageStyles$ = this._documentViewer.pageComplete$.pipe(tap(() => this._setExcludedPageStyles())); + + const handleKeyEvent$ = this._documentViewer.keyUp$.pipe(tap($event => this.handleKeyEvent($event))); + + const textSelected$ = this.#textSelected$; + + const blobLoadDocument$ = this.state.blob$.pipe( + switchMap(blob => from(this._documentViewer.lock()).pipe(map(() => blob))), + tap(() => this._errorService.clear()), + tap(blob => this.pdf.loadDocument(blob, this.state.file, () => this.state.reloadBlob())), + ); + + const openManualAnnotationDialog$ = this.pdfProxyService.manualAnnotationRequested$.pipe( + tap($event => { + this.openManualAnnotationDialog($event); + }), + ); + + const updateQueryParamsPage$ = this.pdfProxyService.pageChanged$.pipe( + tap(page => { + this._ngZone.run(() => { + console.log('viewerPageChanged', page); + return this.#updateQueryParamsPage(page); + }); + }), + ); + + super._initContext([ + { dossier: this.state.dossier$ }, + { file: this.file$ }, + this.pdf.currentPage$, + this.pdfProxyService.canPerformAnnotationActions$, + this.state.dossierFileChange$, + this.pdfProxyService.annotationSelected$, + loadAnnotations$, + handleDeletedDossier$, + watchDeleted$, + switchToStandard$, + excludedPageStyles$, + handleKeyEvent$, + textSelected$, + blobLoadDocument$, + openManualAnnotationDialog$, + updateQueryParamsPage$, + ]); } private _handleDeletedDossier(): void { diff --git a/apps/red-ui/src/app/modules/file-preview/services/manual-redaction.service.ts b/apps/red-ui/src/app/modules/file-preview/services/manual-redaction.service.ts index 051596419..129aeadef 100644 --- a/apps/red-ui/src/app/modules/file-preview/services/manual-redaction.service.ts +++ b/apps/red-ui/src/app/modules/file-preview/services/manual-redaction.service.ts @@ -136,7 +136,7 @@ export class ManualRedactionService extends GenericService { } getTitle(type: ManualRedactionEntryType, dossier: Dossier) { - if (this._permissionsService.isApprover(dossier)) { + if (dossier && this._permissionsService.isApprover(dossier)) { switch (type) { case 'DICTIONARY': return _('manual-annotation.dialog.header.dictionary'); diff --git a/apps/red-ui/src/app/utils/context.component.ts b/apps/red-ui/src/app/utils/context.component.ts new file mode 100644 index 000000000..b11f2a0e3 --- /dev/null +++ b/apps/red-ui/src/app/utils/context.component.ts @@ -0,0 +1,41 @@ +import { combineLatest, Observable, of } from 'rxjs'; +import { map, startWith } from 'rxjs/operators'; + +type ContextObservable = Observable | { [key: string]: Observable }; + +export class ContextComponent { + componentContext$: Observable = of({}); + + #templateContextKeys = {}; + #observables = []; + + protected _initContext(observables: ContextObservable[]) { + this.#extractKeysAndObservables(observables); + this.componentContext$ = combineLatest(this.#observables).pipe(map(values => this.#mapContext(values))); + } + + #extractKeysAndObservables(observables: ContextObservable[]) { + observables.forEach((value, index) => { + const keys = Object.keys(value); + let observable: any; + if (keys.length === 1) { + this.#templateContextKeys[index] = keys[0]; + observable = value[keys[0]]; + } else { + observable = value; + } + this.#observables.push(observable.pipe(startWith(null))); + }); + } + + #mapContext(values: Array) { + const context = {}; + + values.forEach((value, index) => { + const key = this.#templateContextKeys[index]; + context[key ? key : index] = value; + }); + + return context; + } +} From 3408655c8223aafdc5fa63c28c2c01339c4f4186 Mon Sep 17 00:00:00 2001 From: Valentin Mihai Date: Fri, 15 Jul 2022 15:26:38 +0300 Subject: [PATCH 2/5] RED-3687 - undone changes for file preview component --- .../components/comments/comments.component.ts | 13 +- .../file-preview-screen.component.html | 20 +-- .../file-preview-screen.component.ts | 119 +++++++++--------- .../services/manual-redaction.service.ts | 2 +- .../red-ui/src/app/utils/context.component.ts | 44 ++----- 5 files changed, 91 insertions(+), 107 deletions(-) diff --git a/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts b/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts index f0eab09e1..c8d9027b7 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts +++ b/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts @@ -11,13 +11,18 @@ import { FilePreviewStateService } from '../../services/file-preview-state.servi import { ManualRedactionService } from '../../services/manual-redaction.service'; import { ContextComponent } from '@utils/context.component'; +interface CommentsTemplate { + dossier: Dossier; + file: File; +} + @Component({ selector: 'redaction-comments', templateUrl: './comments.component.html', styleUrls: ['./comments.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush, }) -export class CommentsComponent extends ContextComponent implements OnInit { +export class CommentsComponent extends ContextComponent implements OnInit { @Input() annotation: AnnotationWrapper; readonly trackBy = trackByFactory(); readonly file$: Observable; @@ -47,7 +52,11 @@ export class CommentsComponent extends ContextComponent implements OnInit { }), ); - super._initContext([{ file: this.file$ }, { dossier: this.dossier$ }, this.hiddenComments$]); + super._initContext({ + file: this.file$, + dossier: this.dossier$, + hiddenComments: this.hiddenComments$, + }); } async addComment(value: string): Promise { diff --git a/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html b/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html index 31f5076ab..19f0302e7 100644 --- a/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html +++ b/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html @@ -1,22 +1,22 @@ - -
+ +
- + - +
- {{ 'file-preview.last-assignee' | translate: { status: ctx.file.workflowStatus } }} + {{ 'file-preview.last-assignee' | translate: { status: file.workflowStatus } }}
@@ -24,8 +24,8 @@
@@ -40,7 +40,7 @@ this._fileDataService.loadAnnotations(file))); +export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnInit, OnDestroy, OnAttach, OnDetach, ComponentCanDeactivate { readonly circleButtonTypes = CircleButtonTypes; fullScreen = false; + readonly fileId = this.state.fileId; + readonly dossierId = this.state.dossierId; + readonly file$ = this.state.file$.pipe(tap(file => this._fileDataService.loadAnnotations(file))); @ViewChild('annotationFilterTemplate', { read: TemplateRef, static: false, @@ -191,6 +192,7 @@ export class FilePreviewScreenComponent extends ContextComponent implements OnIn ngOnDetach() { this._viewerHeaderService.resetCompareButtons(); + super.ngOnDetach(); this._changeRef.markForCheck(); } @@ -217,7 +219,7 @@ export class FilePreviewScreenComponent extends ContextComponent implements OnIn this._loadingService.start(); await this.userPreferenceService.saveLastOpenedFileForDossier(this.dossierId, this.fileId); - this._initContext(); + this._subscribeToFileUpdates(); if (file?.analysisRequired && !file.excludedFromAutomaticAnalysis) { const reanalysisService = this._injector.get(ReanalysisService); @@ -485,66 +487,59 @@ export class FilePreviewScreenComponent extends ContextComponent implements OnIn }, 100); } - protected _initContext(): void { - const loadAnnotations$ = this.loadAnnotations(); + private _subscribeToFileUpdates(): void { + this.addActiveScreenSubscription = this.loadAnnotations().subscribe(); - const handleDeletedDossier$ = this._dossiersService.getEntityDeleted$(this.dossierId).pipe(tap(() => this._handleDeletedDossier())); + this.addActiveScreenSubscription = this._dossiersService + .getEntityDeleted$(this.dossierId) + .pipe(tap(() => this._handleDeletedDossier())) + .subscribe(); - const watchDeleted$ = this._filesMapService.watchDeleted$(this.fileId).pipe(tap(() => this._handleDeletedFile())); + this.addActiveScreenSubscription = this._filesMapService + .watchDeleted$(this.fileId) + .pipe(tap(() => this._handleDeletedFile())) + .subscribe(); - const switchToStandard$ = combineLatest([this._viewModeService.viewMode$, this.state.file$]).pipe( - tap(([viewMode, file]) => { - if (viewMode === ViewModes.TEXT_HIGHLIGHTS && !file.hasHighlights) { - this._viewModeService.switchToStandard(); - } + this.addActiveScreenSubscription = combineLatest([this._viewModeService.viewMode$, this.state.file$]) + .pipe( + tap(([viewMode, file]) => { + if (viewMode === ViewModes.TEXT_HIGHLIGHTS && !file.hasHighlights) { + this._viewModeService.switchToStandard(); + } + }), + ) + .subscribe(); + + this.addActiveScreenSubscription = this._documentViewer.pageComplete$.subscribe(() => { + this._setExcludedPageStyles(); + }); + + this.addActiveScreenSubscription = this._documentViewer.keyUp$.subscribe($event => { + this.handleKeyEvent($event); + }); + + this.addActiveScreenSubscription = this.#textSelected$.subscribe(); + this.addActiveScreenSubscription = this.state.dossierFileChange$.subscribe(); + + this.addActiveScreenSubscription = this.state.blob$ + .pipe( + switchMap(blob => from(this._documentViewer.lock()).pipe(map(() => blob))), + tap(() => this._errorService.clear()), + tap(blob => this.pdf.loadDocument(blob, this.state.file, () => this.state.reloadBlob())), + ) + .subscribe(); + + this.addActiveScreenSubscription = this.pdfProxyService.manualAnnotationRequested$.subscribe($event => { + this.openManualAnnotationDialog($event); + }); + + this.addActiveScreenSubscription = this.pdfProxyService.pageChanged$.subscribe(page => + this._ngZone.run(() => { + console.log('viewerPageChanged', page); + return this.#updateQueryParamsPage(page); }), ); - - const excludedPageStyles$ = this._documentViewer.pageComplete$.pipe(tap(() => this._setExcludedPageStyles())); - - const handleKeyEvent$ = this._documentViewer.keyUp$.pipe(tap($event => this.handleKeyEvent($event))); - - const textSelected$ = this.#textSelected$; - - const blobLoadDocument$ = this.state.blob$.pipe( - switchMap(blob => from(this._documentViewer.lock()).pipe(map(() => blob))), - tap(() => this._errorService.clear()), - tap(blob => this.pdf.loadDocument(blob, this.state.file, () => this.state.reloadBlob())), - ); - - const openManualAnnotationDialog$ = this.pdfProxyService.manualAnnotationRequested$.pipe( - tap($event => { - this.openManualAnnotationDialog($event); - }), - ); - - const updateQueryParamsPage$ = this.pdfProxyService.pageChanged$.pipe( - tap(page => { - this._ngZone.run(() => { - console.log('viewerPageChanged', page); - return this.#updateQueryParamsPage(page); - }); - }), - ); - - super._initContext([ - { dossier: this.state.dossier$ }, - { file: this.file$ }, - this.pdf.currentPage$, - this.pdfProxyService.canPerformAnnotationActions$, - this.state.dossierFileChange$, - this.pdfProxyService.annotationSelected$, - loadAnnotations$, - handleDeletedDossier$, - watchDeleted$, - switchToStandard$, - excludedPageStyles$, - handleKeyEvent$, - textSelected$, - blobLoadDocument$, - openManualAnnotationDialog$, - updateQueryParamsPage$, - ]); + this.addActiveScreenSubscription = this.pdfProxyService.annotationSelected$.subscribe(); } private _handleDeletedDossier(): void { diff --git a/apps/red-ui/src/app/modules/file-preview/services/manual-redaction.service.ts b/apps/red-ui/src/app/modules/file-preview/services/manual-redaction.service.ts index 129aeadef..051596419 100644 --- a/apps/red-ui/src/app/modules/file-preview/services/manual-redaction.service.ts +++ b/apps/red-ui/src/app/modules/file-preview/services/manual-redaction.service.ts @@ -136,7 +136,7 @@ export class ManualRedactionService extends GenericService { } getTitle(type: ManualRedactionEntryType, dossier: Dossier) { - if (dossier && this._permissionsService.isApprover(dossier)) { + if (this._permissionsService.isApprover(dossier)) { switch (type) { case 'DICTIONARY': return _('manual-annotation.dialog.header.dictionary'); diff --git a/apps/red-ui/src/app/utils/context.component.ts b/apps/red-ui/src/app/utils/context.component.ts index b11f2a0e3..a7b7b621b 100644 --- a/apps/red-ui/src/app/utils/context.component.ts +++ b/apps/red-ui/src/app/utils/context.component.ts @@ -1,41 +1,21 @@ -import { combineLatest, Observable, of } from 'rxjs'; +import { combineLatest, Observable, ObservableInputTuple, of, pipe } from 'rxjs'; import { map, startWith } from 'rxjs/operators'; +import { OnDetach, ValuesOf } from '@iqser/common-ui'; -type ContextObservable = Observable | { [key: string]: Observable }; +export class ContextComponent implements OnDetach { + componentContext$: Observable | null = of({} as C); -export class ContextComponent { - componentContext$: Observable = of({}); - - #templateContextKeys = {}; - #observables = []; - - protected _initContext(observables: ContextObservable[]) { - this.#extractKeysAndObservables(observables); - this.componentContext$ = combineLatest(this.#observables).pipe(map(values => this.#mapContext(values))); + protected _initContext>>(context: ObservableInputTuple): void { + const observables = Object.values(context).map(obs => obs.pipe(startWith(null))); + const keys = Object.keys(context); + this.componentContext$ = combineLatest(observables).pipe(map(values => this._mapKeysToObs(keys, values))); } - #extractKeysAndObservables(observables: ContextObservable[]) { - observables.forEach((value, index) => { - const keys = Object.keys(value); - let observable: any; - if (keys.length === 1) { - this.#templateContextKeys[index] = keys[0]; - observable = value[keys[0]]; - } else { - observable = value; - } - this.#observables.push(observable.pipe(startWith(null))); - }); + protected _mapKeysToObs(keys: string[], observables: Observable[]): T { + return keys.reduce((acc, key, index) => ({ ...acc, [key]: observables[index] }), {} as T); } - #mapContext(values: Array) { - const context = {}; - - values.forEach((value, index) => { - const key = this.#templateContextKeys[index]; - context[key ? key : index] = value; - }); - - return context; + ngOnDetach() { + this.componentContext$ = null; } } From 72cf70efbd9d3f42bdd6cdc24e6e47f4c73c4469 Mon Sep 17 00:00:00 2001 From: Valentin Mihai Date: Fri, 15 Jul 2022 15:27:05 +0300 Subject: [PATCH 3/5] RED-3687 - removed on detach --- apps/red-ui/src/app/utils/context.component.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/apps/red-ui/src/app/utils/context.component.ts b/apps/red-ui/src/app/utils/context.component.ts index a7b7b621b..1ad9d7765 100644 --- a/apps/red-ui/src/app/utils/context.component.ts +++ b/apps/red-ui/src/app/utils/context.component.ts @@ -14,8 +14,4 @@ export class ContextComponent implements OnDetach { protected _mapKeysToObs(keys: string[], observables: Observable[]): T { return keys.reduce((acc, key, index) => ({ ...acc, [key]: observables[index] }), {} as T); } - - ngOnDetach() { - this.componentContext$ = null; - } } From 6864edb489999b1b3db1c57ca22dc8763d2b7320 Mon Sep 17 00:00:00 2001 From: Valentin Mihai Date: Fri, 15 Jul 2022 15:32:55 +0300 Subject: [PATCH 4/5] RED-3687 - removed on detach --- apps/red-ui/src/app/utils/context.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/red-ui/src/app/utils/context.component.ts b/apps/red-ui/src/app/utils/context.component.ts index 1ad9d7765..88a67e860 100644 --- a/apps/red-ui/src/app/utils/context.component.ts +++ b/apps/red-ui/src/app/utils/context.component.ts @@ -2,7 +2,7 @@ import { combineLatest, Observable, ObservableInputTuple, of, pipe } from 'rxjs' import { map, startWith } from 'rxjs/operators'; import { OnDetach, ValuesOf } from '@iqser/common-ui'; -export class ContextComponent implements OnDetach { +export class ContextComponent { componentContext$: Observable | null = of({} as C); protected _initContext>>(context: ObservableInputTuple): void { From 7d899d7f2f29dc7ce0f8217d5e9227fb6ce4ab71 Mon Sep 17 00:00:00 2001 From: Valentin Mihai Date: Tue, 19 Jul 2022 14:06:01 +0300 Subject: [PATCH 5/5] RED-3687 - removed generic param on init context --- .../components/comments/comments.component.ts | 1 + apps/red-ui/src/app/utils/context.component.ts | 12 ++++++------ 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts b/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts index c8d9027b7..c239b296d 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts +++ b/apps/red-ui/src/app/modules/file-preview/components/comments/comments.component.ts @@ -14,6 +14,7 @@ import { ContextComponent } from '@utils/context.component'; interface CommentsTemplate { dossier: Dossier; file: File; + hiddenComments: boolean; } @Component({ diff --git a/apps/red-ui/src/app/utils/context.component.ts b/apps/red-ui/src/app/utils/context.component.ts index 88a67e860..4adf56774 100644 --- a/apps/red-ui/src/app/utils/context.component.ts +++ b/apps/red-ui/src/app/utils/context.component.ts @@ -1,17 +1,17 @@ -import { combineLatest, Observable, ObservableInputTuple, of, pipe } from 'rxjs'; +import { combineLatest, Observable, of } from 'rxjs'; import { map, startWith } from 'rxjs/operators'; -import { OnDetach, ValuesOf } from '@iqser/common-ui'; +import { ValuesOf } from '@iqser/common-ui'; -export class ContextComponent { - componentContext$: Observable | null = of({} as C); +export class ContextComponent { + componentContext$: Observable | null = of({} as T); - protected _initContext>>(context: ObservableInputTuple): void { + protected _initContext(context: Record>>): void { const observables = Object.values(context).map(obs => obs.pipe(startWith(null))); const keys = Object.keys(context); this.componentContext$ = combineLatest(observables).pipe(map(values => this._mapKeysToObs(keys, values))); } - protected _mapKeysToObs(keys: string[], observables: Observable[]): T { + protected _mapKeysToObs(keys: string[], observables: ValuesOf[]): T { return keys.reduce((acc, key, index) => ({ ...acc, [key]: observables[index] }), {} as T); } }