From 3c4c5c5f7003e2c404b0c5f5407f4ac50f31dc4e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Tue, 1 Mar 2022 12:47:23 +0200 Subject: [PATCH] Some cleanup --- .../annotations-list.component.html | 26 +----------- .../annotations-list.component.scss | 4 -- .../annotations-list.component.ts | 41 +++---------------- .../highlights-separator.component.html | 25 +++++++++++ .../highlights-separator.component.scss | 7 ++++ .../highlights-separator.component.ts | 41 +++++++++++++++++++ .../file-preview-screen.component.ts | 8 ++-- .../file-preview.module.ts | 41 ++++++++++--------- .../services/annotation-draw.service.ts | 1 - .../lib/text-highlight/imported-redaction.ts | 2 +- .../src/lib/text-highlight/index.ts | 1 + .../text-highlight/text-highlights-group.ts | 5 +++ 12 files changed, 113 insertions(+), 89 deletions(-) create mode 100644 apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.html create mode 100644 apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.scss create mode 100644 apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.ts create mode 100644 libs/red-domain/src/lib/text-highlight/text-highlights-group.ts diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotations-list/annotations-list.component.html b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotations-list/annotations-list.component.html index 304e9de69..01df0b5df 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotations-list/annotations-list.component.html +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotations-list/annotations-list.component.html @@ -1,30 +1,6 @@
-
- - -
- -
- - - -
+
div { - display: flex; -} diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotations-list/annotations-list.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotations-list/annotations-list.component.ts index f864b8bb4..4ed710636 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotations-list/annotations-list.component.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotations-list/annotations-list.component.ts @@ -1,20 +1,13 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, Output, SimpleChanges, TemplateRef } from '@angular/core'; import { AnnotationWrapper } from '@models/file/annotation.wrapper'; -import { CircleButtonTypes, FilterService, IqserEventTarget } from '@iqser/common-ui'; +import { FilterService, IqserEventTarget } from '@iqser/common-ui'; import { MultiSelectService } from '../../services/multi-select.service'; import { AnnotationReferencesService } from '../../services/annotation-references.service'; -import { FilePreviewStateService } from '../../services/file-preview-state.service'; import { UserPreferenceService } from '@services/user-preference.service'; import { ViewModeService } from '../../services/view-mode.service'; import { BehaviorSubject } from 'rxjs'; import { DossiersDialogService } from '../../../../services/dossiers-dialog.service'; -import { TextHighlightOperation } from '@red/domain'; - -interface HighlightGroup { - startIdx: number; - color: string; - length: number; -} +import { TextHighlightsGroup } from '@red/domain'; @Component({ selector: 'redaction-annotations-list', @@ -23,8 +16,6 @@ interface HighlightGroup { changeDetection: ChangeDetectionStrategy.OnPush, }) export class AnnotationsListComponent implements OnChanges { - readonly circleButtonTypes = CircleButtonTypes; - @Input() annotations: AnnotationWrapper[]; @Input() selectedAnnotations: AnnotationWrapper[]; @Input() annotationActionsTemplate: TemplateRef; @@ -34,28 +25,17 @@ export class AnnotationsListComponent implements OnChanges { @Output() readonly selectAnnotations = new EventEmitter(); @Output() readonly deselectAnnotations = new EventEmitter(); - highlightGroups$ = new BehaviorSubject([]); + highlightGroups$ = new BehaviorSubject([]); constructor( readonly multiSelectService: MultiSelectService, readonly annotationReferencesService: AnnotationReferencesService, - readonly state: FilePreviewStateService, private readonly _filterService: FilterService, private readonly _userPreferenceService: UserPreferenceService, private readonly _viewModeService: ViewModeService, private readonly _dialogService: DossiersDialogService, ) {} - convertHighlights(highlightGroup: HighlightGroup): void { - const data = this._getActionData(highlightGroup, TextHighlightOperation.CONVERT); - this._dialogService.openDialog('highlightAction', null, data); - } - - removeHighlights(highlightGroup: HighlightGroup): void { - const data = this._getActionData(highlightGroup, TextHighlightOperation.REMOVE); - this._dialogService.openDialog('highlightAction', null, data); - } - ngOnChanges(changes: SimpleChanges): void { if (changes.annotations && this.annotations && !this._viewModeService.isTextHighlights) { this.annotations = this.annotations.sort(this.annotationsPositionCompare); @@ -109,25 +89,16 @@ export class AnnotationsListComponent implements OnChanges { } } - showHighlightGroup(idx: number): HighlightGroup { + showHighlightGroup(idx: number): TextHighlightsGroup { return this._viewModeService.isTextHighlights && this.highlightGroups$.value.find(h => h.startIdx === idx); } - private _getActionData(highlightGroup: HighlightGroup, operation: TextHighlightOperation) { - return { - dossierId: this.state.dossierId, - fileId: this.state.fileId, - color: highlightGroup.color, - operation, - }; - } - private _updateHighlightGroups(): void { if (!this.annotations?.length) { return; } - const highlightGroups: HighlightGroup[] = []; - let lastGroup: HighlightGroup; + const highlightGroups: TextHighlightsGroup[] = []; + let lastGroup: TextHighlightsGroup; for (let idx = 0; idx < this.annotations.length; ++idx) { if (idx === 0 || this.annotations[idx].color !== this.annotations[idx - 1].color) { if (lastGroup) { diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.html b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.html new file mode 100644 index 000000000..3ffe33de5 --- /dev/null +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.html @@ -0,0 +1,25 @@ +
+ + +
+ +
+ + + +
diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.scss b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.scss new file mode 100644 index 000000000..930ad62b5 --- /dev/null +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.scss @@ -0,0 +1,7 @@ +:host { + display: contents; + + > div { + display: flex; + } +} diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.ts new file mode 100644 index 000000000..5ebdab14c --- /dev/null +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/highlights-separator/highlights-separator.component.ts @@ -0,0 +1,41 @@ +import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; +import { CircleButtonTypes } from '@iqser/common-ui'; +import { TextHighlightOperation, TextHighlightsGroup } from '@red/domain'; +import { DossiersDialogService } from '../../../../services/dossiers-dialog.service'; +import { FilePreviewStateService } from '../../services/file-preview-state.service'; +import { AnnotationWrapper } from '@models/file/annotation.wrapper'; + +@Component({ + selector: 'redaction-highlights-separator [highlightGroup] [annotation]', + templateUrl: './highlights-separator.component.html', + styleUrls: ['./highlights-separator.component.scss'], + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class HighlightsSeparatorComponent { + @Input() highlightGroup: TextHighlightsGroup; + @Input() annotation: AnnotationWrapper; + + readonly circleButtonTypes = CircleButtonTypes; + readonly isWritable$ = this._state.isWritable$; + + constructor(private readonly _dialogService: DossiersDialogService, private readonly _state: FilePreviewStateService) {} + + convertHighlights(highlightGroup: TextHighlightsGroup): void { + const data = this._getActionData(highlightGroup, TextHighlightOperation.CONVERT); + this._dialogService.openDialog('highlightAction', null, data); + } + + removeHighlights(highlightGroup: TextHighlightsGroup): void { + const data = this._getActionData(highlightGroup, TextHighlightOperation.REMOVE); + this._dialogService.openDialog('highlightAction', null, data); + } + + private _getActionData(highlightGroup: TextHighlightsGroup, operation: TextHighlightOperation) { + return { + dossierId: this._state.dossierId, + fileId: this._state.fileId, + color: highlightGroup.color, + operation, + }; + } +} diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.ts index 2dd141fea..2c988e34d 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.ts @@ -175,7 +175,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni const nonStandardEntries = annotations.filter(a => a.getCustomData('changeLogRemoved') === 'true'); this._setAnnotationsOpacity(standardEntries, true); this._show(standardEntries); - this._hide([...nonStandardEntries]); + this._hide(nonStandardEntries); break; } case 'DELTA': { @@ -184,7 +184,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni this._setAnnotationsColor(redactions, 'annotationColor'); this._setAnnotationsOpacity(changeLogEntries, true); this._show(changeLogEntries); - this._hide([...nonChangeLogEntries]); + this._hide(nonChangeLogEntries); break; } case 'REDACTED': { @@ -192,7 +192,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni this._setAnnotationsOpacity(redactions); this._setAnnotationsColor(redactions, 'redactionColor'); this._show(redactions); - this._hide([...nonRedactionEntries]); + this._hide(nonRedactionEntries); break; } case 'TEXT_HIGHLIGHTS': { @@ -725,7 +725,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni } } - private _getAnnotations(predicate: (value) => unknown) { + private _getAnnotations(predicate: (value) => boolean) { const annotations = this._instance.Core.annotationManager.getAnnotationsList(); return predicate ? annotations.filter(predicate) : annotations; } diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview.module.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview.module.ts index 386d9c254..a93b7966c 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview.module.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview.module.ts @@ -23,6 +23,7 @@ import { AnnotationReferencesListComponent } from './components/annotation-refer import { AcceptRecommendationDialogComponent } from './dialogs/accept-recommendation-dialog/accept-recommendation-dialog.component'; import { AnnotationCardComponent } from './components/annotation-card/annotation-card.component'; import { AnnotationReferencesPageIndicatorComponent } from './components/annotation-references-page-indicator/annotation-references-page-indicator.component'; +import { HighlightsSeparatorComponent } from './components/highlights-separator/highlights-separator.component'; const routes: Routes = [ { @@ -33,26 +34,28 @@ const routes: Routes = [ }, ]; +const components = [ + FileWorkloadComponent, + AnnotationDetailsComponent, + AnnotationsListComponent, + PageIndicatorComponent, + PageExclusionComponent, + PdfViewerComponent, + AnnotationActionsComponent, + CommentsComponent, + DocumentInfoComponent, + TypeAnnotationIconComponent, + ViewSwitchComponent, + UserManagementComponent, + AcceptRecommendationDialogComponent, + AnnotationReferencesListComponent, + AnnotationCardComponent, + AnnotationReferencesPageIndicatorComponent, + HighlightsSeparatorComponent, +]; + @NgModule({ - declarations: [ - FilePreviewScreenComponent, - FileWorkloadComponent, - AnnotationDetailsComponent, - AnnotationsListComponent, - PageIndicatorComponent, - PageExclusionComponent, - PdfViewerComponent, - AnnotationActionsComponent, - CommentsComponent, - DocumentInfoComponent, - TypeAnnotationIconComponent, - ViewSwitchComponent, - UserManagementComponent, - AcceptRecommendationDialogComponent, - AnnotationReferencesListComponent, - AnnotationCardComponent, - AnnotationReferencesPageIndicatorComponent, - ], + declarations: [FilePreviewScreenComponent, ...components], imports: [ RouterModule.forChild(routes), CommonModule, diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/services/annotation-draw.service.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/services/annotation-draw.service.ts index 42de352b7..b7cfc0435 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/services/annotation-draw.service.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/services/annotation-draw.service.ts @@ -222,7 +222,6 @@ export class AnnotationDrawService { annotationWrapper.hidden; annotation.setCustomData('redact-manager', 'true'); annotation.setCustomData('redaction', String(annotationWrapper.previewAnnotation)); - annotation.setCustomData('highlight', String(annotationWrapper.isHighlight)); annotation.setCustomData('skipped', String(annotationWrapper.isSkipped)); annotation.setCustomData('changeLog', String(annotationWrapper.isChangeLogEntry)); annotation.setCustomData('changeLogRemoved', String(annotationWrapper.isChangeLogRemoved)); diff --git a/libs/red-domain/src/lib/text-highlight/imported-redaction.ts b/libs/red-domain/src/lib/text-highlight/imported-redaction.ts index 9d7cf6c69..7a08fee0d 100644 --- a/libs/red-domain/src/lib/text-highlight/imported-redaction.ts +++ b/libs/red-domain/src/lib/text-highlight/imported-redaction.ts @@ -1,4 +1,4 @@ -import { IRectangle } from '../geometry/rectangle'; +import { IRectangle } from '../geometry'; export interface ImportedRedaction { id: string; diff --git a/libs/red-domain/src/lib/text-highlight/index.ts b/libs/red-domain/src/lib/text-highlight/index.ts index 6010350eb..f49b5580a 100644 --- a/libs/red-domain/src/lib/text-highlight/index.ts +++ b/libs/red-domain/src/lib/text-highlight/index.ts @@ -2,3 +2,4 @@ export * from './imported-redaction'; export * from './text-highlight-operation'; export * from './text-highlight.response'; export * from './text-highlight.request'; +export * from './text-highlights-group'; diff --git a/libs/red-domain/src/lib/text-highlight/text-highlights-group.ts b/libs/red-domain/src/lib/text-highlight/text-highlights-group.ts new file mode 100644 index 000000000..30755ce59 --- /dev/null +++ b/libs/red-domain/src/lib/text-highlight/text-highlights-group.ts @@ -0,0 +1,5 @@ +export interface TextHighlightsGroup { + startIdx: number; + color: string; + length: number; +}