From 3a0b5f415bc51fa5bc42c6e1628798ecc3ea9c3f Mon Sep 17 00:00:00 2001
From: Valentin Mihai <Valentin-Gabriel.Mihai.ext@knecon.com>
Date: Mon, 23 Oct 2023 23:14:00 +0300
Subject: [PATCH] DM-535 - Components without references not displayed in
 Component View

---
 ...uctured-component-management-dialog.component.html |  4 ++--
 ...tructured-component-management-dialog.component.ts |  4 ++++
 .../src/app/services/files/component-log.service.ts   | 11 +++--------
 .../src/lib/component-log/component-log-entry.ts      |  2 +-
 4 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.html b/apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.html
index 86b651106..96d905189 100644
--- a/apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.html
+++ b/apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.html
@@ -10,7 +10,7 @@
             <div class="table-header">{{ 'component-log-dialog.table-header.annotation-references' | translate }}</div>
 
             <ng-container *ngFor="let entry of componentLogEntries; let index = index">
-                <div class="bold">{{ entry.name.replaceAll('_', ' ').toLowerCase() }}</div>
+                <div class="bold">{{ entry.name }}</div>
                 <div [id]="getValueCellId(index)">
                     <iqser-editable-input
                         (save)="saveEdit($event, entry.name)"
@@ -49,7 +49,7 @@
                                 'component-log-dialog.annotations'
                                     | translate
                                         : {
-                                              type: entry.name,
+                                              type: parseType(reference.type),
                                               page: reference.page,
                                               ruleNumber: reference.entityRuleId
                                           }
diff --git a/apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.ts b/apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.ts
index 20772b20f..bbc9e6be8 100644
--- a/apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.ts
+++ b/apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.ts
@@ -99,6 +99,10 @@ export class StructuredComponentManagementDialogComponent extends BaseDialogComp
         return this.exportJSON();
     }
 
+    parseType(type: string) {
+        return type.replaceAll('_', ' ').replace(/(^\w{1})|(\s+\w{1})/g, letter => letter.toUpperCase());
+    }
+
     async toggleOpenScmDialogByDefault() {
         await this.userPreferences.toggleOpenScmDialogByDefault();
         await this.userPreferences.reload();
diff --git a/apps/red-ui/src/app/services/files/component-log.service.ts b/apps/red-ui/src/app/services/files/component-log.service.ts
index 9299c9373..fc61b265a 100644
--- a/apps/red-ui/src/app/services/files/component-log.service.ts
+++ b/apps/red-ui/src/app/services/files/component-log.service.ts
@@ -19,7 +19,7 @@ export class ComponentLogService extends GenericService<void> {
             .pipe(
                 map(data => data.componentDetails),
                 catchError(() => of({} as ComponentDetails)),
-                map(componentDetails => this.#filterComponentDetails(componentDetails)),
+                map(componentDetails => this.#mapComponentDetails(componentDetails)),
                 mapEach(log => new ComponentLogEntry(log)),
             );
     }
@@ -61,12 +61,7 @@ export class ComponentLogService extends GenericService<void> {
         });
     }
 
-    #filterComponentDetails(componentDetails: ComponentDetails): IComponentLogEntry[] {
-        return Object.keys(componentDetails)
-            .filter(function (key) {
-                const component = componentDetails[key];
-                return !!component.componentValues[0].entityReferences.length;
-            })
-            .reduce((res, key) => (res.push(componentDetails[key]), res), []);
+    #mapComponentDetails(componentDetails: ComponentDetails): IComponentLogEntry[] {
+        return Object.keys(componentDetails).reduce((res, key) => (res.push(componentDetails[key]), res), []);
     }
 }
diff --git a/libs/red-domain/src/lib/component-log/component-log-entry.ts b/libs/red-domain/src/lib/component-log/component-log-entry.ts
index 1504948e3..9bd2ad4d8 100644
--- a/libs/red-domain/src/lib/component-log/component-log-entry.ts
+++ b/libs/red-domain/src/lib/component-log/component-log-entry.ts
@@ -12,7 +12,7 @@ export class ComponentLogEntry implements IComponentLogEntry {
     readonly componentValues: ComponentValue[];
 
     constructor(entry: IComponentLogEntry) {
-        this.name = entry.name;
+        this.name = entry.name.replaceAll('_', ' ');
         this.componentValues = entry.componentValues;
     }
 }