Add Registry Details action menu and adjust data logic

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

@@ -24,6 +24,13 @@
             {{ t('imageScanner.general.refresh') }}
           </button>
           <ScanButton :selectedRegistries="[{name: $route.params.id, namespace: $route.params.ns}]" :reloadFn="loadData" />
+          <ActionMenu
+            v-if="registry"
+            button-role="multiAction"
+            :resource="registry"
+            data-testid="masthead-action-menu"
+            :button-aria-label="t('component.resource.detail.titleBar.ariaLabel.actionMenu', { resource: RESOURCE.REGISTRY })"
+          />
         </div>
       </div>
       <RancherMeta :properties="registryMetadata" />
@@ -36,6 +43,7 @@
   import { BadgeState } from '@rancher/components';
   import { PRODUCT_NAME, RESOURCE, PAGE } from '@sbombastic-image-vulnerability-scanner/types';
   import ResourceTable from "@shell/components/ResourceTable";
+  import ActionMenu from '@shell/components/ActionMenuShell.vue';
   import RancherMeta from './common/RancherMeta.vue';
   import RegisterStatusBadge from './common/RegisterStatusBadge.vue';
   import RegistryDetailScanTable from './RegistryDetailScanTable.vue';
@@ -49,13 +57,15 @@
       RancherMeta,
       RegisterStatusBadge,
       RegistryDetailScanTable,
-      ScanButton
+      ScanButton,
+      ActionMenu
     },
     data() {
       return {
         PRODUCT_NAME,
         RESOURCE,
         PAGE,
+        registry: null,
         registryStatus: null,
         registryMetadata: [],
         scanHistory: [],
@@ -103,7 +113,7 @@
           },
           {
             type: 'text',
-            value: registry.metadata.schedule || '',
+            value: registry.spec.scanInterval || '',
           }
         ];
 
@@ -122,6 +132,7 @@
             }
           })
         });
+        this.registry = registry;
       },
       getRegistryStatus(registry) {
         if (!registry || !registry.status || !registry.status.conditions || !registry.status.conditions.length) {
@@ -217,6 +228,17 @@
         display: flex;
         align-items: center;
         gap: 16px;
+
+        &:deep() button[data-testid="masthead-action-menu"] {
+          border-radius: 4px;
+          width: 35px;
+          height: 40px;
+
+          display: inline-flex;
+          flex-direction: row;
+          justify-content: center;
+          align-items: center;
+        }
       }
     }
   }

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

@@ -65,36 +65,36 @@ export const REGISTRY_SCAN_HISTORY_TABLE = [
     labelKey: "imageScanner.registries.configuration.scanTable.header.status",
     value: "status.statusResult.type",
     formatter: "RegistryStatusCellBadge",
-    sort: "status",
+    sort: "status.statusResult.type",
     width: 100,
   },
   {
     name: "since",
     labelKey: "imageScanner.registries.configuration.scanTable.header.since",
     value: "status.statusResult.lastTransitionTime",
     formatter: "Date",
-    sort: "timestamp",
+    sort: "status.statusResult.lastTransitionTime:desc",
   },
   {
     name: "progress",
     labelKey: "imageScanner.registries.configuration.scanTable.header.progress",
     getValue: (row: any) => row,
-    formatter: "ProgressCell",
+    formatter: "Progress",
     sort: "progress",
   },
   {
     name: "imagesScanned",
     labelKey:
       "imageScanner.registries.configuration.scanTable.header.imagesScanned",
     value: "status.scannedImagesCount",
-    sort: "imagesScanned",
+    sort: "status.scannedImagesCount",
   },
   {
     name: "imagesFound",
     labelKey:
       "imageScanner.registries.configuration.scanTable.header.imagesFound",
     value: "status.imagesCount",
-    sort: "imagesFound",
+    sort: "status.imagesCount",
   },
   {
     name: "errors",
@@ -133,7 +133,7 @@ export const VEX_MANAGEMENT_TABLE = [
     labelKey: "imageScanner.vexManagement.table.headers.createdBy",
     value: (row: any) => {
       const gen = Number(row?.metadata?.generation);
-      return (gen === 1) ? 'Rancher' : 'Manual entry';
+      return gen === 1 ? "Rancher" : "Manual entry";
     },
     sort: "metadata.generation",
   },

pkg/sbombastic-image-vulnerability-scanner/models/sbombastic.rancher.io.registry.js

@@ -7,6 +7,11 @@ export default class Registry extends SteveModel {
     console.log("Registry _availableActions");
     const out = super._availableActions.filter(action => !['download','downloadYaml'].includes(action.action));
 
+    // In details page, we don't want to show the scan action
+    if (this.$rootState.targetRoute && 'id' in this.$rootState.targetRoute.params) {
+      return out;
+    }
+
     const scanAction = {
           action:   'scanRegistry',
           label:    this.t('imageScanner.registries.button.startScan'),