fix(vulnerabilities): Simulate data fetch to fix SortableTable checkbox selection

Author: rushk014

pkg/sbombastic-image-vulnerability-scanner/components/common/ScoreBadge.vue

@@ -10,12 +10,12 @@
     name: 'scoreBadge',
     props: {
       score:{
-        type: Number,
-        default: 0
+        type: String,
+        default: ''
       },
       scoreType: {
         type: String,
-        default: ""
+        default: ''
       }
     },
     computed: {

pkg/sbombastic-image-vulnerability-scanner/formatters/ImpactedCell.vue

@@ -19,7 +19,7 @@
     },
     props: {
       value: {
-        type: String,
+        type: Number,
         required: true
       },
       row: {

pkg/sbombastic-image-vulnerability-scanner/pages/c/_cluster/sbombastic-image-vulnerability-scanner/Vulnerabilities.vue

@@ -14,10 +14,13 @@
         :has-advanced-filtering="false"
         :namespaced="false"
         :row-actions="false"
+        :table-actions="true"
         :force-update-live-and-delayed="0"
         :use-query-params-for-simple-filtering="true"
         :rows="vulnerabilities"
         :headers="VULNERABILITIES_TABLE"
+        :key-field="'id'"
+        @selection="onSelectionChange"
       />
     </div>
   </div>
@@ -40,25 +43,29 @@
     data() {
       return {
         VULNERABILITIES_TABLE,
-        severityDistribution,
-        cves,
+        severityDistribution: null,
+        topSevereVulnerabilities: [],
+        vulnerabilities: [],
+        selectedRows: [],
       };
     },
-    computed: {
-      totalVulnerabilities() {
-        return Object.values(this.severityDistribution).reduce((sum, value) => sum + value, 0);
-      },
-      vulnerabilities() {
-        return this.cves.map(vul => ({
-          ...vul,
-          spec: {
-            ...vul.spec,
-            totalImages: this.totalVulnerabilities
-          }
-        }));
-      },
-      topSevereVulnerabilities() {
-        return this.vulnerabilities.sort((a, b) => Number(b.spec.scoreV3) - Number(a.spec.scoreV3)).slice(0, 5);
+    async fetch() {
+      // await this.$store.dispatch('sbombastic-image-vulnerability-scanner/load');
+      this.severityDistribution = severityDistribution;
+      const totalVulnerabilities = Object.values(this.severityDistribution).reduce((sum, value) => sum + value, 0);
+      this.vulnerabilities = cves.map(vul => ({
+        ...vul,
+        spec: {
+          ...vul.spec,
+          totalImages: totalVulnerabilities
+        }
+      }));
+      this.topSevereVulnerabilities = this.vulnerabilities.sort((a, b) => Number(b.spec.scoreV3) - Number(a.spec.scoreV3)).slice(0, 5);
+
+    },
+    methods: {
+      onSelectionChange(selected) {
+        this.selectedRows = selected || [];
       },
     },
   }