From 74ec276e0029849c85c3d4daf06e1aacb858c10e Mon Sep 17 00:00:00 2001
From: Dan Percic <dan@devplant.ro>
Date: Mon, 21 Nov 2022 16:26:56 +0200
Subject: [PATCH] RED-5546: update sanitize

---
 .../search-item-template.component.html       | 64 ++++++++++++++++++
 .../search-item-template.component.scss       |  9 +++
 .../search-item-template.component.ts         | 21 ++++++
 .../search-screen.component.html              | 65 +------------------
 .../search-screen.component.scss              |  9 ---
 .../search-screen/search-screen.component.ts  |  1 -
 .../src/app/modules/search/search.module.ts   |  3 +-
 .../edit-dossier-general-info.component.ts    | 12 +++-
 .../dossiers/archived-dossiers.service.ts     |  6 +-
 .../services/entity-services/trash.service.ts |  2 +-
 libs/common-ui                                |  2 +-
 11 files changed, 114 insertions(+), 80 deletions(-)
 create mode 100644 apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.html
 create mode 100644 apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.scss
 create mode 100644 apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.ts

diff --git a/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.html b/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.html
new file mode 100644
index 000000000..555869d19
--- /dev/null
+++ b/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.html
@@ -0,0 +1,64 @@
+<div>
+    <div class="cell filename">
+        <div [matTooltip]="item.filename" class="table-item-title heading" matTooltipPosition="above">
+            <span
+                *ngIf="item.highlights.filename; else defaultFilename"
+                [innerHTML]="sanitize(item.highlights.filename[0])"
+                class="highlights"
+            ></span>
+            <ng-template #defaultFilename>{{ item.filename }}</ng-template>
+        </div>
+
+        <ng-container *ngIf="item.highlights['sections.text'] as highlights">
+            <div *ngIf="highlights.length > 0" class="small-label">
+                <span [innerHTML]="sanitize(highlights[0])" class="highlights"></span>
+            </div>
+            <div *ngIf="highlights.length > 1" class="small-label">
+                <span [innerHTML]="sanitize(highlights[1])" class="highlights"></span>
+            </div>
+        </ng-container>
+
+        <div *ngIf="item.unmatched?.length && item.unmatched as unmatched" class="small-label">
+            <span>
+                {{ 'search-screen.missing' | translate }}:<span *ngFor="let term of unmatched"
+                    >&nbsp;<s>{{ term }}</s></span
+                >.&nbsp;{{ 'search-screen.must-contain' | translate }}:
+                <span (click)="$event.stopPropagation(); mustContain.emit(term)" *ngFor="let term of unmatched"
+                    >&nbsp;<u>{{ term }}</u></span
+                >
+            </span>
+        </div>
+    </div>
+
+    <div class="cell">
+        <iqser-initials-avatar [user]="item.assignee" [withName]="true"></iqser-initials-avatar>
+    </div>
+
+    <div class="cell">
+        <iqser-status-bar
+            [configs]="[
+                {
+                    color: item.status,
+                    label: fileStatusTranslations[item.status] | translate,
+                    length: 1,
+                    cssClass: 'all-caps-label'
+                }
+            ]"
+            [small]="true"
+        ></iqser-status-bar>
+    </div>
+
+    <div class="cell small-label stats-subtitle">
+        <div>
+            <mat-icon *ngIf="item.archived" svgIcon="red:archive"></mat-icon>
+            {{ item.dossierName }}
+        </div>
+    </div>
+
+    <div class="cell small-label stats-subtitle">
+        <div>
+            <mat-icon svgIcon="iqser:pages"></mat-icon>
+            {{ item.numberOfPages }}
+        </div>
+    </div>
+</div>
diff --git a/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.scss b/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.scss
new file mode 100644
index 000000000..7bf631ad2
--- /dev/null
+++ b/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.scss
@@ -0,0 +1,9 @@
+@use 'common-mixins';
+
+.cell .highlights::ng-deep {
+    @include common-mixins.line-clamp(1);
+
+    em {
+        background-color: var(--iqser-highlight-color);
+    }
+}
diff --git a/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.ts b/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.ts
new file mode 100644
index 000000000..71bb73163
--- /dev/null
+++ b/apps/red-ui/src/app/modules/search/search-item-template/search-item-template.component.ts
@@ -0,0 +1,21 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { workflowFileStatusTranslations } from '@translations/file-status-translations';
+import { ISearchListItem } from '@red/domain';
+import { stripHtml } from 'string-strip-html';
+
+@Component({
+    selector: 'redaction-search-item-template',
+    templateUrl: './search-item-template.component.html',
+    styleUrls: ['./search-item-template.component.scss'],
+})
+export class SearchItemTemplateComponent {
+    @Input() item: ISearchListItem;
+    @Output() readonly mustContain = new EventEmitter<string>();
+    readonly fileStatusTranslations = workflowFileStatusTranslations;
+
+    sanitize(value: string) {
+        return stripHtml(value, {
+            ignoreTags: ['em'],
+        }).result;
+    }
+}
diff --git a/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.html b/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.html
index 252987c37..5ccdaacc9 100644
--- a/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.html
+++ b/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.html
@@ -24,70 +24,7 @@
 </section>
 
 <ng-template #tableItemTemplate let-item="entity">
