Merge pull request #636 from aalves08/restructure-policy-reports

recreate PR 616 - refactor policy server based on new data structure
rancher · Mar 19, 2024 · b2e265f · b2e265f
2 parents d30cdc4 + ea386e7
commit b2e265f
Show file tree

Hide file tree

Showing 14 changed files with 508 additions and 289 deletions.
diff --git a/pkg/kubewarden/components/PolicyReporter/ResourceTab.vue b/pkg/kubewarden/components/PolicyReporter/ResourceTab.vue
@@ -34,11 +34,7 @@ export default {
   async fetch() {
     const fetchedReports = await getFilteredReports(this.$store, this.resource);
 
-    if ( this.isNamespaceResource ) {
-      this.reports = fetchedReports?.results || [];
-    } else {
-      this.reports = fetchedReports || [];
-    }
+    this.reports = fetchedReports || [];
 
     if ( !isEmpty(this.reports) ) {
       const hash = [
@@ -53,17 +49,12 @@ export default {
   data() {
     return {
       colorForResult,
-      headers:      POLICY_REPORTER_HEADERS,
-      reports:      null
+      reports:          [],
+      resourceHeaders:  POLICY_REPORTER_HEADERS.RESOURCE,
+      namespaceHeaders: POLICY_REPORTER_HEADERS.NAMESPACE
     };
   },
 
-  created() {
-    if ( !this.isNamespaceResource ) {
-      this.headers = this.headers.slice(2);
-    }
-  },
-
   computed: {
     canGetKubewardenLinks() {
       const capSchema = this.$store.getters['cluster/schemaFor'](KUBEWARDEN.CLUSTER_ADMISSION_POLICY);
@@ -80,14 +71,22 @@ export default {
       return this.resource?.metadata?.namespace;
     },
 
+    hasReports() {
+      return !isEmpty(this.reports);
+    },
+
     isNamespaceResource() {
       return this.resource?.type === NAMESPACE;
+    },
+
+    tableHeaders() {
+      return this.isNamespaceResource ? this.namespaceHeaders : this.resourceHeaders;
     }
   },
 
   methods: {
     canGetResourceLink(row) {
-      const resource = row?.resources[0];
+      const resource = row.scope;
 
       if ( resource ) {
         const isCore = Object.values(coreTypes).find(type => resource.kind === type.attributes.kind);
@@ -106,9 +105,9 @@ export default {
       return null;
     },
 
-    getResourceValue(row, val, needsResource = false) {
-      if ( this.isNamespaceResource && needsResource && !isEmpty(row.resources) ) {
-        return row.resources[0][val] || '-';
+    getResourceValue(row, val, needScope = false) {
+      if ( this.isNamespaceResource && needScope ) {
+        return row.scope?.[val] || '-';
       }
 
       if ( !isEmpty(row) ) {
@@ -151,95 +150,101 @@ export default {
 <template>
   <Loading v-if="$fetchState.pending" mode="relative" />
   <div v-else class="pr-tab__container">
-    <SortableTable
-      v-if="reports"
-      :rows="reports"
-      :headers="headers"
-      :table-actions="false"
-      :row-actions="false"
-      key-field="uid"
-      :sub-expandable="true"
-      :sub-expand-column="true"
-      :sub-rows="true"
-      :paging="true"
-      :rows-per-page="25"
-      :extra-search-fields="['result']"
-      default-sort-by="status"
-    >
-      <!-- Namespace Resource columns -->
-      <template v-if="isNamespaceResource" #col:kind="{row}">
-        <td>{{ getResourceValue(row, 'kind', true) }}</td>
-      </template>
-      <template v-if="isNamespaceResource" #col:name="{row}">
-        <td>
-          <template v-if="canGetResourceLink(row)">
-            <n-link :to="getResourceLink(row)">
+    <template>
+      <SortableTable
+        :rows="reports"
+        :headers="tableHeaders"
+        :table-actions="false"
+        :row-actions="false"
+        key-field="uid"
+        :sub-expandable="true"
+        :sub-expand-column="true"
+        :sub-rows="true"
+        :paging="true"
+        :rows-per-page="25"
+        :extra-search-fields="['summary']"
+        default-sort-by="status"
+      >
+        <template
+          v-if="isNamespaceResource"
+          #col:kind="{row}"
+        >
+          <td>{{ getResourceValue(row, 'kind', true) }}</td>
+        </template>
+        <template
+          v-if="isNamespaceResource"
+          #col:name="{row}"
+        >
+          <td>
+            <template v-if="canGetResourceLink(row)">
+              <n-link :to="getResourceLink(row)">
+                <span>{{ getResourceValue(row, 'name', true) }}</span>
+              </n-link>
+            </template>
+            <template v-else>
               <span>{{ getResourceValue(row, 'name', true) }}</span>
-            </n-link>
-          </template>
-          <template v-else>
-            <span>{{ getResourceValue(row, 'name', true) }}</span>
-          </template>
-        </td>
-      </template>
-
-      <template #col:policy="{row}">
-        <td v-if="row.policy && row.rule" :class="{ 'text-bold': isNamespaceResource}">
-          <template v-if="canGetKubewardenLinks">
-            <n-link :to="getPolicyLink(row)">
-              <span>{{ row.rule }}</span>
-            </n-link>
-          </template>
-          <template v-else>
-            <span>{{ row.rule }}</span>
-          </template>
-        </td>
-      </template>
-      <template #col:severity="{row}">
-        <td>
-          <BadgeState
-            :label="getResourceValue(row, 'severity')"
-            :color="severityColor(row)"
-          />
-        </td>
-      </template>
-      <template #col:status="{row}">
-        <td>
-          <BadgeState
-            :label="getResourceValue(row, 'result')"
-            :color="statusColor(row)"
-          />
-        </td>
-      </template>
-
-      <!-- Sub-rows -->
-      <template #sub-row="{row, fullColspan}">
-        <td :colspan="fullColspan" class="pr-tab__sub-row">
-          <Banner v-if="row.message" color="info" class="message">
-            <span class="text-muted">{{ t('kubewarden.policyReporter.headers.policyReportsTab.message.title') }}:</span>
-            <span>{{ row.message }}</span>
-          </Banner>
-          <div class="details">
-            <section class="col">
-              <div class="title">
-                {{ t('kubewarden.policyReporter.headers.policyReportsTab.properties.mutating') }}
-              </div>
-              <span>
-                {{ row.properties['mutating'] || '-' }}
-              </span>
-            </section>
-            <section class="col">
-              <div class="title">
-                {{ t('kubewarden.policyReporter.headers.policyReportsTab.properties.validating') }}
-              </div>
-              <span>
-                {{ row.properties['validating'] || '-' }}
-              </span>
-            </section>
-          </div>
-        </td>
-      </template>
-    </SortableTable>
+            </template>
+          </td>
+        </template>
+
+        <template #col:policy="{row}">
+          <td v-if="row.policy && row.policyName">
+            <template v-if="canGetKubewardenLinks">
+              <n-link :to="getPolicyLink(row)">
+                <span>{{ row.policyName }}</span>
+              </n-link>
+            </template>
+            <template v-else>
+              <span>{{ row.policyName }}</span>
+            </template>
+          </td>
+        </template>
+        <template #col:severity="{row}">
+          <td>
+            <BadgeState
+              :label="getResourceValue(row, 'severity')"
+              :color="severityColor(row)"
+            />
+          </td>
+        </template>
+        <template #col:status="{row}">
+          <td>
+            <BadgeState
+              :label="getResourceValue(row, 'result')"
+              :color="statusColor(row)"
+            />
+          </td>
+        </template>
+
+        <!-- Sub-rows -->
+        <template #sub-row="{row, fullColspan}">
+          <td :colspan="fullColspan" class="pr-tab__sub-row">
+            <Banner v-if="row.message" color="info" class="message">
+              <span class="text-muted">{{ t('kubewarden.policyReporter.headers.policyReportsTab.message.title') }}:</span>
+              <span>{{ row.message }}</span>
+            </Banner>
+            <div class="details">
+              <section class="col">
+                <div class="title">
+                  {{ t('kubewarden.policyReporter.headers.policyReportsTab.properties.mutating') }}
+                </div>
+                <span>
+                  {{ row.properties['mutating'] || '-' }}
+                </span>
+              </section>
+              <section class="col">
+                <div class="title">
+                  {{ t('kubewarden.policyReporter.headers.policyReportsTab.properties.validating') }}
+                </div>
+                <span>
+                  {{ row.properties['validating'] || '-' }}
+                </span>
+              </section>
+            </div>
+          </td>
+        </template>
+      </SortableTable>
+    </template>
   </div>
 </template>
 

diff --git a/pkg/kubewarden/components/PolicyReporter/index.vue b/pkg/kubewarden/components/PolicyReporter/index.vue
@@ -13,7 +13,7 @@ import { Banner } from '@components/Banner';
 
 import { handleGrowl } from '../../utils/handle-growl';
 import { rootKubewardenRoute } from '../../utils/custom-routing';
-import { KUBEWARDEN, KUBEWARDEN_APPS, KUBEWARDEN_CHARTS } from '../../types';
+import { KUBEWARDEN, KUBEWARDEN_APPS, KUBEWARDEN_CHARTS, WG_POLICY_K8S } from '../../types';
 
 export default {
   components: { Banner, Loading },
@@ -61,11 +61,11 @@ export default {
     },
 
     hasClusterPolicyReportSchema() {
-      return this.$store.getters['cluster/schemaFor'](KUBEWARDEN.CLUSTER_POLICY_REPORT);
+      return this.$store.getters['cluster/schemaFor'](WG_POLICY_K8S.CLUSTER_POLICY_REPORT.TYPE);
     },
 
     hasPolicyReportSchema() {
-      return this.$store.getters['cluster/schemaFor'](KUBEWARDEN.POLICY_REPORT);
+      return this.$store.getters['cluster/schemaFor'](WG_POLICY_K8S.POLICY_REPORT.TYPE);
     },
 
     reporterCrds() {

diff --git a/pkg/kubewarden/config/kubewarden.ts b/pkg/kubewarden/config/kubewarden.ts
@@ -1,5 +1,7 @@
 import { rootKubewardenRoute } from '../utils/custom-routing';
-import { KUBEWARDEN, KUBEWARDEN_DASHBOARD, POLICY_REPORTER_PRODUCT, KUBEWARDEN_PRODUCT_NAME } from '../types';
+import {
+  KUBEWARDEN, KUBEWARDEN_DASHBOARD, POLICY_REPORTER_PRODUCT, KUBEWARDEN_PRODUCT_NAME, WG_POLICY_K8S
+} from '../types';
 import { POLICY_SERVER_HEADERS, POLICY_HEADERS } from './table-headers';
 
 export function init($plugin: any, store: any) {
@@ -38,7 +40,7 @@ export function init($plugin: any, store: any) {
   virtualType({
     label:      store.getters['i18n/t']('kubewarden.policyReporter.title'),
     icon:       'notifier',
-    ifHaveType: KUBEWARDEN.POLICY_REPORT,
+    ifHaveType: WG_POLICY_K8S.POLICY_REPORT.TYPE,
     name:       POLICY_REPORTER_PRODUCT,
     namespaced: false,
     weight:     95,

diff --git a/pkg/kubewarden/config/table-headers.ts b/pkg/kubewarden/config/table-headers.ts
@@ -249,35 +249,57 @@ export const RULE_HEADERS = [
   },
 ];
 
-export const POLICY_REPORTER_HEADERS = [
-  {
-    name:     'kind',
-    labelKey: 'tableHeaders.subType',
-    value:    'kind',
-    sort:     'kind'
-  },
-  {
-    name:     'name',
-    labelKey: 'tableHeaders.name',
-    value:    'name',
-    sort:     'name'
-  },
-  {
-    name:     'policy',
-    labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.policy.label',
-    value:    'policy',
-    sort:     'policy'
-  },
-  {
-    name:     'severity',
-    labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.severity.label',
-    value:    'severity',
-    sort:     'severity'
-  },
-  {
-    name:     'status',
-    labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.status.label',
-    value:    'status',
-    sort:     'result'
-  },
-];
+export const POLICY_REPORTER_HEADERS = {
+  RESOURCE: [
+    {
+      name:     'policy',
+      labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.policy.label',
+      value:    'policy',
+      sort:     'policy'
+    },
+    {
+      name:     'severity',
+      labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.severity.label',
+      value:    'severity',
+      sort:     'severity'
+    },
+    {
+      name:     'status',
+      labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.status.label',
+      value:    'status',
+      sort:     'result'
+    },
+  ],
+  NAMESPACE: [
+    {
+      name:     'kind',
+      labelKey: 'tableHeaders.subType',
+      value:    'kind',
+      sort:     'kind'
+    },
+    {
+      name:     'name',
+      labelKey: 'tableHeaders.name',
+      value:    'name',
+      sort:     'name'
+    },
+    {
+      name:     'policy',
+      labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.policy.label',
+      value:    'policy',
+      sort:     'policy'
+    },
+    {
+      name:     'severity',
+      labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.severity.label',
+      value:    'severity',
+      sort:     'severity'
+    },
+    {
+      name:     'status',
+      labelKey: 'kubewarden.policyReporter.headers.policyReportsTab.status.label',
+      value:    'status',
+      sort:     'result'
+    }
+  ]
+};