@kyverno/backstage-plugin-policy-reporter 2.0.0 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +100 -0
  2. package/dist/index.d.ts +3 -3
  3. package/dist/index.esm.js +1 -1
  4. package/dist/plugin.esm.js +3 -3
  5. package/dist/plugin.esm.js.map +1 -1
  6. package/package.json +18 -13
package/README.md ADDED
@@ -0,0 +1,100 @@
1
+ # backstage-policy-reporter-plugin
2
+
3
+ The Frontend for the Policy Reporter plugin
4
+
5
+ This plugin integrates [Policy Reporter](https://kyverno.github.io/policy-reporter/) with Backstage to provide a clear and detailed view of Kyverno Policies applied to your entities
6
+
7
+ The [Backend](https://www.npmjs.com/package/@kyverno/backstage-plugin-policy-reporter-backend?activeTab=readme) plugin is required for this plugin to work
8
+
9
+ ## Installation
10
+
11
+ Add the plugin to your frontend app
12
+
13
+ ```bash
14
+ yarn --cwd packages/app add @kyverno/backstage-plugin-policy-reporter
15
+ ```
16
+
17
+ Add the **EntityKyvernoPoliciesContent** component to the Entity routes in `packages/app/src/components/catalog/EntityPage.tsx`
18
+
19
+ ```diff
20
+
21
+ + import { EntityKyvernoPoliciesContent } from '@kyverno/backstage-plugin-policy-reporter';
22
+
23
+ const serviceEntityPage = (
24
+
25
+ <EntityLayout>
26
+
27
+ // ...
28
+
29
+ + <EntityLayout.Route path="/kyverno" title="kyverno policy">
30
+ + <EntityKyvernoPoliciesContent />
31
+ + </EntityLayout.Route>
32
+
33
+ // ..
34
+
35
+ </EntityLayout>
36
+ )
37
+ ```
38
+
39
+ ## Configuration
40
+
41
+ ### Define Kubernetes Clusters
42
+
43
+ In your Backstage instance, define your Kubernetes clusters using the `Resource` kind and `kubernetes-cluster` type. Add the `kyverno.io/endpoint` annotation with the URL to the Policy Reporter API for each cluster.
44
+
45
+ ```yaml
46
+ apiVersion: backstage.io/v1alpha1
47
+ kind: Resource
48
+ metadata:
49
+ name: aks-dev
50
+ annotations:
51
+ # Add the Policy Reporter API endpoint as an annotation
52
+ kyverno.io/endpoint: http://kyverno.io/policy-reporter/api/
53
+ spec:
54
+ type: kubernetes-cluster
55
+ ```
56
+
57
+ ### Annotate Services
58
+
59
+ To show the policies on the service, add a dependency to the Kubernetes cluster resource in the `catalog-info.yaml` file of your service. Ensure that the necessary annotations are added as well. For more details, refer to the [How to annotate services](../../README.md#how-to-annotate-services) section.
60
+
61
+ ```yaml
62
+ metadata:
63
+ annotations:
64
+ kyverno.io/namespace: default # Specify the namespace of the service
65
+ kyverno.io/kind: Deployment,Pod # Specify the kind(s) of the Kubernetes resource(s)
66
+ kyverno.io/resource-name: policy-reporter # Specify the name of the resource
67
+ spec:
68
+ dependsOn:
69
+ # Add dependency to all environments the service is deployed to using the Resource entityRef
70
+ - resource:default/aks-dev
71
+ - resource:default/aks-tst
72
+ - resource:default/aks-qa
73
+ - resource:default/aks-prd
74
+ ```
75
+
76
+ ## Customization
77
+
78
+ To configure the plugin to make the policy Chip a link to custom documentation, follow the steps below.
79
+
80
+ To enable policy Chip links, the **EntityKyvernoPolicyReportsContent** component requires the **policyDocumentationUrl** prop to be set to the URL of the documentation.
81
+
82
+ ```typescript
83
+ const serviceEntityPage = (
84
+ <EntityLayout>
85
+ // ...
86
+ <EntityLayout.Route path="/kyverno" title="kyverno policy">
87
+ <EntityKyvernoPoliciesContent policyDocumentationUrl="Your full URL link" />
88
+ </EntityLayout.Route>
89
+ // ..
90
+ </EntityLayout>
91
+ );
92
+ ```
93
+
94
+ The policy documentation file provided in the above step needs to follow a specific structure.
95
+
96
+ All policies being used should have a header that matches the exact same name as the policy. Under this header, you can add information about the policy and provide a guide on how to solve it.
97
+
98
+ The plugin will create a link using the following format: `<DocumentationUrl>#<PolicyName>`
99
+
100
+ See the [example/policy-documentation.md](../../example/policy-documentation.md) file for an example of how this could look.
package/dist/index.d.ts CHANGED
@@ -2,10 +2,10 @@
2
2
  import * as react from 'react';
3
3
  import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
4
4
 
5
- declare const kyvernoPolicyReportsPlugin: _backstage_core_plugin_api.BackstagePlugin<{}, {}, {}>;
6
- declare const EntityKyvernoPolicyReportsContent: ({ annotationsDocumentationUrl, policyDocumentationUrl, }: {
5
+ declare const policyReporterPlugin: _backstage_core_plugin_api.BackstagePlugin<{}, {}, {}>;
6
+ declare const EntityKyvernoPoliciesContent: ({ annotationsDocumentationUrl, policyDocumentationUrl, }: {
7
7
  annotationsDocumentationUrl?: string | undefined;
8
8
  policyDocumentationUrl?: string | undefined;
9
9
  }) => react.JSX.Element;
10
10
 
11
- export { EntityKyvernoPolicyReportsContent, kyvernoPolicyReportsPlugin };
11
+ export { EntityKyvernoPoliciesContent, policyReporterPlugin };
package/dist/index.esm.js CHANGED
@@ -1,2 +1,2 @@
1
- export { EntityKyvernoPolicyReportsContent, kyvernoPolicyReportsPlugin } from './plugin.esm.js';
1
+ export { EntityKyvernoPoliciesContent, policyReporterPlugin } from './plugin.esm.js';
2
2
  //# sourceMappingURL=index.esm.js.map
package/dist/plugin.esm.js CHANGED
@@ -3,7 +3,7 @@ import { policyReporterApiRef } from './api/PolicyReporterApi.esm.js';
3
3
  import { PolicyReporterApiClient } from './api/PolicyReporterClient.esm.js';
4
4
  import { rootRouteRef } from './routes.esm.js';
5
5
 
6
- const kyvernoPolicyReportsPlugin = createPlugin({
6
+ const policyReporterPlugin = createPlugin({
7
7
  id: "policy-reporter",
8
8
  apis: [
9
9
  createApiFactory({
@@ -13,7 +13,7 @@ const kyvernoPolicyReportsPlugin = createPlugin({
13
13
  })
14
14
  ]
15
15
  });
16
- const EntityKyvernoPolicyReportsContent = kyvernoPolicyReportsPlugin.provide(
16
+ const EntityKyvernoPoliciesContent = policyReporterPlugin.provide(
17
17
  createRoutableExtension({
18
18
  name: "EntityKyvernoPoliciesContent",
19
19
  component: () => import('./components/EntityKyvernoPoliciesContent/index.esm.js').then(
@@ -23,5 +23,5 @@ const EntityKyvernoPolicyReportsContent = kyvernoPolicyReportsPlugin.provide(
23
23
  })
24
24
  );
25
25
 
26
- export { EntityKyvernoPolicyReportsContent, kyvernoPolicyReportsPlugin };
26
+ export { EntityKyvernoPoliciesContent, policyReporterPlugin };
27
27
  //# sourceMappingURL=plugin.esm.js.map
package/dist/plugin.esm.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"plugin.esm.js","sources":["../src/plugin.ts"],"sourcesContent":["import {\n createApiFactory,\n createPlugin,\n createRoutableExtension,\n discoveryApiRef,\n fetchApiRef,\n} from '@backstage/core-plugin-api';\nimport { policyReporterApiRef } from './api/PolicyReporterApi';\nimport { PolicyReporterApiClient } from './api/PolicyReporterClient';\n\nimport { rootRouteRef } from './routes';\n\nexport const kyvernoPolicyReportsPlugin = createPlugin({\n id: 'policy-reporter',\n apis: [\n createApiFactory({\n api: policyReporterApiRef,\n deps: { fetchApi: fetchApiRef, discoveryApi: discoveryApiRef },\n factory: ({ discoveryApi, fetchApi }) =>\n new PolicyReporterApiClient({ discoveryApi, fetchApi }),\n }),\n ],\n});\n\nexport const EntityKyvernoPolicyReportsContent =\n kyvernoPolicyReportsPlugin.provide(\n createRoutableExtension({\n name: 'EntityKyvernoPoliciesContent',\n component: () =>\n import('./components/EntityKyvernoPoliciesContent').then(\n m => m.EntityKyvernoPoliciesContent,\n ),\n mountPoint: rootRouteRef,\n }),\n );\n"],"names":[],"mappings":";;;;;AAYO,MAAM,6BAA6B,YAAa,CAAA;AAAA,EACrD,EAAI,EAAA,iBAAA;AAAA,EACJ,IAAM,EAAA;AAAA,IACJ,gBAAiB,CAAA;AAAA,MACf,GAAK,EAAA,oBAAA;AAAA,MACL,IAAM,EAAA,EAAE,QAAU,EAAA,WAAA,EAAa,cAAc,eAAgB,EAAA;AAAA,MAC7D,OAAA,EAAS,CAAC,EAAE,YAAc,EAAA,QAAA,EACxB,KAAA,IAAI,uBAAwB,CAAA,EAAE,YAAc,EAAA,QAAA,EAAU;AAAA,KACzD;AAAA;AAEL,CAAC;AAEM,MAAM,oCACX,0BAA2B,CAAA,OAAA;AAAA,EACzB,uBAAwB,CAAA;AAAA,IACtB,IAAM,EAAA,8BAAA;AAAA,IACN,SAAW,EAAA,MACT,OAAO,wDAA2C,CAAE,CAAA,IAAA;AAAA,MAClD,OAAK,CAAE,CAAA;AAAA,KACT;AAAA,IACF,UAAY,EAAA;AAAA,GACb;AACH;;;;"}
1
+ {"version":3,"file":"plugin.esm.js","sources":["../src/plugin.ts"],"sourcesContent":["import {\n createApiFactory,\n createPlugin,\n createRoutableExtension,\n discoveryApiRef,\n fetchApiRef,\n} from '@backstage/core-plugin-api';\nimport { policyReporterApiRef } from './api/PolicyReporterApi';\nimport { PolicyReporterApiClient } from './api/PolicyReporterClient';\n\nimport { rootRouteRef } from './routes';\n\nexport const policyReporterPlugin = createPlugin({\n id: 'policy-reporter',\n apis: [\n createApiFactory({\n api: policyReporterApiRef,\n deps: { fetchApi: fetchApiRef, discoveryApi: discoveryApiRef },\n factory: ({ discoveryApi, fetchApi }) =>\n new PolicyReporterApiClient({ discoveryApi, fetchApi }),\n }),\n ],\n});\n\nexport const EntityKyvernoPoliciesContent = policyReporterPlugin.provide(\n createRoutableExtension({\n name: 'EntityKyvernoPoliciesContent',\n component: () =>\n import('./components/EntityKyvernoPoliciesContent').then(\n m => m.EntityKyvernoPoliciesContent,\n ),\n mountPoint: rootRouteRef,\n }),\n);\n"],"names":[],"mappings":";;;;;AAYO,MAAM,uBAAuB,YAAa,CAAA;AAAA,EAC/C,EAAI,EAAA,iBAAA;AAAA,EACJ,IAAM,EAAA;AAAA,IACJ,gBAAiB,CAAA;AAAA,MACf,GAAK,EAAA,oBAAA;AAAA,MACL,IAAM,EAAA,EAAE,QAAU,EAAA,WAAA,EAAa,cAAc,eAAgB,EAAA;AAAA,MAC7D,OAAA,EAAS,CAAC,EAAE,YAAc,EAAA,QAAA,EACxB,KAAA,IAAI,uBAAwB,CAAA,EAAE,YAAc,EAAA,QAAA,EAAU;AAAA,KACzD;AAAA;AAEL,CAAC;AAEM,MAAM,+BAA+B,oBAAqB,CAAA,OAAA;AAAA,EAC/D,uBAAwB,CAAA;AAAA,IACtB,IAAM,EAAA,8BAAA;AAAA,IACN,SAAW,EAAA,MACT,OAAO,wDAA2C,CAAE,CAAA,IAAA;AAAA,MAClD,OAAK,CAAE,CAAA;AAAA,KACT;AAAA,IACF,UAAY,EAAA;AAAA,GACb;AACH;;;;"}
package/package.json CHANGED
@@ -1,9 +1,14 @@
1
1
  {
2
2
  "name": "@kyverno/backstage-plugin-policy-reporter",
3
- "version": "2.0.0",
3
+ "version": "2.0.2",
4
4
  "main": "dist/index.esm.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "license": "Apache-2.0",
7
+ "keywords": [
8
+ "backstage",
9
+ "kyverno",
10
+ "policy-reporter"
11
+ ],
7
12
  "backstage": {
8
13
  "role": "frontend-plugin",
9
14
  "pluginId": "policy-reporter",
@@ -34,13 +39,13 @@
34
39
  "directory": "plugins/policy-reporter"
35
40
  },
36
41
  "dependencies": {
37
- "@backstage/catalog-client": "^1.8.0",
38
- "@backstage/catalog-model": "^1.7.1",
39
- "@backstage/core-components": "^0.16.1",
40
- "@backstage/core-plugin-api": "^1.10.1",
41
- "@backstage/plugin-catalog-react": "^1.14.2",
42
- "@backstage/theme": "^0.6.2",
43
- "@kyverno/backstage-plugin-policy-reporter-common": "^2.0.0",
42
+ "@backstage/catalog-client": "^1.9.1",
43
+ "@backstage/catalog-model": "^1.7.3",
44
+ "@backstage/core-components": "^0.16.3",
45
+ "@backstage/core-plugin-api": "^1.10.3",
46
+ "@backstage/plugin-catalog-react": "^1.15.1",
47
+ "@backstage/theme": "^0.6.3",
48
+ "@kyverno/backstage-plugin-policy-reporter-common": "^2.0.3",
44
49
  "@material-ui/core": "^4.9.13",
45
50
  "@material-ui/icons": "^4.9.1",
46
51
  "@material-ui/lab": "4.0.0-alpha.61",
@@ -50,10 +55,10 @@
50
55
  "react": "^16.13.1 || ^17.0.0 || ^18.0.0"
51
56
  },
52
57
  "devDependencies": {
53
- "@backstage/cli": "^0.29.2",
54
- "@backstage/core-app-api": "^1.15.2",
55
- "@backstage/dev-utils": "^1.1.4",
56
- "@backstage/test-utils": "^1.7.2",
58
+ "@backstage/cli": "^0.29.5",
59
+ "@backstage/core-app-api": "^1.15.4",
60
+ "@backstage/dev-utils": "^1.1.6",
61
+ "@backstage/test-utils": "^1.7.4",
57
62
  "@testing-library/jest-dom": "^6.0.0",
58
63
  "@testing-library/react": "^14.0.0",
59
64
  "@testing-library/user-event": "^14.0.0",
@@ -62,7 +67,7 @@
62
67
  "files": [
63
68
  "dist"
64
69
  ],
65
- "gitHead": "9a769119bd77bb807670baefffeb37510e5c61c9",
70
+ "gitHead": "7f58ee0972f1b7af2fc88723e00d1472bf20ffc1",
66
71
  "typesVersions": {
67
72
  "*": {
68
73
  "index": [