-    <div>
-        <div class="cell filename">
-            <div [matTooltip]="item.filename" class="table-item-title heading" matTooltipPosition="above">
-                <span
-                    *ngIf="item.highlights.filename; else defaultFilename"
-                    [innerHTML]="stripHtmlForView(item.highlights.filename[0])"
-                    class="highlights"
-                ></span>
-                <ng-template #defaultFilename>{{ item.filename }}</ng-template>
-            </div>
-
-            <ng-container *ngIf="item.highlights['sections.text'] as highlights">
-                <div *ngIf="highlights.length > 0" class="small-label">
-                    <span [innerHTML]="highlights[0]" class="highlights"></span>
-                </div>
-                <div *ngIf="highlights.length > 1" class="small-label">
-                    <span [innerHTML]="highlights[1]" class="highlights"></span>
-                </div>
-            </ng-container>
-
-            <div *ngIf="item.unmatched?.length && item.unmatched as unmatched" class="small-label">
-                <span>
-                    {{ 'search-screen.missing' | translate }}:<span *ngFor="let term of unmatched"
-                        >&nbsp;<s>{{ term }}</s></span
-                    >.&nbsp;{{ 'search-screen.must-contain' | translate }}:
-                    <span (click)="$event.stopPropagation(); mustContain(term)" *ngFor="let term of unmatched"
-                        >&nbsp;<u>{{ term }}</u></span
-                    >
-                </span>
-            </div>
-        </div>
-
-        <div class="cell">
-            <iqser-initials-avatar [user]="item.assignee" [withName]="true"></iqser-initials-avatar>
-        </div>
-
-        <div class="cell">
-            <iqser-status-bar
-                [configs]="[
-                    {
-                        color: item.status,
-                        label: fileStatusTranslations[item.status] | translate,
-                        length: 1,
-                        cssClass: 'all-caps-label'
-                    }
-                ]"
-                [small]="true"
-            ></iqser-status-bar>
-        </div>
-
-        <div class="cell small-label stats-subtitle">
-            <div>
-                <mat-icon *ngIf="item.archived" svgIcon="red:archive"></mat-icon>
-                {{ item.dossierName }}
-            </div>
-        </div>
-
-        <div class="cell small-label stats-subtitle">
-            <div>
-                <mat-icon svgIcon="iqser:pages"></mat-icon>
-                {{ item.numberOfPages }}
-            </div>
-        </div>
-    </div>
+    <redaction-search-item-template [item]="item" (mustContain)="mustContain($event)"></redaction-search-item-template>
 </ng-template>
 
 <ng-container *ngIf="dossierTemplates$ | async"></ng-container>
