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 4454477ce..25161a316 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
@@ -3,48 +3,56 @@
-
+
-
+
+
+
+ maximumSelectedTextWidth ? '95%' : 'unset',
+ 'max-width': textWidth > maximumSelectedTextWidth ? 0 : 'unset'
+ }"
+ >
+
-
+
-
-
-
+
+
+
diff --git a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.scss b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.scss
index d4c112676..df1cd1e09 100644
--- a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.scss
+++ b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.scss
@@ -13,29 +13,14 @@
}
}
-.edit-button {
- top: 0;
- right: calc((0.5rem + 34px) * -1);
- position: sticky;
-}
-
-.undo-button {
- top: 0;
- right: calc((0.5rem + 34px) * -2);
+iqser-circle-button {
+ padding-left: 8px;
}
.w-full {
width: 100%;
}
-.absolute {
- position: absolute;
-}
-
-.relative {
- position: relative;
-}
-
.fixed-height-36 {
min-height: 36px;
}
@@ -43,3 +28,29 @@
textarea {
margin-top: 0;
}
+
+.table {
+ display: flex;
+ flex-direction: column;
+ min-width: 100%;
+
+ label {
+ opacity: 0.7;
+ font-weight: normal;
+ }
+
+ .row {
+ display: inline-flex;
+ flex-direction: row;
+ align-items: center;
+ background-color: var(--iqser-alt-background);
+ min-width: 100%;
+
+ span {
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ list-style-position: inside;
+ overflow: hidden;
+ }
+ }
+}
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 12a5b4259..a55a7fb2b 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
@@ -14,7 +14,7 @@ import { getRedactOrHintOptions, RedactOrHintOption, RedactOrHintOptions } from
import { RedactTextData, RedactTextResult } from '../../utils/dialog-types';
import { LegalBasisOption } from '../manual-redaction-dialog/manual-annotation-dialog.component';
-const MAXIMUM_SELECTED_TEXT_WIDTH = 421;
+const MAXIMUM_TEXT_AREA_WIDTH = 421;
@Component({
templateUrl: './redact-text-dialog.component.html',
@@ -39,6 +39,10 @@ export class RedactTextDialogComponent
readonly #dossier = inject(ActiveDossiersService).find(this.data.dossierId);
readonly #manualRedactionTypeExists = inject(DictionaryService).hasManualType(this.#dossier.dossierTemplateId);
#applyToAllDossiers = this.data.applyToAllDossiers ?? true;
+ readonly maximumTextAreaWidth = MAXIMUM_TEXT_AREA_WIDTH;
+ readonly maximumSelectedTextWidth = 567;
+
+ textWidth: number;
get defaultOption() {
const inDossierOption = this.options.find(option => option.value === RedactOrHintOptions.IN_DOSSIER);
@@ -60,7 +64,7 @@ export class RedactTextDialogComponent
this.options = getRedactOrHintOptions(this.#dossier, this.#applyToAllDossiers, this.data.isApprover, this.data.isPageExcluded);
this.form = this.#getForm();
this.#setupValidators(this.dictionaryRequest ? RedactOrHintOptions.IN_DOSSIER : RedactOrHintOptions.ONLY_HERE);
-
+ this.textWidth = calcTextWidthInPixels(this.form.controls.selectedText.value);
this.form.controls.option.valueChanges
.pipe(
tap((option: DetailsRadioOption
) => {
@@ -136,7 +140,7 @@ export class RedactTextDialogComponent
this.isEditingSelectedText = !this.isEditingSelectedText;
if (this.isEditingSelectedText) {
const width = calcTextWidthInPixels(this.form.controls.selectedText.value);
- this.selectedTextRows = Math.ceil(width / MAXIMUM_SELECTED_TEXT_WIDTH);
+ this.selectedTextRows = Math.ceil(width / MAXIMUM_TEXT_AREA_WIDTH);
}
}
@@ -213,4 +217,6 @@ export class RedactTextDialogComponent
}
this.form.controls.dictionary.setValue(this.#manualRedactionTypeExists ? SuperTypes.ManualRedaction : null);
}
+
+ protected readonly window = window;
}