fix: monitoring when service down

src/app/features/preservation/monitoring/components/presentationals/monitoring-service/monitoring-service.presentational.html

 <mat-expansion-panel>
   <mat-expansion-panel-header>
     <mat-panel-title>
-      <a [href]="service._links.self.href">
+      <a [href]="service.status === 'UP' ? service._links.self.href : '#'">
         {{service.name}}
-        <ng-template [ngIf]="!(index | isNullOrUndefined)">{{index + 1}}</ng-template>
       </a>
     </mat-panel-title>
 

src/app/features/preservation/monitoring/components/routables/monitoring-home/monitoring-home.routable.ts

@@ -17,6 +17,7 @@ import {
   timer,
 } from "rxjs";
 import {
+  isArray,
   isNullOrUndefined,
   MemoizedUtil,
   ObjectUtil,
@@ -54,7 +55,26 @@ export class MonitoringHomeRoutable extends SharedAbstractPresentational impleme
   }
 
   getListOfServices(preservationPlanningMonitor: PreservationPlanningMonitor): PreservationPlanningMonitorService[] | PreservationPlanningMonitor[] {
-    return ObjectUtil.values(preservationPlanningMonitor);
+    const keys = ObjectUtil.keys(preservationPlanningMonitor);
+    const result = ObjectUtil.values(preservationPlanningMonitor);
+    const newList = [];
+    result.forEach((res, i) => {
+      if (isArray(res)) {
+        const subList = [];
+        res = [...res];
+        res.forEach((r, index) => {
+          r = ObjectUtil.clone(r);
+          r.name = keys[i] + " " + (index + 1);
+          subList.push(r);
+        });
+        newList.push(subList);
+      } else {
+        res = ObjectUtil.clone(res);
+        res.name = keys[i];
+        newList.push(res);
+      }
+    });
+    return newList;
   }
 
   trackByFn(index: number, item: PreservationPlanningMonitorService | PreservationPlanningMonitor): string {