@kyverno/backstage-plugin-policy-reporter 2.9.0 → 2.11.0

package/dist/components/SelectCategory/SelectCategory.esm.js

@@ -0,0 +1,84 @@
+import { jsx } from 'react/jsx-runtime';
+import { useAsyncList, Select } from '@backstage/ui';
+import { useMemo, useRef, useEffect } from 'react';
+import { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters.esm.js';
+import { policyReporterApiRef } from '../../api/PolicyReporterClient.esm.js';
+import { useApi, toastApiRef } from '@backstage/frontend-plugin-api';
+
+const SelectCategory = () => {
+  const { filter, updateFilter, environment, context } = usePolicyReportsFilters();
+  const api = useApi(policyReporterApiRef);
+  const toast = useApi(toastApiRef);
+  const categoryOptions = useAsyncList({
+    async load({}) {
+      if (!environment) return { items: [] };
+      const request = { query: { environment } };
+      const response = context === "cluster" ? await api.getClusterCategories(request) : await api.getCategories(request);
+      const result = await response.json();
+      if (!response.ok) {
+        toast.post({
+          title: "Failed to fetch categories",
+          description: result.error || response.statusText || `Request failed with status ${response.status}`,
+          status: "danger"
+        });
+        return { items: [] };
+      }
+      return {
+        items: result.map((c) => ({ id: c, label: c }))
+      };
+    }
+  });
+  const categories = useMemo(() => {
+    if (categoryOptions.isLoading || categoryOptions.items.length === 0) {
+      return void 0;
+    }
+    return new Set(categoryOptions.items.map((c) => c.label));
+  }, [categoryOptions.isLoading, categoryOptions.items]);
+  const categoryRef = useRef(categoryOptions);
+  categoryRef.current = categoryOptions;
+  useEffect(() => {
+    categoryRef.current.reload();
+  }, [environment, context]);
+  const selectedCategories = filter.categories ?? [];
+  const selectedCategoriesRef = useRef(selectedCategories);
+  selectedCategoriesRef.current = selectedCategories;
+  useEffect(() => {
+    if (!categories) return;
+    const selected = selectedCategoriesRef.current;
+    if (selected.every((category) => categories.has(category))) return;
+    updateFilter({
+      categories: selected.filter((category) => categories.has(category))
+    });
+  }, [categories, updateFilter]);
+  const handleChange = (key) => {
+    if (key === null) {
+      updateFilter({ categories: [] });
+      return;
+    }
+    if (!categories) return;
+    if (!Array.isArray(key)) {
+      updateFilter({
+        categories: categories.has(key) ? [key] : []
+      });
+      return;
+    }
+    const filtered = key.filter(
+      (item) => categories.has(item)
+    );
+    updateFilter({ categories: filtered });
+  };
+  return /* @__PURE__ */ jsx(
+    Select,
+    {
+      label: "Category",
+      selectionMode: "multiple",
+      options: categoryOptions,
+      value: selectedCategories,
+      onChange: handleChange,
+      placeholder: "All"
+    }
+  );
+};
+
+export { SelectCategory };
+//# sourceMappingURL=SelectCategory.esm.js.map

package/dist/components/SelectCategory/SelectCategory.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectCategory.esm.js","sources":["../../../src/components/SelectCategory/SelectCategory.tsx"],"sourcesContent":["import { IdentifiedOption, Select, useAsyncList } from '@backstage/ui';\nimport { Key, useEffect, useMemo, useRef } from 'react';\nimport { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters';\nimport { policyReporterApiRef } from '../../api';\nimport { toastApiRef, useApi } from '@backstage/frontend-plugin-api';\nimport { RequestError } from '@kyverno/backstage-plugin-policy-reporter-common';\n\nexport const SelectCategory = () => {\n  const { filter, updateFilter, environment, context } =\n    usePolicyReportsFilters();\n  const api = useApi(policyReporterApiRef);\n  const toast = useApi(toastApiRef);\n\n  const categoryOptions = useAsyncList<IdentifiedOption>({\n    async load({}) {\n      if (!environment) return { items: [] };\n      const request = { query: { environment } };\n      const response =\n        context === 'cluster'\n          ? await api.getClusterCategories(request)\n          : await api.getCategories(request);\n      const result = await response.json();\n\n      if (!response.ok) {\n        toast.post({\n          title: 'Failed to fetch categories',\n          description:\n            (result as unknown as RequestError).error ||\n            response.statusText ||\n            `Request failed with status ${response.status}`,\n          status: 'danger',\n        });\n        return { items: [] };\n      }\n\n      return {\n        items: result.map(c => ({ id: c, label: c })),\n      };\n    },\n  });\n\n  const categories = useMemo(() => {\n    if (categoryOptions.isLoading || categoryOptions.items.length === 0) {\n      return undefined;\n    }\n\n    return new Set(categoryOptions.items.map(c => c.label));\n  }, [categoryOptions.isLoading, categoryOptions.items]);\n\n  // useRef to avoid dependency on the useAsyncList result\n  const categoryRef = useRef(categoryOptions);\n  categoryRef.current = categoryOptions;\n\n  // Fetch sources again after changes to the environment\n  useEffect(() => {\n    categoryRef.current.reload();\n  }, [environment, context]);\n\n  const selectedCategories = filter.categories ?? [];\n\n  // Keep a ref so the effect can read the latest selection without making it\n  // a dependency — the effect should only trigger when available sources change.\n  const selectedCategoriesRef = useRef(selectedCategories);\n  selectedCategoriesRef.current = selectedCategories;\n\n  useEffect(() => {\n    if (!categories) return;\n\n    const selected = selectedCategoriesRef.current;\n\n    if (selected.every(category => categories.has(category))) return;\n\n    updateFilter({\n      categories: selected.filter(category => categories.has(category)),\n    });\n  }, [categories, updateFilter]);\n\n  const handleChange = (key: Key | Key[] | null) => {\n    if (key === null) {\n      updateFilter({ categories: [] });\n      return;\n    }\n\n    if (!categories) return;\n\n    if (!Array.isArray(key)) {\n      updateFilter({\n        categories: categories.has(key as string) ? [key as string] : [],\n      });\n      return;\n    }\n\n    const filtered = key.filter((item): item is string =>\n      categories.has(item as string),\n    );\n    updateFilter({ categories: filtered });\n  };\n\n  return (\n    <Select\n      label=\"Category\"\n      selectionMode=\"multiple\"\n      options={categoryOptions}\n      value={selectedCategories}\n      onChange={handleChange}\n      placeholder=\"All\"\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAOO,MAAM,iBAAiB,MAAM;AAClC,EAAA,MAAM,EAAE,MAAA,EAAQ,YAAA,EAAc,WAAA,EAAa,OAAA,KACzC,uBAAA,EAAwB;AAC1B,EAAA,MAAM,GAAA,GAAM,OAAO,oBAAoB,CAAA;AACvC,EAAA,MAAM,KAAA,GAAQ,OAAO,WAAW,CAAA;AAEhC,EAAA,MAAM,kBAAkB,YAAA,CAA+B;AAAA,IACrD,MAAM,IAAA,CAAK,EAAC,EAAG;AACb,MAAA,IAAI,CAAC,WAAA,EAAa,OAAO,EAAE,KAAA,EAAO,EAAC,EAAE;AACrC,MAAA,MAAM,OAAA,GAAU,EAAE,KAAA,EAAO,EAAE,aAAY,EAAE;AACzC,MAAA,MAAM,QAAA,GACJ,OAAA,KAAY,SAAA,GACR,MAAM,GAAA,CAAI,oBAAA,CAAqB,OAAO,CAAA,GACtC,MAAM,GAAA,CAAI,aAAA,CAAc,OAAO,CAAA;AACrC,MAAA,MAAM,MAAA,GAAS,MAAM,QAAA,CAAS,IAAA,EAAK;AAEnC,MAAA,IAAI,CAAC,SAAS,EAAA,EAAI;AAChB,QAAA,KAAA,CAAM,IAAA,CAAK;AAAA,UACT,KAAA,EAAO,4BAAA;AAAA,UACP,aACG,MAAA,CAAmC,KAAA,IACpC,SAAS,UAAA,IACT,CAAA,2BAAA,EAA8B,SAAS,MAAM,CAAA,CAAA;AAAA,UAC/C,MAAA,EAAQ;AAAA,SACT,CAAA;AACD,QAAA,OAAO,EAAE,KAAA,EAAO,EAAC,EAAE;AAAA,MACrB;AAEA,MAAA,OAAO;AAAA,QACL,KAAA,EAAO,OAAO,GAAA,CAAI,CAAA,CAAA,MAAM,EAAE,EAAA,EAAI,CAAA,EAAG,KAAA,EAAO,CAAA,EAAE,CAAE;AAAA,OAC9C;AAAA,IACF;AAAA,GACD,CAAA;AAED,EAAA,MAAM,UAAA,GAAa,QAAQ,MAAM;AAC/B,IAAA,IAAI,eAAA,CAAgB,SAAA,IAAa,eAAA,CAAgB,KAAA,CAAM,WAAW,CAAA,EAAG;AACnE,MAAA,OAAO,MAAA;AAAA,IACT;AAEA,IAAA,OAAO,IAAI,IAAI,eAAA,CAAgB,KAAA,CAAM,IAAI,CAAA,CAAA,KAAK,CAAA,CAAE,KAAK,CAAC,CAAA;AAAA,EACxD,GAAG,CAAC,eAAA,CAAgB,SAAA,EAAW,eAAA,CAAgB,KAAK,CAAC,CAAA;AAGrD,EAAA,MAAM,WAAA,GAAc,OAAO,eAAe,CAAA;AAC1C,EAAA,WAAA,CAAY,OAAA,GAAU,eAAA;AAGtB,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,WAAA,CAAY,QAAQ,MAAA,EAAO;AAAA,EAC7B,CAAA,EAAG,CAAC,WAAA,EAAa,OAAO,CAAC,CAAA;AAEzB,EAAA,MAAM,kBAAA,GAAqB,MAAA,CAAO,UAAA,IAAc,EAAC;AAIjD,EAAA,MAAM,qBAAA,GAAwB,OAAO,kBAAkB,CAAA;AACvD,EAAA,qBAAA,CAAsB,OAAA,GAAU,kBAAA;AAEhC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,UAAA,EAAY;AAEjB,IAAA,MAAM,WAAW,qBAAA,CAAsB,OAAA;AAEvC,IAAA,IAAI,SAAS,KAAA,CAAM,CAAA,QAAA,KAAY,WAAW,GAAA,CAAI,QAAQ,CAAC,CAAA,EAAG;AAE1D,IAAA,YAAA,CAAa;AAAA,MACX,YAAY,QAAA,CAAS,MAAA,CAAO,cAAY,UAAA,CAAW,GAAA,CAAI,QAAQ,CAAC;AAAA,KACjE,CAAA;AAAA,EACH,CAAA,EAAG,CAAC,UAAA,EAAY,YAAY,CAAC,CAAA;AAE7B,EAAA,MAAM,YAAA,GAAe,CAAC,GAAA,KAA4B;AAChD,IAAA,IAAI,QAAQ,IAAA,EAAM;AAChB,MAAA,YAAA,CAAa,EAAE,UAAA,EAAY,EAAC,EAAG,CAAA;AAC/B,MAAA;AAAA,IACF;AAEA,IAAA,IAAI,CAAC,UAAA,EAAY;AAEjB,IAAA,IAAI,CAAC,KAAA,CAAM,OAAA,CAAQ,GAAG,CAAA,EAAG;AACvB,MAAA,YAAA,CAAa;AAAA,QACX,UAAA,EAAY,WAAW,GAAA,CAAI,GAAa,IAAI,CAAC,GAAa,IAAI;AAAC,OAChE,CAAA;AACD,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,WAAW,GAAA,CAAI,MAAA;AAAA,MAAO,CAAC,IAAA,KAC3B,UAAA,CAAW,GAAA,CAAI,IAAc;AAAA,KAC/B;AACA,IAAA,YAAA,CAAa,EAAE,UAAA,EAAY,QAAA,EAAU,CAAA;AAAA,EACvC,CAAA;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAM,UAAA;AAAA,MACN,aAAA,EAAc,UAAA;AAAA,MACd,OAAA,EAAS,eAAA;AAAA,MACT,KAAA,EAAO,kBAAA;AAAA,MACP,QAAA,EAAU,YAAA;AAAA,MACV,WAAA,EAAY;AAAA;AAAA,GACd;AAEJ;;;;"}

package/dist/components/SelectKind/SelectKind.esm.js

@@ -0,0 +1,84 @@
+import { jsx } from 'react/jsx-runtime';
+import { useAsyncList, Select } from '@backstage/ui';
+import { useMemo, useRef, useEffect } from 'react';
+import { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters.esm.js';
+import { policyReporterApiRef } from '../../api/PolicyReporterClient.esm.js';
+import { useApi, toastApiRef } from '@backstage/frontend-plugin-api';
+
+const SelectKind = () => {
+  const { filter, updateFilter, environment, context } = usePolicyReportsFilters();
+  const api = useApi(policyReporterApiRef);
+  const toast = useApi(toastApiRef);
+  const kindOptions = useAsyncList({
+    async load({}) {
+      if (!environment) return { items: [] };
+      const request = { query: { environment } };
+      const response = context === "cluster" ? await api.getClusterKinds(request) : await api.getKinds(request);
+      const result = await response.json();
+      if (!response.ok) {
+        toast.post({
+          title: "Failed to fetch kinds",
+          description: result.error || response.statusText || `Request failed with status ${response.status}`,
+          status: "danger"
+        });
+        return { items: [] };
+      }
+      return {
+        items: result.map((k) => ({ id: k, label: k }))
+      };
+    }
+  });
+  const kinds = useMemo(() => {
+    if (kindOptions.isLoading || kindOptions.items.length === 0) {
+      return void 0;
+    }
+    return new Set(kindOptions.items.map((k) => k.label));
+  }, [kindOptions.isLoading, kindOptions.items]);
+  const kindRef = useRef(kindOptions);
+  kindRef.current = kindOptions;
+  useEffect(() => {
+    kindRef.current.reload();
+  }, [environment, context]);
+  const selectedKinds = filter.kinds ?? [];
+  const selectedKindsRef = useRef(selectedKinds);
+  selectedKindsRef.current = selectedKinds;
+  useEffect(() => {
+    if (!kinds) return;
+    const selected = selectedKindsRef.current;
+    if (selected.every((kind) => kinds.has(kind))) return;
+    updateFilter({
+      kinds: selected.filter((kind) => kinds.has(kind))
+    });
+  }, [kinds, updateFilter]);
+  const handleChange = (key) => {
+    if (key === null) {
+      updateFilter({ kinds: [] });
+      return;
+    }
+    if (!kinds) return;
+    if (!Array.isArray(key)) {
+      updateFilter({
+        kinds: kinds.has(key) ? [key] : []
+      });
+      return;
+    }
+    const filtered = key.filter(
+      (item) => kinds.has(item)
+    );
+    updateFilter({ kinds: filtered });
+  };
+  return /* @__PURE__ */ jsx(
+    Select,
+    {
+      label: "Kind",
+      selectionMode: "multiple",
+      options: kindOptions,
+      value: selectedKinds,
+      onChange: handleChange,
+      placeholder: "All"
+    }
+  );
+};
+
+export { SelectKind };
+//# sourceMappingURL=SelectKind.esm.js.map

package/dist/components/SelectKind/SelectKind.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectKind.esm.js","sources":["../../../src/components/SelectKind/SelectKind.tsx"],"sourcesContent":["import { IdentifiedOption, Select, useAsyncList } from '@backstage/ui';\nimport { Key, useEffect, useMemo, useRef } from 'react';\nimport { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters';\nimport { policyReporterApiRef } from '../../api';\nimport { toastApiRef, useApi } from '@backstage/frontend-plugin-api';\nimport { RequestError } from '@kyverno/backstage-plugin-policy-reporter-common';\n\nexport const SelectKind = () => {\n  const { filter, updateFilter, environment, context } =\n    usePolicyReportsFilters();\n  const api = useApi(policyReporterApiRef);\n  const toast = useApi(toastApiRef);\n\n  const kindOptions = useAsyncList<IdentifiedOption>({\n    async load({}) {\n      if (!environment) return { items: [] };\n      const request = { query: { environment } };\n      const response =\n        context === 'cluster'\n          ? await api.getClusterKinds(request)\n          : await api.getKinds(request);\n      const result = await response.json();\n\n      if (!response.ok) {\n        toast.post({\n          title: 'Failed to fetch kinds',\n          description:\n            (result as unknown as RequestError).error ||\n            response.statusText ||\n            `Request failed with status ${response.status}`,\n          status: 'danger',\n        });\n        return { items: [] };\n      }\n\n      return {\n        items: result.map((k: string) => ({ id: k, label: k })),\n      };\n    },\n  });\n\n  const kinds = useMemo(() => {\n    if (kindOptions.isLoading || kindOptions.items.length === 0) {\n      return undefined;\n    }\n\n    return new Set(kindOptions.items.map(k => k.label));\n  }, [kindOptions.isLoading, kindOptions.items]);\n\n  const kindRef = useRef(kindOptions);\n  kindRef.current = kindOptions;\n\n  useEffect(() => {\n    kindRef.current.reload();\n  }, [environment, context]);\n\n  const selectedKinds = filter.kinds ?? [];\n\n  const selectedKindsRef = useRef(selectedKinds);\n  selectedKindsRef.current = selectedKinds;\n\n  useEffect(() => {\n    if (!kinds) return;\n\n    const selected = selectedKindsRef.current;\n\n    if (selected.every(kind => kinds.has(kind))) return;\n\n    updateFilter({\n      kinds: selected.filter(kind => kinds.has(kind)),\n    });\n  }, [kinds, updateFilter]);\n\n  const handleChange = (key: Key | Key[] | null) => {\n    if (key === null) {\n      updateFilter({ kinds: [] });\n      return;\n    }\n\n    if (!kinds) return;\n\n    if (!Array.isArray(key)) {\n      updateFilter({\n        kinds: kinds.has(key as string) ? [key as string] : [],\n      });\n      return;\n    }\n\n    const filtered = key.filter((item): item is string =>\n      kinds.has(item as string),\n    );\n    updateFilter({ kinds: filtered });\n  };\n\n  return (\n    <Select\n      label=\"Kind\"\n      selectionMode=\"multiple\"\n      options={kindOptions}\n      value={selectedKinds}\n      onChange={handleChange}\n      placeholder=\"All\"\n    />\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/SelectNamespace/SelectNamespace.esm.js

@@ -1,25 +1,69 @@
 import { jsx } from 'react/jsx-runtime';
-import { Select } from '@backstage/ui';
+import { useAsyncList, Select } from '@backstage/ui';
+import { useMemo, useRef, useEffect } from 'react';
 import { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters.esm.js';
-import { useNamespaces } from '../../hooks/useNamespaces.esm.js';
+import { useApi, toastApiRef } from '@backstage/frontend-plugin-api';
+import { policyReporterApiRef } from '../../api/PolicyReporterClient.esm.js';
 
 const SelectNamespace = () => {
   const { filter, updateFilter, environment } = usePolicyReportsFilters();
-  const { namespaces: availableNamespaces } = useNamespaces(environment);
-  const options = availableNamespaces.map((ns) => ({ value: ns, label: ns }));
+  const api = useApi(policyReporterApiRef);
+  const toast = useApi(toastApiRef);
+  const namespaceOptions = useAsyncList({
+    async load({}) {
+      if (!environment) return { items: [] };
+      const response = await api.getNamespaces({ query: { environment } });
+      const result = await response.json();
+      if (!response.ok) {
+        toast.post({
+          title: "Failed to fetch namespaces",
+          description: result.error || response.statusText || `Request failed with status ${response.status}`,
+          status: "danger"
+        });
+        return { items: [] };
+      }
+      const namespaces2 = Array.isArray(result) ? result : [];
+      return {
+        items: namespaces2.map((ns) => ({ id: ns, label: ns }))
+      };
+    }
+  });
+  const namespaces = useMemo(() => {
+    if (namespaceOptions.isLoading || namespaceOptions.items.length === 0) {
+      return void 0;
+    }
+    return new Set(namespaceOptions.items.map((ns) => ns.label));
+  }, [namespaceOptions.isLoading, namespaceOptions.items]);
+  const namespacesRef = useRef(namespaceOptions);
+  namespacesRef.current = namespaceOptions;
+  useEffect(() => {
+    namespacesRef.current.reload();
+  }, [environment]);
+  const selectedNamespaces = filter.namespaces ?? [];
+  const selectedNamespacesRef = useRef(selectedNamespaces);
+  selectedNamespacesRef.current = selectedNamespaces;
+  useEffect(() => {
+    if (!namespaces) return;
+    const selected = selectedNamespacesRef.current;
+    if (selected.every((ns) => namespaces.has(ns))) return;
+    updateFilter({
+      namespaces: selected.filter((ns) => namespaces.has(ns))
+    });
+  }, [namespaces, updateFilter]);
   const handleChange = (key) => {
     if (key === null) {
       updateFilter({ namespaces: [] });
       return;
     }
+    if (!namespaces) return;
     if (!Array.isArray(key)) {
       updateFilter({
-        namespaces: availableNamespaces.includes(key) ? [key] : []
+        namespaces: namespaces.has(key) ? [key] : []
       });
       return;
     }
     const filtered = key.filter(
-      (item) => availableNamespaces.includes(item)
+      (item) => namespaces.has(item)
     );
     updateFilter({ namespaces: filtered });
   };
@@ -28,8 +72,8 @@ const SelectNamespace = () => {
     {
       label: "Namespace",
       selectionMode: "multiple",
-      options,
-      value: filter.namespaces ?? [],
+      options: namespaceOptions,
+      value: selectedNamespaces,
       onChange: handleChange,
       placeholder: "All"
     }

package/dist/components/SelectNamespace/SelectNamespace.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectNamespace.esm.js","sources":["../../../src/components/SelectNamespace/SelectNamespace.tsx"],"sourcesContent":["import { Select } from '@backstage/ui';\nimport { Key } from 'react';\nimport { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters';\nimport { useNamespaces } from '../../hooks/useNamespaces';\n\nexport const SelectNamespace = () => {\n  const { filter, updateFilter, environment } = usePolicyReportsFilters();\n  const { namespaces: availableNamespaces } = useNamespaces(environment);\n\n  const options = availableNamespaces.map(ns => ({ value: ns, label: ns }));\n\n  const handleChange = (key: Key | Key[] | null) => {\n    if (key === null) {\n      updateFilter({ namespaces: [] });\n      return;\n    }\n\n    if (!Array.isArray(key)) {\n      updateFilter({\n        namespaces: availableNamespaces.includes(key as string)\n          ? [key as string]\n          : [],\n      });\n      return;\n    }\n\n    const filtered = key.filter((item): item is string =>\n      availableNamespaces.includes(item as string),\n    );\n    updateFilter({ namespaces: filtered });\n  };\n\n  return (\n    <Select\n      label=\"Namespace\"\n      selectionMode=\"multiple\"\n      options={options}\n      value={filter.namespaces ?? []}\n      onChange={handleChange}\n      placeholder=\"All\"\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;AAKO,MAAM,kBAAkB,MAAM;AACnC,EAAA,MAAM,EAAE,MAAA,EAAQ,YAAA,EAAc,WAAA,KAAgB,uBAAA,EAAwB;AACtE,EAAA,MAAM,EAAE,UAAA,EAAY,mBAAA,EAAoB,GAAI,cAAc,WAAW,CAAA;AAErE,EAAA,MAAM,OAAA,GAAU,oBAAoB,GAAA,CAAI,CAAA,EAAA,MAAO,EAAE,KAAA,EAAO,EAAA,EAAI,KAAA,EAAO,EAAA,EAAG,CAAE,CAAA;AAExE,EAAA,MAAM,YAAA,GAAe,CAAC,GAAA,KAA4B;AAChD,IAAA,IAAI,QAAQ,IAAA,EAAM;AAChB,MAAA,YAAA,CAAa,EAAE,UAAA,EAAY,EAAC,EAAG,CAAA;AAC/B,MAAA;AAAA,IACF;AAEA,IAAA,IAAI,CAAC,KAAA,CAAM,OAAA,CAAQ,GAAG,CAAA,EAAG;AACvB,MAAA,YAAA,CAAa;AAAA,QACX,UAAA,EAAY,oBAAoB,QAAA,CAAS,GAAa,IAClD,CAAC,GAAa,IACd;AAAC,OACN,CAAA;AACD,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,WAAW,GAAA,CAAI,MAAA;AAAA,MAAO,CAAC,IAAA,KAC3B,mBAAA,CAAoB,QAAA,CAAS,IAAc;AAAA,KAC7C;AACA,IAAA,YAAA,CAAa,EAAE,UAAA,EAAY,QAAA,EAAU,CAAA;AAAA,EACvC,CAAA;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAM,WAAA;AAAA,MACN,aAAA,EAAc,UAAA;AAAA,MACd,OAAA;AAAA,MACA,KAAA,EAAO,MAAA,CAAO,UAAA,IAAc,EAAC;AAAA,MAC7B,QAAA,EAAU,YAAA;AAAA,MACV,WAAA,EAAY;AAAA;AAAA,GACd;AAEJ;;;;"}
+{"version":3,"file":"SelectNamespace.esm.js","sources":["../../../src/components/SelectNamespace/SelectNamespace.tsx"],"sourcesContent":["import { IdentifiedOption, Select, useAsyncList } from '@backstage/ui';\nimport { Key, useEffect, useMemo, useRef } from 'react';\nimport { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters';\nimport { toastApiRef, useApi } from '@backstage/frontend-plugin-api';\nimport { policyReporterApiRef } from '../../api';\nimport { RequestError } from '@kyverno/backstage-plugin-policy-reporter-common';\n\nexport const SelectNamespace = () => {\n  const { filter, updateFilter, environment } = usePolicyReportsFilters();\n  const api = useApi(policyReporterApiRef);\n  const toast = useApi(toastApiRef);\n\n  const namespaceOptions = useAsyncList<IdentifiedOption>({\n    async load({}) {\n      if (!environment) return { items: [] };\n      const response = await api.getNamespaces({ query: { environment } });\n      const result = await response.json();\n\n      if (!response.ok) {\n        toast.post({\n          title: 'Failed to fetch namespaces',\n          description:\n            (result as unknown as RequestError).error ||\n            response.statusText ||\n            `Request failed with status ${response.status}`,\n          status: 'danger',\n        });\n        return { items: [] };\n      }\n\n      const namespaces = Array.isArray(result) ? result : [];\n\n      return {\n        items: namespaces.map(ns => ({ id: ns, label: ns })),\n      };\n    },\n  });\n\n  const namespaces = useMemo(() => {\n    if (namespaceOptions.isLoading || namespaceOptions.items.length === 0) {\n      return undefined;\n    }\n\n    return new Set(namespaceOptions.items.map(ns => ns.label));\n  }, [namespaceOptions.isLoading, namespaceOptions.items]);\n\n  // useRef to avoid dependency on the useAsyncList result\n  const namespacesRef = useRef(namespaceOptions);\n  namespacesRef.current = namespaceOptions;\n\n  // Fetch namespaces again after changes to the environment\n  useEffect(() => {\n    namespacesRef.current.reload();\n  }, [environment]);\n\n  const selectedNamespaces = filter.namespaces ?? [];\n\n  // Keep a ref so the effect can read the latest selection without making it\n  // a dependency — the effect should only trigger when available namespaces change.\n  const selectedNamespacesRef = useRef(selectedNamespaces);\n  selectedNamespacesRef.current = selectedNamespaces;\n\n  useEffect(() => {\n    if (!namespaces) return;\n\n    const selected = selectedNamespacesRef.current;\n\n    if (selected.every(ns => namespaces.has(ns))) return;\n\n    updateFilter({\n      namespaces: selected.filter(ns => namespaces.has(ns)),\n    });\n  }, [namespaces, updateFilter]);\n\n  const handleChange = (key: Key | Key[] | null) => {\n    if (key === null) {\n      updateFilter({ namespaces: [] });\n      return;\n    }\n\n    if (!namespaces) return;\n\n    if (!Array.isArray(key)) {\n      updateFilter({\n        namespaces: namespaces.has(key as string) ? [key as string] : [],\n      });\n      return;\n    }\n\n    const filtered = key.filter((item): item is string =>\n      namespaces.has(item as string),\n    );\n    updateFilter({ namespaces: filtered });\n  };\n\n  return (\n    <Select\n      label=\"Namespace\"\n      selectionMode=\"multiple\"\n      options={namespaceOptions}\n      value={selectedNamespaces}\n      onChange={handleChange}\n      placeholder=\"All\"\n    />\n  );\n};\n"],"names":["namespaces"],"mappings":"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"}

package/dist/components/SelectPolicy/SelectPolicy.esm.js

@@ -0,0 +1,84 @@
+import { jsx } from 'react/jsx-runtime';
+import { useAsyncList, Select } from '@backstage/ui';
+import { useMemo, useRef, useEffect } from 'react';
+import { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters.esm.js';
+import { policyReporterApiRef } from '../../api/PolicyReporterClient.esm.js';
+import { useApi, toastApiRef } from '@backstage/frontend-plugin-api';
+
+const SelectPolicy = () => {
+  const { filter, updateFilter, environment, context } = usePolicyReportsFilters();
+  const api = useApi(policyReporterApiRef);
+  const toast = useApi(toastApiRef);
+  const policyOptions = useAsyncList({
+    async load({}) {
+      if (!environment) return { items: [] };
+      const request = { query: { environment } };
+      const response = context === "cluster" ? await api.getClusterPolicies(request) : await api.getPolicies(request);
+      const result = await response.json();
+      if (!response.ok) {
+        toast.post({
+          title: "Failed to fetch policies",
+          description: result.error || response.statusText || `Request failed with status ${response.status}`,
+          status: "danger"
+        });
+        return { items: [] };
+      }
+      return {
+        items: result.map((s) => ({ id: s, label: s }))
+      };
+    }
+  });
+  const policies = useMemo(() => {
+    if (policyOptions.isLoading || policyOptions.items.length === 0) {
+      return void 0;
+    }
+    return new Set(policyOptions.items.map((s) => s.label));
+  }, [policyOptions.items, policyOptions.isLoading]);
+  const policyRef = useRef(policyOptions);
+  policyRef.current = policyOptions;
+  useEffect(() => {
+    policyRef.current.reload();
+  }, [environment, context]);
+  const selectedPolicies = filter.policies ?? [];
+  const selectedPoliciesRef = useRef(selectedPolicies);
+  selectedPoliciesRef.current = selectedPolicies;
+  useEffect(() => {
+    if (!policies) return;
+    const selected = selectedPoliciesRef.current;
+    if (selected.every((policy) => policies.has(policy))) return;
+    updateFilter({
+      policies: selected.filter((policy) => policies.has(policy))
+    });
+  }, [policies, updateFilter]);
+  const handleChange = (key) => {
+    if (!policies) return;
+    if (key === null) {
+      updateFilter({ policies: [] });
+      return;
+    }
+    if (!Array.isArray(key)) {
+      updateFilter({
+        policies: policies.has(key) ? [key] : []
+      });
+      return;
+    }
+    const filtered = key.filter(
+      (item) => policies.has(item)
+    );
+    updateFilter({ policies: filtered });
+  };
+  return /* @__PURE__ */ jsx(
+    Select,
+    {
+      label: "Policy",
+      selectionMode: "multiple",
+      options: policyOptions,
+      value: selectedPolicies,
+      onChange: handleChange,
+      placeholder: "All"
+    }
+  );
+};
+
+export { SelectPolicy };
+//# sourceMappingURL=SelectPolicy.esm.js.map

package/dist/components/SelectPolicy/SelectPolicy.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectPolicy.esm.js","sources":["../../../src/components/SelectPolicy/SelectPolicy.tsx"],"sourcesContent":["import { IdentifiedOption, Select, useAsyncList } from '@backstage/ui';\nimport { Key, useEffect, useMemo, useRef } from 'react';\nimport { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters';\nimport { policyReporterApiRef } from '../../api';\nimport { toastApiRef, useApi } from '@backstage/frontend-plugin-api';\nimport { RequestError } from '@kyverno/backstage-plugin-policy-reporter-common';\n\nexport const SelectPolicy = () => {\n  const { filter, updateFilter, environment, context } =\n    usePolicyReportsFilters();\n  const api = useApi(policyReporterApiRef);\n  const toast = useApi(toastApiRef);\n\n  const policyOptions = useAsyncList<IdentifiedOption>({\n    async load({}) {\n      if (!environment) return { items: [] };\n      const request = { query: { environment } };\n      const response =\n        context === 'cluster'\n          ? await api.getClusterPolicies(request)\n          : await api.getPolicies(request);\n      const result = await response.json();\n\n      if (!response.ok) {\n        toast.post({\n          title: 'Failed to fetch policies',\n          description:\n            (result as unknown as RequestError).error ||\n            response.statusText ||\n            `Request failed with status ${response.status}`,\n          status: 'danger',\n        });\n        return { items: [] };\n      }\n\n      return {\n        items: result.map(s => ({ id: s, label: s })),\n      };\n    },\n  });\n\n  const policies = useMemo(() => {\n    if (policyOptions.isLoading || policyOptions.items.length === 0) {\n      return undefined;\n    }\n\n    return new Set(policyOptions.items.map(s => s.label));\n  }, [policyOptions.items, policyOptions.isLoading]);\n\n  // useRef to avoid dependency on the useAsyncList result\n  const policyRef = useRef(policyOptions);\n  policyRef.current = policyOptions;\n\n  // Fetch policies again after changes to the environment\n  useEffect(() => {\n    policyRef.current.reload();\n  }, [environment, context]);\n\n  const selectedPolicies = filter.policies ?? [];\n\n  // Keep a ref so the effect can read the latest selection without making it\n  // a dependency — the effect should only trigger when available policies change.\n  const selectedPoliciesRef = useRef(selectedPolicies);\n  selectedPoliciesRef.current = selectedPolicies;\n\n  useEffect(() => {\n    if (!policies) return;\n    const selected = selectedPoliciesRef.current;\n\n    if (selected.every(policy => policies.has(policy))) return;\n\n    updateFilter({\n      policies: selected.filter(policy => policies.has(policy)),\n    });\n  }, [policies, updateFilter]);\n\n  const handleChange = (key: Key | Key[] | null) => {\n    if (!policies) return;\n\n    if (key === null) {\n      updateFilter({ policies: [] });\n      return;\n    }\n\n    if (!Array.isArray(key)) {\n      updateFilter({\n        policies: policies.has(key as string) ? [key as string] : [],\n      });\n      return;\n    }\n\n    const filtered = key.filter((item): item is string =>\n      policies.has(item as string),\n    );\n    updateFilter({ policies: filtered });\n  };\n\n  return (\n    <Select\n      label=\"Policy\"\n      selectionMode=\"multiple\"\n      options={policyOptions}\n      value={selectedPolicies}\n      onChange={handleChange}\n      placeholder=\"All\"\n    />\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/SelectSource/SelectSource.esm.js

@@ -0,0 +1,84 @@
+import { jsx } from 'react/jsx-runtime';
+import { useAsyncList, Select } from '@backstage/ui';
+import { useMemo, useRef, useEffect } from 'react';
+import { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters.esm.js';
+import { policyReporterApiRef } from '../../api/PolicyReporterClient.esm.js';
+import { useApi, toastApiRef } from '@backstage/frontend-plugin-api';
+
+const SelectSource = () => {
+  const { filter, updateFilter, environment, context } = usePolicyReportsFilters();
+  const api = useApi(policyReporterApiRef);
+  const toast = useApi(toastApiRef);
+  const sourceOptions = useAsyncList({
+    async load({}) {
+      if (!environment) return { items: [] };
+      const request = { query: { environment } };
+      const response = context === "cluster" ? await api.getClusterSources(request) : await api.getSources(request);
+      const result = await response.json();
+      if (!response.ok) {
+        toast.post({
+          title: "Failed to fetch sources",
+          description: result.error || response.statusText || `Request failed with status ${response.status}`,
+          status: "danger"
+        });
+        return { items: [] };
+      }
+      return {
+        items: result.map((s) => ({ id: s, label: s }))
+      };
+    }
+  });
+  const sources = useMemo(() => {
+    if (sourceOptions.isLoading || sourceOptions.items.length === 0) {
+      return void 0;
+    }
+    return new Set(sourceOptions.items.map((s) => s.label));
+  }, [sourceOptions.items, sourceOptions.isLoading]);
+  const sourceRef = useRef(sourceOptions);
+  sourceRef.current = sourceOptions;
+  useEffect(() => {
+    sourceRef.current.reload();
+  }, [environment, context]);
+  const selectedSources = filter.sources ?? [];
+  const selectedSourcesRef = useRef(selectedSources);
+  selectedSourcesRef.current = selectedSources;
+  useEffect(() => {
+    if (!sources) return;
+    const selected = selectedSourcesRef.current;
+    if (selected.every((source) => sources.has(source))) return;
+    updateFilter({
+      sources: selected.filter((source) => sources.has(source))
+    });
+  }, [sources, updateFilter]);
+  const handleChange = (key) => {
+    if (!sources) return;
+    if (key === null) {
+      updateFilter({ sources: [] });
+      return;
+    }
+    if (!Array.isArray(key)) {
+      updateFilter({
+        sources: sources.has(key) ? [key] : []
+      });
+      return;
+    }
+    const filtered = key.filter(
+      (item) => sources.has(item)
+    );
+    updateFilter({ sources: filtered });
+  };
+  return /* @__PURE__ */ jsx(
+    Select,
+    {
+      label: "Source",
+      selectionMode: "multiple",
+      options: sourceOptions,
+      value: selectedSources,
+      onChange: handleChange,
+      placeholder: "All"
+    }
+  );
+};
+
+export { SelectSource };
+//# sourceMappingURL=SelectSource.esm.js.map

package/dist/components/SelectSource/SelectSource.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectSource.esm.js","sources":["../../../src/components/SelectSource/SelectSource.tsx"],"sourcesContent":["import { IdentifiedOption, Select, useAsyncList } from '@backstage/ui';\nimport { Key, useEffect, useMemo, useRef } from 'react';\nimport { usePolicyReportsFilters } from '../../hooks/usePolicyReportsFilters';\nimport { policyReporterApiRef } from '../../api';\nimport { toastApiRef, useApi } from '@backstage/frontend-plugin-api';\nimport { RequestError } from '@kyverno/backstage-plugin-policy-reporter-common';\n\nexport const SelectSource = () => {\n  const { filter, updateFilter, environment, context } =\n    usePolicyReportsFilters();\n  const api = useApi(policyReporterApiRef);\n  const toast = useApi(toastApiRef);\n\n  const sourceOptions = useAsyncList<IdentifiedOption>({\n    async load({}) {\n      if (!environment) return { items: [] };\n      const request = { query: { environment } };\n      const response =\n        context === 'cluster'\n          ? await api.getClusterSources(request)\n          : await api.getSources(request);\n      const result = await response.json();\n\n      if (!response.ok) {\n        toast.post({\n          title: 'Failed to fetch sources',\n          description:\n            (result as unknown as RequestError).error ||\n            response.statusText ||\n            `Request failed with status ${response.status}`,\n          status: 'danger',\n        });\n        return { items: [] };\n      }\n\n      return {\n        items: result.map(s => ({ id: s, label: s })),\n      };\n    },\n  });\n\n  const sources = useMemo(() => {\n    if (sourceOptions.isLoading || sourceOptions.items.length === 0) {\n      return undefined;\n    }\n    return new Set(sourceOptions.items.map(s => s.label));\n  }, [sourceOptions.items, sourceOptions.isLoading]);\n\n  // useRef to avoid dependency on the useAsyncList result\n  const sourceRef = useRef(sourceOptions);\n  sourceRef.current = sourceOptions;\n\n  // Fetch sources again after changes to the environment\n  useEffect(() => {\n    sourceRef.current.reload();\n  }, [environment, context]);\n\n  const selectedSources = filter.sources ?? [];\n\n  // Keep a ref so the effect can read the latest selection without making it\n  // a dependency — the effect should only trigger when available sources change.\n  const selectedSourcesRef = useRef(selectedSources);\n  selectedSourcesRef.current = selectedSources;\n\n  useEffect(() => {\n    if (!sources) return;\n    const selected = selectedSourcesRef.current;\n\n    if (selected.every(source => sources.has(source))) return;\n\n    updateFilter({\n      sources: selected.filter(source => sources.has(source)),\n    });\n  }, [sources, updateFilter]);\n\n  const handleChange = (key: Key | Key[] | null) => {\n    if (!sources) return;\n\n    if (key === null) {\n      updateFilter({ sources: [] });\n      return;\n    }\n\n    if (!Array.isArray(key)) {\n      updateFilter({\n        sources: sources.has(key as string) ? [key as string] : [],\n      });\n      return;\n    }\n\n    const filtered = key.filter((item): item is string =>\n      sources.has(item as string),\n    );\n    updateFilter({ sources: filtered });\n  };\n\n  return (\n    <Select\n      label=\"Source\"\n      selectionMode=\"multiple\"\n      options={sourceOptions}\n      value={selectedSources}\n      onChange={handleChange}\n      placeholder=\"All\"\n    />\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/hooks/usePolicyReportsFilters.esm.js

@@ -1,13 +1,14 @@
 import { jsx } from 'react/jsx-runtime';
 import qs from 'qs';
-import { useMemo, useCallback, useLayoutEffect, createContext, useContext } from 'react';
+import { useMemo, useRef, useCallback, useLayoutEffect, createContext, useContext } from 'react';
 import { useSearchParams } from 'react-router-dom';
 
 const PolicyReportsFiltersContext = createContext(void 0);
 const PolicyReportsFiltersProvider = ({
   children,
   defaultFilters,
-  defaultEnvironment
+  defaultEnvironment,
+  context
 }) => {
   const [searchParams, setSearchParams] = useSearchParams();
   const parsed = useMemo(
@@ -26,9 +27,11 @@ const PolicyReportsFiltersProvider = ({
     () => urlEnvironment ?? defaultEnvironment,
     [urlEnvironment, defaultEnvironment]
   );
+  const setSearchParamsRef = useRef(setSearchParams);
+  setSearchParamsRef.current = setSearchParams;
   const updateParams = useCallback(
     (update) => {
-      setSearchParams(
+      setSearchParamsRef.current(
         (prev) => {
           const prevParsed = qs.parse(prev.toString());
           const next = typeof update === "function" ? update(prevParsed) : update;
@@ -40,7 +43,7 @@ const PolicyReportsFiltersProvider = ({
         { replace: true }
       );
     },
-    [setSearchParams]
+    []
   );
   useLayoutEffect(() => {
     if (!urlEnvironment) {
@@ -49,7 +52,7 @@ const PolicyReportsFiltersProvider = ({
         environment: defaultEnvironment
       });
     }
-  }, [defaultEnvironment, urlEnvironment, defaultFilters]);
+  }, [defaultEnvironment, urlEnvironment, defaultFilters, updateParams]);
   const updateFilter = useCallback(
     (update) => {
       updateParams((prev) => ({
@@ -70,9 +73,10 @@ const PolicyReportsFiltersProvider = ({
       filter,
       updateFilter,
       environment,
-      setEnvironment
+      setEnvironment,
+      context
     }),
-    [filter, updateFilter, environment, setEnvironment]
+    [filter, updateFilter, environment, setEnvironment, context]
   );
   return /* @__PURE__ */ jsx(PolicyReportsFiltersContext.Provider, { value, children });
 };

package/dist/hooks/usePolicyReportsFilters.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePolicyReportsFilters.esm.js","sources":["../../src/hooks/usePolicyReportsFilters.tsx"],"sourcesContent":["import qs from 'qs';\nimport {\n  createContext,\n  PropsWithChildren,\n  useCallback,\n  useContext,\n  useLayoutEffect,\n  useMemo,\n} from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport type { Filter } from '@kyverno/backstage-plugin-policy-reporter-common';\n\nexport type PolicyReportsFiltersContextValue = {\n  filter: Filter;\n  updateFilter: (update: Partial<Filter>) => void;\n  environment: string;\n  setEnvironment: (entityRef: string) => void;\n};\n\nconst PolicyReportsFiltersContext = createContext<\n  PolicyReportsFiltersContextValue | undefined\n>(undefined);\n\nexport type PolicyReportsFiltersProviderProps = PropsWithChildren<{\n  /**\n   * Default filter values written to the URL\n   */\n  defaultFilters?: Partial<Filter>;\n  /**\n   * The entityRef of the environment to use\n   * when no ?environment= param is present in the URL.\n   */\n  defaultEnvironment: string;\n}>;\n\n/**\n * Provides shared filter state and selected environment for all policy report\n * filter components.\n */\nexport const PolicyReportsFiltersProvider = ({\n  children,\n  defaultFilters,\n  defaultEnvironment,\n}: PolicyReportsFiltersProviderProps) => {\n  const [searchParams, setSearchParams] = useSearchParams();\n\n  const parsed = useMemo(\n    () => qs.parse(searchParams.toString()),\n    [searchParams],\n  );\n\n  const urlEnvironment = useMemo(\n    () => parsed.environment?.toString(),\n    [parsed],\n  );\n\n  // Use defaultFilters until the URL has been initialised (urlEnvironment set).\n  // After that, always read from the URL so an explicit empty filter is valid.\n  const filter = useMemo(\n    () =>\n      urlEnvironment ? ((parsed.filter ?? {}) as Filter) : defaultFilters ?? {},\n    [parsed, urlEnvironment, defaultFilters],\n  );\n\n  const environment = useMemo(\n    () => urlEnvironment ?? defaultEnvironment,\n    [urlEnvironment, defaultEnvironment],\n  );\n\n  const updateParams = useCallback(\n    (\n      update:\n        | Record<string, unknown>\n        | ((prev: Record<string, unknown>) => Record<string, unknown>),\n    ) => {\n      setSearchParams(\n        prev => {\n          const prevParsed = qs.parse(prev.toString());\n          const next =\n            typeof update === 'function' ? update(prevParsed) : update;\n          return qs.stringify(next, {\n            arrayFormat: 'indices',\n            skipNulls: true,\n          });\n        },\n        { replace: true },\n      );\n    },\n    [setSearchParams],\n  );\n\n  useLayoutEffect(() => {\n    if (!urlEnvironment) {\n      updateParams({\n        filter: defaultFilters,\n        environment: defaultEnvironment,\n      });\n    }\n    // setSearchParams isn't stable, hence disabling the exhaustive-deps check\n    // for more info please visit https://github.com/remix-run/react-router/issues/9991\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [defaultEnvironment, urlEnvironment, defaultFilters]);\n\n  const updateFilter = useCallback(\n    (update: Partial<Filter>) => {\n      updateParams(prev => ({\n        ...prev,\n        filter: { ...(prev.filter as object), ...update },\n      }));\n    },\n    [updateParams],\n  );\n\n  const setEnvironment = useCallback(\n    (entityRef: string) => {\n      updateParams(prev => ({ ...prev, environment: entityRef }));\n    },\n    [updateParams],\n  );\n\n  const value = useMemo(\n    () => ({\n      filter,\n      updateFilter,\n      environment,\n      setEnvironment,\n    }),\n    [filter, updateFilter, environment, setEnvironment],\n  );\n\n  return (\n    <PolicyReportsFiltersContext.Provider value={value}>\n      {children}\n    </PolicyReportsFiltersContext.Provider>\n  );\n};\n\n/**\n * Hook for reading and updating policy report filters and the selected\n * environment. Must be used within a PolicyReportsFiltersProvider.\n */\nexport const usePolicyReportsFilters = (): PolicyReportsFiltersContextValue => {\n  const ctx = useContext(PolicyReportsFiltersContext);\n  if (!ctx) {\n    throw new Error(\n      'usePolicyReportsFilters must be used within PolicyReportsFiltersProvider',\n    );\n  }\n  return ctx;\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"usePolicyReportsFilters.esm.js","sources":["../../src/hooks/usePolicyReportsFilters.tsx"],"sourcesContent":["import qs from 'qs';\nimport {\n  createContext,\n  PropsWithChildren,\n  useCallback,\n  useContext,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n} from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport type { Filter } from '@kyverno/backstage-plugin-policy-reporter-common';\n\nexport type PolicyReportsFiltersContextValue = {\n  filter: Filter;\n  context: 'cluster' | 'namespaced';\n  updateFilter: (update: Partial<Filter>) => void;\n  environment: string;\n  setEnvironment: (entityRef: string) => void;\n};\n\nconst PolicyReportsFiltersContext = createContext<\n  PolicyReportsFiltersContextValue | undefined\n>(undefined);\n\nexport type PolicyReportsFiltersProviderProps = PropsWithChildren<{\n  /**\n   * Default filter values written to the URL\n   */\n  defaultFilters?: Partial<Filter>;\n  /**\n   * The entityRef of the environment to use\n   * when no ?environment= param is present in the URL.\n   */\n  defaultEnvironment: string;\n  context: 'cluster' | 'namespaced';\n}>;\n\n/**\n * Provides shared filter state and selected environment for all policy report\n * filter components.\n */\nexport const PolicyReportsFiltersProvider = ({\n  children,\n  defaultFilters,\n  defaultEnvironment,\n  context,\n}: PolicyReportsFiltersProviderProps) => {\n  const [searchParams, setSearchParams] = useSearchParams();\n\n  const parsed = useMemo(\n    () => qs.parse(searchParams.toString()),\n    [searchParams],\n  );\n\n  const urlEnvironment = useMemo(\n    () => parsed.environment?.toString(),\n    [parsed],\n  );\n\n  // Use defaultFilters until the URL has been initialised (urlEnvironment set).\n  // After that, always read from the URL so an explicit empty filter is valid.\n  const filter = useMemo(\n    () =>\n      urlEnvironment ? ((parsed.filter ?? {}) as Filter) : defaultFilters ?? {},\n    [parsed, urlEnvironment, defaultFilters],\n  );\n\n  const environment = useMemo(\n    () => urlEnvironment ?? defaultEnvironment,\n    [urlEnvironment, defaultEnvironment],\n  );\n\n  // setSearchParams is not stable (https://github.com/remix-run/react-router/issues/9991),\n  // so we hold it in a ref to keep updateParams/updateFilter stable across renders.\n  const setSearchParamsRef = useRef(setSearchParams);\n  setSearchParamsRef.current = setSearchParams;\n\n  const updateParams = useCallback(\n    (\n      update:\n        | Record<string, unknown>\n        | ((prev: Record<string, unknown>) => Record<string, unknown>),\n    ) => {\n      setSearchParamsRef.current(\n        prev => {\n          const prevParsed = qs.parse(prev.toString());\n          const next =\n            typeof update === 'function' ? update(prevParsed) : update;\n          return qs.stringify(next, {\n            arrayFormat: 'indices',\n            skipNulls: true,\n          });\n        },\n        { replace: true },\n      );\n    },\n    [],\n  );\n\n  useLayoutEffect(() => {\n    if (!urlEnvironment) {\n      updateParams({\n        filter: defaultFilters,\n        environment: defaultEnvironment,\n      });\n    }\n  }, [defaultEnvironment, urlEnvironment, defaultFilters, updateParams]);\n\n  const updateFilter = useCallback(\n    (update: Partial<Filter>) => {\n      updateParams(prev => ({\n        ...prev,\n        filter: { ...(prev.filter as object), ...update },\n      }));\n    },\n    [updateParams],\n  );\n\n  const setEnvironment = useCallback(\n    (entityRef: string) => {\n      updateParams(prev => ({ ...prev, environment: entityRef }));\n    },\n    [updateParams],\n  );\n\n  const value = useMemo(\n    () => ({\n      filter,\n      updateFilter,\n      environment,\n      setEnvironment,\n      context,\n    }),\n    [filter, updateFilter, environment, setEnvironment, context],\n  );\n\n  return (\n    <PolicyReportsFiltersContext.Provider value={value}>\n      {children}\n    </PolicyReportsFiltersContext.Provider>\n  );\n};\n\n/**\n * Hook for reading and updating policy report filters and the selected\n * environment. Must be used within a PolicyReportsFiltersProvider.\n */\nexport const usePolicyReportsFilters = (): PolicyReportsFiltersContextValue => {\n  const ctx = useContext(PolicyReportsFiltersContext);\n  if (!ctx) {\n    throw new Error(\n      'usePolicyReportsFilters must be used within PolicyReportsFiltersProvider',\n    );\n  }\n  return ctx;\n};\n"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -18,6 +18,6 @@ declare const EntityCustomPoliciesContent: ({ annotationsDocumentationUrl, polic
     sources: string[];
     title: string;
 }) => react_jsx_runtime.JSX.Element;
-declare const PolicyReportsPage: ({ title, policyDocumentationUrl, }: PolicyReportsPageProps) => react_jsx_runtime.JSX.Element;
+declare const PolicyReportsPage: ({ title, policyDocumentationUrl, subtitle, }: PolicyReportsPageProps) => react_jsx_runtime.JSX.Element;
 
 export { EntityCustomPoliciesContent, EntityKyvernoPoliciesContent, PolicyReportsPage, policyReporterPlugin };

package/dist/package.json.esm.js

@@ -1,5 +1,5 @@
 var name = "@kyverno/backstage-plugin-policy-reporter";
-var version = "2.9.0";
+var version = "2.11.0";
 var main = "src/index.ts";
 var types = "src/index.ts";
 var license = "Apache-2.0";