Update Registry details to use ScanJob & Registry CR data

Author: rushk014

pkg/sbombastic-image-vulnerability-scanner/components/RegistryDetails.vue

@@ -8,7 +8,7 @@
               <RouterLink to="../">{{ t('imageScanner.registries.title') }}:</RouterLink> 
               {{ $route.params.id }}
             </span>
-            <RegisterStatusBadge status="failed" />
+            <RegisterStatusBadge :status="registryStatus" />
           </div>
           <span class="resource-header-description">
             Registry configuration description
@@ -25,7 +25,7 @@
           </button>
         </div>
       </div>
-      <RancherMeta :properties="registryMetaProperties" />
+      <RancherMeta :properties="registryMetadata" />
     </div>
     Recent scans
     <ResourceTable
@@ -57,70 +57,61 @@
     },
     data() {
       return {
-        scanHistory: [
-          {
-            status: 'completed',
-            timestamp: '2023-10-01T12:00:00Z',
-            progress: '100',
-            imagesScanned: 50,
-            imagesFound: 45,
-            errors: [],
-          },
-          {
-            status: 'failed',
-            timestamp: '2023-10-02T12:00:00Z',
-            progress: '35',
-            imagesScanned: 1339,
-            imagesFound: 3826,
-            errors: [
-              {
-                message: "Not enough resources to complete the scan. Could not connect to proxyu",
-              }
-            ],
-          },
-        ],
+        registryStatus: null,
+        registryMetadata: [],
+        scanHistory: [],
         headers: REGISTRY_SCAN_HISTORY_TABLE
       }
     },
     async fetch() {
-      await this.$store.dispatch('cluster/find', { type: RESOURCE.REGISTRY, id: `${this.$route.params.ns}/${this.$route.params.id}` });
+      await this.$store.dispatch('cluster/find', { type: RESOURCE.SCAN_JOB, id: `${this.$route.params.ns}/${this.$route.params.id}` });
+      let scanJob = this.$store.getters['cluster/byId'](RESOURCE.SCAN_JOB, `${this.$route.params.ns}/${this.$route.params.id}`);
+
+      await this.$store.dispatch('cluster/find', { type: RESOURCE.REGISTRY, id: `${this.$route.params.ns}/${scanJob.spec.registry}` });
+      let registry = this.$store.getters['cluster/byId'](RESOURCE.REGISTRY, `${this.$route.params.ns}/${scanJob.spec.registry}`);
+
+      this.registryStatus = (registry.status.conditions[0].type.toLowerCase() === "discovering" ? "InProgress" : registry.status.conditions[0].type).toLowerCase();
+      this.registryMetadata = [
+        {
+          type: 'text',
+          label: this.t('imageScanner.registries.configuration.meta.registry'),
+          value: registry.spec.uri
+        },
+        {
+          type: 'text',
+          label: this.t('imageScanner.registries.configuration.meta.repositories'),
+          value: registry.spec.repositories.length
+        },
+        {
+          type: 'text',
+          label: this.t('imageScanner.registries.configuration.meta.schedule')
+        },
+        {
+          type: 'text',
+          label: this.t('imageScanner.registries.configuration.meta.namespace'),
+          value: registry.metadata.namespace
+        },
+        {
+          type: 'tags',
+          tags: registry.spec.repositories || []
+        },
+        {
+          type: 'text',
+          value: registry.metadata.schedule || '',
+        }
+      ];
+      
+      this.scanHistory = scanJob.status.conditions.map((rec) => {
+        return {
+          status: rec.type.toLowerCase(),
+          timestamp: rec.lastUpdateTime,
+          progress: rec.progress || 0,
+          imagesScanned: rec.imagesScanned || 0,
+          imagesFound: rec.imagesFound || 0,
+          errors: rec.errors || []
+        };
+      });
     },
-    computed: {
-      registry() {
-        return this.$store.getters['cluster/byId'](RESOURCE.REGISTRY, `${this.$route.params.ns}/${this.$route.params.id}`);
-      },
-      registryMetaProperties() {
-        return [
-          {
-            type: 'text',
-            label: this.t('imageScanner.registries.configuration.meta.registry'),
-            value: this.registry.spec.uri
-          },
-          {
-            type: 'text',
-            label: this.t('imageScanner.registries.configuration.meta.repositories'),
-            value: this.registry.spec.repositories.length
-          },
-          {
-            type: 'text',
-            label: this.t('imageScanner.registries.configuration.meta.schedule')
-          },
-          {
-            type: 'text',
-            label: this.t('imageScanner.registries.configuration.meta.namespace'),
-            value: this.registry.metadata.namespace
-          },
-          {
-            type: 'tags',
-            tags: this.registry.spec.repositories || []
-          },
-          {
-            type: 'text',
-            value: this.registry.metadata.schedule || '',
-          }
-        ];
-      }
-    }
   }
 </script>
 

pkg/sbombastic-image-vulnerability-scanner/config/table-headers.ts

@@ -62,7 +62,7 @@ export const REGISTRY_SCAN_HISTORY_TABLE = [
     name: "status",
     labelKey: "imageScanner.registries.configuration.scanTable.header.status",
     value: "status",
-    formatter: "RegisterStatusCellBadge",
+    formatter: "RegistryStatusCellBadge",
     sort: "status",
   },
   {
@@ -77,7 +77,7 @@ export const REGISTRY_SCAN_HISTORY_TABLE = [
     labelKey: "imageScanner.registries.configuration.scanTable.header.progress",
     value: "progress",
     getValue: (row: any) => row.progress.toString(),
-    formatter: "Percentage",
+    formatter: "ProgressCell",
     sort: "progress",
   },
   {