From 1a1a1e7f973e04d71e5734a86d6f400b335c8b26 Mon Sep 17 00:00:00 2001 From: Dan Percic Date: Fri, 28 Jan 2022 18:10:53 +0200 Subject: [PATCH] efsa improvements --- apps/red-ui/src/app/app.module.ts | 2 ++ .../add-dossier-dialog.component.html | 2 ++ .../annotation-details.component.html | 2 +- .../annotation-details.component.ts | 1 + .../annotations-list.component.html | 2 +- .../view-switch/view-switch.component.ts | 10 ++++++--- .../components/select/select.component.scss | 15 +++++++++++++ .../components/select/select.component.ts | 22 +++++++++++++++---- 8 files changed, 47 insertions(+), 9 deletions(-) diff --git a/apps/red-ui/src/app/app.module.ts b/apps/red-ui/src/app/app.module.ts index 00d8fdf7b..a455d9832 100644 --- a/apps/red-ui/src/app/app.module.ts +++ b/apps/red-ui/src/app/app.module.ts @@ -72,6 +72,8 @@ const components = [AppComponent, AuthErrorComponent, NotificationsComponent, Sp closeButton: true, enableHtml: true, toastComponent: ToastComponent, + preventDuplicates: true, + resetTimeoutOnDuplicate: true, }), TranslateModule.forRoot({ loader: { diff --git a/apps/red-ui/src/app/modules/dossier/dialogs/add-dossier-dialog/add-dossier-dialog.component.html b/apps/red-ui/src/app/modules/dossier/dialogs/add-dossier-dialog/add-dossier-dialog.component.html index 96a77da55..1b3b7c66a 100644 --- a/apps/red-ui/src/app/modules/dossier/dialogs/add-dossier-dialog/add-dossier-dialog.component.html +++ b/apps/red-ui/src/app/modules/dossier/dialogs/add-dossier-dialog/add-dossier-dialog.component.html @@ -70,6 +70,7 @@

{{ 'download-includes' | translate }}

- +
diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-details/annotation-details.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-details/annotation-details.component.ts index 745b6212a..b293a2d58 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-details/annotation-details.component.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-details/annotation-details.component.ts @@ -26,6 +26,7 @@ type EngineName = keyof typeof Engines; }) export class AnnotationDetailsComponent implements OnChanges { @Input() annotation: AnnotationWrapper; + @Input() isSelected: boolean; isPopoverOpen = false; hasEnginesToShow: boolean; 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 77df13518..d45e29274 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 @@ -41,7 +41,7 @@
- + diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/view-switch/view-switch.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/view-switch/view-switch.component.ts index b069922d9..ccac24efc 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/view-switch/view-switch.component.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/view-switch/view-switch.component.ts @@ -2,8 +2,8 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, Out import { File, ViewMode } from '@red/domain'; import { ViewModeService } from '../../services/view-mode.service'; import { FilePreviewStateService } from '../../services/file-preview-state.service'; -import { Observable } from 'rxjs'; -import { filter, switchMap } from 'rxjs/operators'; +import { combineLatest, Observable } from 'rxjs'; +import { filter, map, switchMap } from 'rxjs/operators'; @Component({ selector: 'redaction-view-switch [file]', @@ -21,7 +21,11 @@ export class ViewSwitchComponent implements OnChanges { constructor(readonly viewModeService: ViewModeService, private readonly _stateService: FilePreviewStateService) { this.canSwitchToDeltaView$ = this._stateService.fileData$.pipe( filter(fileData => !!fileData), - switchMap(fileData => fileData?.hasChangeLog$), + switchMap(fileData => + combineLatest([fileData.hasChangeLog$, fileData.file$]).pipe( + map(([hasChangeLog, file]) => hasChangeLog && !file.isApproved), + ), + ), ); } diff --git a/apps/red-ui/src/app/modules/shared/components/select/select.component.scss b/apps/red-ui/src/app/modules/shared/components/select/select.component.scss index 6cda04188..11117e8b3 100644 --- a/apps/red-ui/src/app/modules/shared/components/select/select.component.scss +++ b/apps/red-ui/src/app/modules/shared/components/select/select.component.scss @@ -11,6 +11,21 @@ } } +// https://stackoverflow.com/questions/34641281/how-to-add-class-to-host-element +:host(.fixed-height) { + height: var(--height); + overflow: hidden; + + ::ng-deep .mat-chip-list { + height: calc(var(--height) - 44px); + + .mat-chip-list-wrapper { + height: 100%; + overflow: scroll; + } + } +} + .label-header { padding: 16px 16px 14px 16px; display: flex; diff --git a/apps/red-ui/src/app/modules/shared/components/select/select.component.ts b/apps/red-ui/src/app/modules/shared/components/select/select.component.ts index b2e107977..118ac2802 100644 --- a/apps/red-ui/src/app/modules/shared/components/select/select.component.ts +++ b/apps/red-ui/src/app/modules/shared/components/select/select.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, Input, TemplateRef, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, HostBinding, Input, TemplateRef, ViewChild } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { MatChip, MatChipList, MatChipSelectionChange } from '@angular/material/chips'; @@ -20,13 +20,27 @@ export class SelectComponent implements AfterViewInit, ControlValueAccessor { @Input() options: any[]; @Input() disabled = false; @Input() multiple = true; - @ViewChild(MatChipList) chipList: MatChipList; - private _value: any[] = []; private _onChange: (value: any[]) => void; - constructor(private readonly _changeDetector: ChangeDetectorRef) {} + constructor(private readonly _changeDetector: ChangeDetectorRef, private readonly _elementRef: ElementRef) {} + + @HostBinding('class.fixed-height') + get isFixedHeight(): boolean { + return !!this._height; + } + + private _height?: number; + + @Input() + set height(value: number) { + this._height = value; + if (this.isFixedHeight) { + const nativeElement = this._elementRef.nativeElement as HTMLElement; + nativeElement.style.setProperty('--height', `${this._height}px`); + } + } @Input() valueMapper: (option: any) => any = option => option.key;