WIP

Signed-off-by: Frank Jogeleit <[email protected]>

backend/pkg/config/config.go

@@ -118,6 +118,9 @@ type CustomBoard struct {
 	PolicyReports struct {
 		Selector map[string]string `mapstructure:"selector"`
 	} `mapstructure:"policyReports"`
+	ClusterScope struct {
+		Enabled bool `mapstructure:"enabled"`
+	} `mapstructure:"clusterScope"`
 }
 
 // Config structure

backend/pkg/config/mapper.go

@@ -65,7 +65,9 @@ func MapCustomBoards(customBoards []CustomBoard) map[string]api.CustomBoard {
 			},
 			PolicyReports: api.PolicyReports{
 				Selector: c.PolicyReports.Selector,
-			}}
+			},
+			ClusterScope: c.ClusterScope.Enabled,
+		}
 	}
 
 	return configs

backend/pkg/core/client/client.go

@@ -53,6 +53,16 @@ func (c *Client) ListSourceCategoryTree(ctx context.Context, query url.Values) (
 	return decodeList[SourceCategoryTree](resp.Body)
 }
 
+func (c *Client) ListResourceCategories(ctx context.Context, id string, query url.Values) ([]SourceCategoryTree, error) {
+	resp, err := c.get(ctx, fmt.Sprintf("/v2/resource/%s/source-categories", id), query)
+	if err != nil {
+		return nil, err
+	}
+	defer resp.Body.Close()
+
+	return decodeList[SourceCategoryTree](resp.Body)
+}
+
 func (c *Client) GetFindings(ctx context.Context, query url.Values) (*Findings, error) {
 	resp, err := c.get(ctx, "/v2/findings", query)
 	if err != nil {
@@ -93,6 +103,21 @@ func (c *Client) ListSources(ctx context.Context, query url.Values) ([]string, e
 	return decodeList[string](resp.Body)
 }
 
+func (c *Client) UseResources(ctx context.Context, source string, query url.Values) (bool, error) {
+	resp, err := c.get(ctx, fmt.Sprintf("/v2/sources/%s/use-resources", source), query)
+	if err != nil {
+		return false, err
+	}
+	defer resp.Body.Close()
+
+	result, err := decodeMap[string, bool](resp.Body)
+	if err != nil {
+		return false, err
+	}
+
+	return result["resources"], nil
+}
+
 func (c *Client) ListNamespaces(ctx context.Context, query url.Values) ([]string, error) {
 	resp, err := c.get(ctx, "/v1/namespaces", query)
 	if err != nil {

backend/pkg/server/api/handler.go

@@ -29,7 +29,7 @@ func (h *Handler) ListCustomBoards(ctx *gin.Context) {
 }
 
 func (h *Handler) GetPolicyDetails(ctx *gin.Context) {
-	details, err := h.service.PolicyDetails(ctx, ctx.Param("cluster"), ctx.Param("source"), ctx.Param("policy"), ctx.Request.URL.Query())
+	details, err := h.service.PolicyDetails(ctx, ctx.Param("cluster"), ctx.Param("source"), ctx.Query("policies"), ctx.Request.URL.Query())
 	if err != nil {
 		zap.L().Error(
 			"failed to generate policy sources",

backend/pkg/server/server.go

@@ -66,7 +66,7 @@ func (s *Server) RegisterAPI(c *api.Config, configs map[string]api.CustomBoard)
 	s.api.GET("config/:cluster/custom-board/:id", handler.GetCustomBoard)
 	s.api.GET("config/:cluster/resource/:id", handler.GetResourceDetails)
 	s.api.GET("config/:cluster/policy-sources", handler.ListPolicySources)
-	s.api.GET("config/:cluster/:source/policy/:policy/details", handler.GetPolicyDetails)
+	s.api.GET("config/:cluster/:source/policy/details", handler.GetPolicyDetails)
 
 	s.api.GET("config/:cluster/layout", handler.Layout)
 	s.api.GET("config/:cluster/dashboard", handler.Dashboard)

backend/pkg/service/model.go

@@ -48,6 +48,7 @@ type Dashboard struct {
 	Charts         Charts       `json:"charts"`
 	SourcesNavi    []SourceItem `json:"sourcesNavi"`
 	Total          Total        `json:"total"`
+	ShowResults    []string     `json:"showResults"`
 }
 
 type ResourceDetails struct {

backend/pkg/service/service.go

@@ -5,6 +5,7 @@ import (
 	"errors"
 	"net/url"
 	"sort"
+	"strconv"
 	"sync"
 
 	core "github.com/kyverno/policy-reporter-ui/pkg/core/client"
@@ -140,7 +141,7 @@ func (s *Service) ResourceDetails(ctx context.Context, cluster string, id string
 	var sourcesTree []core.SourceCategoryTree
 	g.Go(func() error {
 		var err error
-		sourcesTree, err = client.ListSourceCategoryTree(ctx, query)
+		sourcesTree, err = client.ListResourceCategories(ctx, id, query)
 
 		return err
 	})
@@ -191,6 +192,7 @@ func (s *Service) Dashboard(ctx context.Context, cluster string, sources []strin
 	g := &errgroup.Group{}
 
 	combinedFilter, namespaceFilter, clusterFilter := BuildFilters(query)
+	combinedFilter.Set("namespaced", strconv.FormatBool(!clusterScope))
 
 	var findings *core.Findings
 	g.Go(func() error {
@@ -202,6 +204,7 @@ func (s *Service) Dashboard(ctx context.Context, cluster string, sources []strin
 
 	namespaceResults := make(map[string]core.NamespaceStatusCounts, len(sources))
 	clusterResults := make(map[string]map[string]int, len(sources))
+	showResults := make([]string, 0, len(sources))
 
 	mx := &sync.Mutex{}
 	cmx := &sync.Mutex{}
@@ -214,8 +217,16 @@ func (s *Service) Dashboard(ctx context.Context, cluster string, sources []strin
 				return err
 			}
 
+			resources, err := client.UseResources(ctx, source, namespaceFilter)
+			if err != nil {
+				return err
+			}
+
 			mx.Lock()
 			namespaceResults[source] = result
+			if !resources {
+				showResults = append(showResults, source)
+			}
 			mx.Unlock()
 
 			return nil
@@ -254,6 +265,7 @@ func (s *Service) Dashboard(ctx context.Context, cluster string, sources []strin
 		SingleSource:   len(sources) == 1,
 		Sources:        sources,
 		Namespaces:     namespaces,
+		ShowResults:    showResults,
 		SourcesNavi:    MapFindingSourcesToSourceItem(findings),
 		Charts: Charts{
 			ClusterScope:   clusterResults,

frontend/components/AppRow.vue

@@ -0,0 +1,10 @@
+<template>
+  <v-row>
+    <v-col>
+      <slot />
+    </v-col>
+  </v-row>
+</template>
+<script setup lang="ts">
+import { capilize } from "~/modules/core/layouthHelper";
+</script>

frontend/components/PageLayout.vue

@@ -4,7 +4,7 @@
       <v-col>
         <v-card>
           <v-toolbar color="header" elevation="2">
-            <v-toolbar-title>{{ title }}</v-toolbar-title>
+            <v-toolbar-title v-if="title">{{ title }}</v-toolbar-title>
             <template #append>
               <FormKindAutocomplete style="min-width: 300px; max-width: 100%; margin-right: 15px;" v-model="kinds" :source="source" />
               <FormClusterKindAutocomplete v-if="!nsScoped" style="min-width: 300px;" v-model="clusterKinds" :source="source" />

frontend/composables/infinite.ts

@@ -1,14 +1,45 @@
 import type { Ref, UnwrapRef } from "vue";
 import type { UnwrapRefSimple } from "@vue/reactivity";
 
-export const useInfinite = <T>(list: Ref<T[] | null>) => {
+export const useInfinite = <T>(list: Ref<T[] | null>, defaultLoadings = 3) => {
   const loaded = ref<T[]>([])
-  const index = ref(1)
+  const index = ref(0)
 
-  watch(list, (l) => {
-    if (!list.value?.length) return
+  watch(list, (newValue, oldValue) => {
+    const l = newValue || []
+    const length = (l || []).length
+    const oldLength = (oldValue || []).length
 
-    loaded.value = (l || []).slice(0, 1) as UnwrapRefSimple<T>[]
+    if (!length || (length === loaded.value.length && loaded.value.every(i => (l.includes(i as T))))) return;
+
+    if (length - oldLength === 1) {
+      loaded.value = l.slice(0, length) as UnwrapRefSimple<T>[]
+      index.value = length
+
+      return
+    }
+
+    if (oldLength > 0 && oldLength < length) {
+      loaded.value = l.slice(0, oldLength + 1) as UnwrapRefSimple<T>[]
+      index.value = oldLength + 1
+
+      return
+    }
+
+    if (oldLength > length) {
+      loaded.value = l.slice(0, length) as UnwrapRefSimple<T>[]
+      index.value = length
+
+      return
+    }
+
+    let loadCounter = defaultLoadings
+    if (length < defaultLoadings) {
+      loadCounter = length
+    }
+
+    loaded.value = l.slice(0, loadCounter) as UnwrapRefSimple<T>[]
+    index.value = loadCounter
   }, { immediate: true })
 
   const load = ({ done }: any) => {

frontend/composables/router.ts

@@ -1,6 +1,6 @@
 import debounce from 'lodash.debounce'
 
-const debounced = debounce((emit: () => void) => { emit() }, 600)
+export const useDebounce = (wait: number = 600) => debounce((emit: () => void) => { emit() }, wait)
 
 export const defineRouteQuery = (key: string, selected: Ref<string[]>) => {
     const router = useRouter()
@@ -20,6 +20,8 @@ export const defineRouteQuery = (key: string, selected: Ref<string[]>) => {
         selected.value = values
     }
 
+    const debounced = useDebounce()
+
     return (inp: string[]) => {
         selected.value = inp
 

frontend/layouts/default.vue

@@ -4,8 +4,8 @@
       <v-app-bar-nav-icon icon="mdi-menu" @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
       <v-toolbar-title>Policy Reporter</v-toolbar-title>
       <template #append>
-        <cluster-select />
-        <select-display-mode-select style="width: 150px;" />
+        <form-cluster-select />
+        <form-display-mode-select style="width: 150px;" />
         <user-menu class="ml-4" :profile="layout.profile" v-if="layout.profile" />
       </template>
     </v-app-bar>
@@ -57,7 +57,6 @@
 </template>
 
 <script setup lang="ts">
-import ClusterSelect from "~/modules/core/components/select/ClusterSelect.vue";
 import type { LayoutConfig } from "~/modules/core/types";
 import { useTheme } from "vuetify";
 

frontend/modules/core/api.ts

@@ -1,21 +1,14 @@
-import { useFetch } from 'nuxt/app'
 import {
-  type NamespacedStatusCount,
-  type StatusCount,
   type Target,
   type Filter,
-  type Result,
   type Config,
   type ResultList,
   type Pagination,
   type FindingCounts,
   type ResourceResultList,
   type ResourceResult,
   type ResourceStatusCount,
-  type Resource,
   type Source,
-  type CustomBoard,
-  type CustomBoardDetails,
   type PolicyResult,
   type NamespaceStatusCount,
   Status,
@@ -30,7 +23,7 @@ type APIConfig = { baseURL: string; prefix?: string; };
 export const cluster = ref('default')
 
 export class CoreAPI {
-  private baseURL: string
+  private readonly baseURL: string
   private cluster: string = ''
 
   private nsExcludes: string[] = []
@@ -66,7 +59,7 @@ export class CoreAPI {
   }
 
   policyDetails (source: string, policy: string, filter?: Filter) {
-    return $fetch<PolicyDetails>(`/api/config/${this.cluster}/${source}/policy/${policy}/details`, { baseURL: this.baseURL, params: applyExcludes(filter, [...this.nsExcludes, ...this.clusterExcludes]) })
+    return $fetch<PolicyDetails>(`/api/config/${this.cluster}/${source}/policy/details`, { baseURL: this.baseURL, params: applyExcludes({ ...filter, policies: [policy] }, [...this.nsExcludes, ...this.clusterExcludes]) })
   }
 
   config () {
@@ -105,6 +98,10 @@ export class CoreAPI {
     return $fetch<ResultList>('/proxy/'+this.cluster+'/core/v1/cluster-resources/results', { baseURL: this.baseURL, params: { ...applyExcludes(filter, this.nsExcludes), ...pagination } })
   }
 
+  resultsWithoutResources (filter?: Filter, pagination?: Pagination) {
+    return $fetch<ResultList>('/proxy/'+this.cluster+'/core/v2/results-without-resources', { baseURL: this.baseURL, params: { ...filter, ...pagination } })
+  }
+
   countFindings (filter?: Filter) {
     return $fetch<FindingCounts>('/proxy/'+this.cluster+'/core/v2/findings', { baseURL: this.baseURL, params: { ...applyExcludes(filter, this.nsExcludes) } })
   }