From 30c241919b61e1cfb2d0bd9295de775334ae4491 Mon Sep 17 00:00:00 2001
From: "CORP\\Nigel.Palmer" <nigel.palmer@systemc.com>
Date: Tue, 10 Dec 2024 16:03:06 +0000
Subject: [PATCH] gh-454: Display all data elements on data specification page

---
 .../data-element-search-result.component.html | 19 ++++++--------
 src/app/mauro/data-model.service.ts           |  6 ++---
 src/app/pages/browse/browse.component.html    | 11 ++------
 .../data-element/data-element.component.html  | 26 +++++--------------
 4 files changed, 19 insertions(+), 43 deletions(-)

diff --git a/src/app/data-explorer/data-element-search-result/data-element-search-result.component.html b/src/app/data-explorer/data-element-search-result/data-element-search-result.component.html
index 1e215fb5..a0346953 100644
--- a/src/app/data-explorer/data-element-search-result/data-element-search-result.component.html
+++ b/src/app/data-explorer/data-element-search-result/data-element-search-result.component.html
@@ -18,8 +18,7 @@
 -->
 <mdm-header-and-content-box *ngIf="item">
   <div header-title class="mdm-data-element-search-result__header">
-    <mat-checkbox (change)="itemChecked($event)" [checked]="item.isSelected">
-    </mat-checkbox>
+    <mat-checkbox (change)="itemChecked($event)" [checked]="item.isSelected"> </mat-checkbox>
     <h3>
       <a [routerLink]="['/dataElement', item.model, item.dataClass, item.id]">
         {{ item.label }}
@@ -43,20 +42,18 @@ <h3>
   </ng-container>
   <ng-container>
     <div class="mdm-data-element-search-result__content">
-      <div *ngIf="item.description" class="mdm-data-element-search-result__description">
-        {{ item.description }}
-      </div>
       <div
-        *ngIf="!item.description"
-        class="mdm-data-element-search-result__no-description"
-      >
+        *ngIf="item.description"
+        class="mdm-data-element-search-result__description"
+        [innerHTML]="item.description"
+        style="display: block"
+      ></div>
+      <div *ngIf="!item.description" class="mdm-data-element-search-result__no-description">
         No description available
       </div>
       <div class="mdm-data-element-search-result__footer">
         <span class="spacer"></span>
-        <mdm-identifiable-data-icon
-          [state]="item.identifiableData"
-        ></mdm-identifiable-data-icon>
+        <mdm-identifiable-data-icon [state]="item.identifiableData"></mdm-identifiable-data-icon>
       </div>
     </div>
   </ng-container>
diff --git a/src/app/mauro/data-model.service.ts b/src/app/mauro/data-model.service.ts
index a0647259..8a6cce01 100644
--- a/src/app/mauro/data-model.service.ts
+++ b/src/app/mauro/data-model.service.ts
@@ -294,11 +294,11 @@ export class DataModelService {
         // If this is a child DataClass, only the DataElements from that class will be fetched
         const allClasses = [dataClass, ...childDataClasses];
         const elements$ = allClasses.map((dc) =>
-          this.getDataElements({
+          this.getDataElements( {
             dataClassId: dc.id ?? '',
             dataModelId: dc.model ?? '',
-            parentDataClassId: dc.parentDataClass,
-          }).pipe(map((response) => response.items))
+            parentDataClassId: dc.parentDataClass
+          }, {max: 9999}).pipe(map((response) => response.items))
         );
 
         return forkJoin(elements$);
diff --git a/src/app/pages/browse/browse.component.html b/src/app/pages/browse/browse.component.html
index 18f78eda..2b8dae06 100644
--- a/src/app/pages/browse/browse.component.html
+++ b/src/app/pages/browse/browse.component.html
@@ -101,20 +101,13 @@ <h1 class="page-title">Browse the catalogue</h1>
 </div>
 <!-- Dropdown Menu -->
 <mat-menu #menu="matMenu" xPosition="after" yPosition="below">
-  <button
-    mat-menu-item
-    (click)="createDataSpecification()"
-    clickable
-    class="mdm-browse__menu-add"
-  >
+  <button mat-menu-item (click)="createDataSpecification()" clickable class="mdm-browse__menu-add">
     <span><span [mdmArrow]="'plus'"></span> Copy to new data specification</span>
   </button>
 </mat-menu>
 <div *ngIf="selected && selected.label && selected.description" class="highlight-box">
   <div class="highlight-box__content">
     <h2>{{ selected.label }}</h2>
-    <div>
-      {{ selected.description }}
-    </div>
+    <div [innerHTML]="selected.description"></div>
   </div>
 </div>
diff --git a/src/app/pages/data-element/data-element.component.html b/src/app/pages/data-element/data-element.component.html
index dae375b1..62e39f50 100644
--- a/src/app/pages/data-element/data-element.component.html
+++ b/src/app/pages/data-element/data-element.component.html
@@ -43,9 +43,7 @@ <h3>{{ dataElement.label }}</h3>
 
     <div *ngIf="identifiableData" class="mdm-data-element-detail__identifiable">
       <h3>
-        <mdm-identifiable-data-icon
-          [state]="identifiableData"
-        ></mdm-identifiable-data-icon>
+        <mdm-identifiable-data-icon [state]="identifiableData"></mdm-identifiable-data-icon>
       </h3>
     </div>
 
@@ -60,10 +58,8 @@ <h3>
       <mat-card
         *ngIf="dataElement.description && dataElement.description.length > 0"
         class="mdm-data-element-card"
+        [innerHTML]="dataElement.description"
       >
-        <p>
-          {{ dataElement.description }}
-        </p>
       </mat-card>
 
       <mat-card class="mdm-data-element-card">
@@ -80,29 +76,19 @@ <h2>Data Type</h2>
               </tr>
             </thead>
             <tbody>
-              <tr
-                *ngFor="
-                  let enumerationValue of dataElementDataTypeCasted?.enumerationValues
-                "
-              >
+              <tr *ngFor="let enumerationValue of dataElementDataTypeCasted?.enumerationValues">
                 <td>{{ enumerationValue.key }}</td>
                 <td>{{ enumerationValue.value }}</td>
               </tr>
             </tbody>
           </table>
         </div>
-        <div
-          *ngIf="
-            dataElementDataTypeCasted?.domainType === 'ModelDataType' && dataTypeModel
-          "
-        >
+        <div *ngIf="dataElementDataTypeCasted?.domainType === 'ModelDataType' && dataTypeModel">
           <p>
-            <span class="mdm-data-element-property-name">Model: </span
-            >{{ dataTypeModel.label }}
+            <span class="mdm-data-element-property-name">Model: </span>{{ dataTypeModel.label }}
           </p>
           <p>
-            <span class="mdm-data-element-property-name">Type: </span
-            >{{ dataTypeModel.domainType }}
+            <span class="mdm-data-element-property-name">Type: </span>{{ dataTypeModel.domainType }}
           </p>
         </div>
       </mat-card>