Show Host ID

webapp/frontend/src/app/data/mock/device/details/sda.ts

@@ -9,6 +9,7 @@ export const sda = {
         "model_name": "Samsung_SSD_860_EVO_500GB",
         "interface_type": "SCSI",
         "interface_speed": "",
+        "host_id": "NAS",
         "serial_number": "S3YZNB0KBXXXXXX",
         "firmware": "002C",
         "rotational_speed": 0,

webapp/frontend/src/app/data/mock/device/details/sdc.ts

@@ -9,6 +9,7 @@ export const sdc = {
         "model_name": "WDC_WD140EDFZ-11A0VA0",
         "interface_type": "SCSI",
         "interface_speed": "1.5 Gb/s",
+        "host_id": "NAS",
         "serial_number": "9RK4XXXXX",
         "firmware": "MS1OA650",
         "rotational_speed": 7200,

webapp/frontend/src/app/data/mock/summary/data.ts

@@ -11,6 +11,7 @@ export const summary = {
         "manufacturer": "ATA",
         "model_name": "Samsung_SSD_860_EVO_500GB",
         "interface_type": "SCSI",
+        "host_id": "NAS",
         "interface_speed": "",
         "serial_number": "S3YZNB0KBXXXXXX",
         "firmware": "002C",
@@ -386,6 +387,7 @@ export const summary = {
         "model_name": "WDC_WD140EDFZ-11A0VA0",
         "interface_type": "SCSI",
         "interface_speed": "1.5 Gb/s",
+        "host_id": "NAS",
         "serial_number": "9RK4XXXXX",
         "firmware": "MS1OA650",
         "rotational_speed": 7200,

webapp/frontend/src/app/modules/dashboard/dashboard.component.ts

@@ -166,11 +166,18 @@ export class DashboardComponent implements OnInit, AfterViewInit, OnDestroy
     }
 
     deviceTitle(disk){
-        var title = [`/dev/${disk.device_name}`]
+        let title = []
+
+        if (disk.host_id) title.push(disk.host_id)
+
+        title.push(`/dev/${disk.device_name}`)
+
         if (disk.device_type && disk.device_type != 'scsi' && disk.device_type != 'ata'){
             title.push(disk.device_type)
         }
+
         title.push(disk.model_name)
+
         return title.join(' - ')
     }
 

webapp/frontend/src/app/modules/detail/detail.component.html

@@ -56,8 +56,12 @@
                     <div class="text-2xl font-semibold leading-tight">/dev/{{data.data.device_name}}</div>
                 </div>
                 <div class="flex flex-col my-2 grid grid-cols-2">
+                    <div *ngIf="data.data.host_id" class="my-2 col-span-2 lt-md:col-span-1">
+                        <div>{{data.data.host_id}}</div>
+                        <div class="text-secondary text-md">Host ID</div>
+                    </div>
                     <div *ngIf="data.data.device_type && data.data.device_type != 'ata' && data.data.device_type != 'scsi'" class="my-2 col-span-2 lt-md:col-span-1">
-                        <div>{{data.data.device_type}}</div>
+                        <div>{{data.data.device_type | uppercase}}</div>
                         <div class="text-secondary text-md">Device Type</div>
                     </div>
                     <div *ngIf="data.data.manufacturer" class="my-2 col-span-2 lt-md:col-span-1">