rename metadata class names.

adding metadata for NVME and SCSI drives.
send back protocol specific metadata for displaying data in the UI for attributes.
UI - moved all metadata lookups into named functions (for better if/else logic)
show different columns if nvme or scsi.

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

@@ -106,8 +106,8 @@
         <div class="flex flex-auto w-1/3 p-8 lt-xl:w-full">
             <div class="flex flex-col flex-auto bg-card shadow-md rounded ">
                 <div class="p-6">
-                    <div class="font-bold text-md text-secondary uppercase tracking-wider">S.M.A.R.T Attributes</div>
-                    <div class="text-sm text-hint font-medium">{{this.smartAttributeDataSource.data.length}} visible, {{this.data.data.smart_results[0]?.ata_attributes.length - this.smartAttributeDataSource.data.length}} hidden</div>
+                    <div class="font-bold text-md text-secondary uppercase tracking-wider">S.M.A.R.T {{data.data.device_protocol}} Attributes</div>
+                    <div class="text-sm text-hint font-medium">{{this.smartAttributeDataSource.data.length}} visible, {{getHiddenAttributes()}} hidden</div>
                 </div>
                 <div class="overflow-auto">
                     <table class="w-full bg-transparent"
@@ -174,7 +174,7 @@
                             <td mat-cell
                                 *matCellDef="let attribute">
                                 <span class="pr-6 whitespace-no-wrap" matTooltip="{{getAttributeDescription(attribute)}}">
-                                    {{attribute.name}} <mat-icon class="icon-size-10" [svgIcon]="'info'"></mat-icon>
+                                    {{attribute.name}} <mat-icon *ngIf="getAttributeDescription(attribute)" class="icon-size-10" [svgIcon]="'info'"></mat-icon>
                                 </span>
                             </td>
                         </ng-container>
@@ -313,7 +313,7 @@
                             *matHeaderRowDef="smartAttributeTableColumns"></tr>
                         <tr class="attribute-row h-16"
                             mat-row
-                            [ngClass]="{'yellow-50': data.lookup[row.attribute_id]?.critical}"
+                            [ngClass]="{'yellow-50': getAttributeCritical(row)}"
                             *matRowDef="let row; columns: smartAttributeTableColumns;"></tr>
                         <tr class="h-16"
                             mat-footer-row