From d787943363e13d78468849653e014ac78d1cd4ac Mon Sep 17 00:00:00 2001 From: Valentin Mihai Date: Thu, 14 Sep 2023 00:52:50 +0300 Subject: [PATCH 1/2] RED-7588 - Improve the behavior of the add-to-dict text edit in new dialog --- .../redact-text-dialog.component.html | 8 ++++--- .../redact-text-dialog.component.scss | 15 ++++++++++++ .../redact-text-dialog.component.ts | 24 ++++++++++++++----- apps/red-ui/src/app/utils/functions.ts | 18 ++++++++++++++ 4 files changed, 56 insertions(+), 9 deletions(-) diff --git a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.html b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.html index 9b727bea3..e900cddfb 100644 --- a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.html +++ b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.html @@ -12,22 +12,24 @@ " class="selected-text" > -
+
{{ form.get('selectedText').value }} div { gap: 0.5rem; + + span { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } } .edit-button { top: 0; right: calc((0.5rem + 34px) * -1); + position: sticky; } .undo-button { @@ -28,3 +35,11 @@ .relative { position: relative; } + +.fixed-height { + min-height: 40px; +} + +textarea { + margin-top: 0; +} diff --git a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.ts b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.ts index 66e8f8c43..3a11a87a2 100644 --- a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.ts +++ b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.ts @@ -1,6 +1,6 @@ import { Component, inject, OnInit } from '@angular/core'; import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; -import { FormBuilder } from '@angular/forms'; +import { FormBuilder, UntypedFormGroup } from '@angular/forms'; import { DetailsRadioOption, IconButtonTypes, IqserDialogComponent } from '@iqser/common-ui'; import { Dictionary, IAddRedactionRequest, SuperTypes } from '@red/domain'; import { ActiveDossiersService } from '@services/dossiers/active-dossiers.service'; @@ -12,6 +12,9 @@ import { tap } from 'rxjs/operators'; import { getRedactOrHintOptions, RedactOrHintOption, RedactOrHintOptions } from '../../utils/dialog-options'; import { RedactTextData, RedactTextResult } from '../../utils/dialog-types'; import { LegalBasisOption } from '../manual-redaction-dialog/manual-annotation-dialog.component'; +import { calcTextWidthInPixels } from '@utils/functions'; + +const MAXIMUM_SELECTED_TEXT_WIDTH = 421; @Component({ templateUrl: './redact-text-dialog.component.html', @@ -21,19 +24,20 @@ export class RedactTextDialogComponent extends IqserDialogComponent implements OnInit { + readonly #manualRedactionTypeExists: boolean; + readonly #dossier = inject(ActiveDossiersService).find(this.data.dossierId); + #applyToAllDossiers = this.data.applyToAllDossiers ?? true; readonly roles = Roles; readonly iconButtonTypes = IconButtonTypes; readonly options: DetailsRadioOption[]; + readonly form: UntypedFormGroup; + readonly initialText: string; dictionaryRequest = false; legalOptions: LegalBasisOption[] = []; dictionaries: Dictionary[] = []; - readonly form; isEditingSelectedText = false; - readonly initialText: string; modifiedText: string; - readonly #manualRedactionTypeExists: boolean; - #applyToAllDossiers = this.data.applyToAllDossiers ?? true; - readonly #dossier = inject(ActiveDossiersService).find(this.data.dossierId); + selectedTextRows = 1; constructor( private readonly _justificationsService: JustificationsService, @@ -130,6 +134,14 @@ export class RedactTextDialogComponent }); } + toggleEditingSelectedText() { + this.isEditingSelectedText = !this.isEditingSelectedText; + if (this.isEditingSelectedText) { + const width = calcTextWidthInPixels(this.form.get('selectedText').value); + this.selectedTextRows = Math.ceil(width / MAXIMUM_SELECTED_TEXT_WIDTH); + } + } + #setDictionaries() { this.dictionaries = this._dictionaryService.getRedactTextDictionaries(this.#dossier.dossierTemplateId, !this.#applyToAllDossiers); } diff --git a/apps/red-ui/src/app/utils/functions.ts b/apps/red-ui/src/app/utils/functions.ts index b63b3aa2a..83190316a 100644 --- a/apps/red-ui/src/app/utils/functions.ts +++ b/apps/red-ui/src/app/utils/functions.ts @@ -115,3 +115,21 @@ export function moveElementInArray(array: T[], element: T, index: number) { result.splice(index, 0, element); return result; } + +export function calcTextWidthInPixels(text: string): number { + const temporaryElement = document.createElement('span'); + document.body.appendChild(temporaryElement); + + temporaryElement.style.font = 'times new roman'; + temporaryElement.style.fontSize = 13 + 'px'; + temporaryElement.style.height = 'auto'; + temporaryElement.style.width = 'auto'; + temporaryElement.style.position = 'absolute'; + temporaryElement.style.whiteSpace = 'no-wrap'; + temporaryElement.innerHTML = text; + + const width = Math.ceil(temporaryElement.clientWidth); + document.body.removeChild(temporaryElement); + + return width; +} From 471463f897d051d66b2963d26e063cf87b523bf6 Mon Sep 17 00:00:00 2001 From: project_703_bot_497bb7eb186ca592c63b3e50cd5c69e1 Date: Wed, 13 Sep 2023 21:53:38 +0000 Subject: [PATCH 2/2] push back localazy update --- apps/red-ui/src/assets/i18n/redact/de.json | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/apps/red-ui/src/assets/i18n/redact/de.json b/apps/red-ui/src/assets/i18n/redact/de.json index e2b3a85cd..12448eefa 100644 --- a/apps/red-ui/src/assets/i18n/redact/de.json +++ b/apps/red-ui/src/assets/i18n/redact/de.json @@ -2052,11 +2052,11 @@ }, "only-here": { "description": "Do not annotate \"{value}\" at this position in the current document.", - "description-bulk": "", + "description-bulk": "Do not annotate the selected terms at this position in the current document.", "label": "Remove here" } }, - "redacted-text": "" + "redacted-text": "Selected redactions" }, "title": "Remove {count, plural, one{annotation} other {annotations}}" } @@ -2070,30 +2070,38 @@ "content": { "comment": "Comment", "comment-placeholder": "Add remarks or mentions ...", + "list-item": "{text}", + "list-item-false-positive": "\"{text}\" in the context: \"{context}\"", "options": { "do-not-recommend": { "description": "Do not recommend \"{value}\" as {type} in any document of the current dossier.", - "description-bulk": "", + "description-bulk": "Do not recommend the selected terms in any document of the current dossier.", "extraOptionLabel": "Apply to all dossiers", "label": "Remove from dossier" }, "false-positive": { "description": "\"{value}\" is not a {type} in this context: \"{context}\".", + "description-bulk": "Do not redact the selected terms in their respective context.", "extraOptionLabel": "Apply to all dossiers", "label": "False positive" }, "in-dossier": { "description": "Do not {type} \"{value}\" in any document of the current dossier.", + "description-bulk": "Do not redact the selected terms as their respective types in any dossier.", "extraOptionLabel": "Apply to all dossiers", - "label": "Remove from dossier" + "label": "Remove from dossier", + "label-bulk": "No longer redact in any dossier" }, "only-here": { "description": "Do not {type, select, undefined{redact} other{type}} \"{value}\" at this position in the current document.", + "description-bulk": "Do not redact the selected terms at this position in the current document.", "label": "Remove here" } - } + }, + "redacted-text": "Selected {type}" }, - "title": "Remove {type}" + "title": "Remove {type, select, redaction{redaction} recommendation{recommendation} other{hint}}", + "title-bulk": "Remove {type, select, redaction{redactions} recommendation{recommendations} other{hints}}" } }, "report-type": {