diff --git a/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.scss b/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.scss
index 7bf631ad2..e69de29bb 100644
--- a/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.scss
+++ b/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.scss
@@ -1,9 +0,0 @@
-@use 'common-mixins';
-
-.cell .highlights::ng-deep {
-    @include common-mixins.line-clamp(1);
-
-    em {
-        background-color: var(--iqser-highlight-color);
-    }
-}
diff --git a/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.ts b/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.ts
index a5c65fd11..8ccc39a44 100644
--- a/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.ts
+++ b/apps/red-ui/src/app/modules/search/search-screen/search-screen.component.ts
@@ -42,7 +42,6 @@ import { stripHtml } from 'string-strip-html';
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class SearchScreenComponent extends ListingComponent<ISearchListItem> implements OnDestroy {
-    readonly fileStatusTranslations = workflowFileStatusTranslations;
     readonly searchPositions = SearchPositions;
 
     readonly tableHeaderLabel = _('search-screen.table-header');
diff --git a/apps/red-ui/src/app/modules/search/search.module.ts b/apps/red-ui/src/app/modules/search/search.module.ts
index f95991df6..7a3f551fa 100644
--- a/apps/red-ui/src/app/modules/search/search.module.ts
+++ b/apps/red-ui/src/app/modules/search/search.module.ts
@@ -5,11 +5,12 @@ import { RouterModule } from '@angular/router';
 import { IqserListingModule, IqserSharedModule, IqserUsersModule } from '@iqser/common-ui';
 import { SharedModule } from '@shared/shared.module';
 import { TranslateModule } from '@ngx-translate/core';
+import { SearchItemTemplateComponent } from './search-item-template/search-item-template.component';
 
 const routes = [{ path: '', component: SearchScreenComponent }];
 
 @NgModule({
-    declarations: [SearchScreenComponent],
+    declarations: [SearchScreenComponent, SearchItemTemplateComponent],
     imports: [
         CommonModule,
         RouterModule.forChild(routes),
diff --git a/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts b/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts
index de4f641cd..4191303dd 100644
--- a/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts
+++ b/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts
@@ -145,7 +145,11 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
             this._editDossierDialogRef.close();
             await this._router.navigate([this.dossier.dossiersListRouterLink]);
             this._loadingService.stop();
-            this._toaster.success(_('edit-dossier-dialog.delete-successful'), { params: this.dossier });
+            this._toaster.success(_('edit-dossier-dialog.delete-successful'), {
+                params: {
+                    dossierName: this.dossier.dossierName,
+                },
+            });
         });
     }
 
@@ -165,7 +169,11 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
             if (result === ConfirmOptions.CONFIRM) {
                 this._loadingService.start();
                 await firstValueFrom(this._archivedDossiersService.archive([this.dossier]));
-                this._toaster.success(_('dossier-listing.archive.archive-succeeded'), { params: this.dossier });
+                this._toaster.success(_('dossier-listing.archive.archive-succeeded'), {
+                    params: {
+                        dossierName: this.dossier.dossierName,
+                    },
+                });
                 this._editDossierDialogRef.close();
                 this._loadingService.stop();
             }
diff --git a/apps/red-ui/src/app/services/dossiers/archived-dossiers.service.ts b/apps/red-ui/src/app/services/dossiers/archived-dossiers.service.ts
index ed9a379d9..d98fd64a7 100644
--- a/apps/red-ui/src/app/services/dossiers/archived-dossiers.service.ts
+++ b/apps/red-ui/src/app/services/dossiers/archived-dossiers.service.ts
@@ -21,7 +21,11 @@ export class ArchivedDossiersService extends DossiersService {
 
     archive(dossiers: Dossier[]): Observable<unknown> {
         const showArchiveFailedToast = () => {
-            this._toaster.error(_('dossier-listing.archive.archive-failed'), { params: dossiers });
+            this._toaster.error(_('dossier-listing.archive.archive-failed'), {
+                params: {
+                    dossierName: dossiers.map(d => d.dossierName).join(', '),
+                },
+            });
             return of({});
         };
 
diff --git a/apps/red-ui/src/app/services/entity-services/trash.service.ts b/apps/red-ui/src/app/services/entity-services/trash.service.ts
index 4ec50c525..5a00e378f 100644
--- a/apps/red-ui/src/app/services/entity-services/trash.service.ts
+++ b/apps/red-ui/src/app/services/entity-services/trash.service.ts
@@ -32,7 +32,7 @@ export class TrashService extends EntitiesService<TrashItem, TrashItem> {
 
     deleteDossier(dossier: Dossier): Observable<unknown> {
         const showToast = () => {
-            this._toaster.error(_('dossier-listing.delete.delete-failed'), { params: dossier });
+            this._toaster.error(_('dossier-listing.delete.delete-failed'), { params: { dossierName: dossier.dossierName } });
             return of({});
         };
 
diff --git a/libs/common-ui b/libs/common-ui
index c925503fc..2f1081946 160000
--- a/libs/common-ui
+++ b/libs/common-ui
@@ -1 +1 @@
-Subproject commit c925503fc6dba39824a1a2fac0e106c0a806d157
+Subproject commit 2f10819460065591e726c839175002b73ca75a3d