@jfvilas/plugin-kwirth-log 0.12.2

package/README.md

@@ -0,0 +1,148 @@
+# Backstage frontend KwirthLog plugin
+This package is a Backstage plugin for **viewing Kubernetes logs** in real-time (live-streaming) via Kwirth.
+
+**NOTE: KwithLog requires Kwirth vesrsion 0.3.155 or greater**
+
+This Backstage plugin allows you to live-stream Kubernetes logs associated to your Backstage entities directly inside your Backstage instance. It's very important to understand that for this plugin to work you need to install Kwirth on your Kubernetes cluster, that is, this plugin is just another front end for [Kwirth](https://jfvilas.github.io/kwirth).
+
+Kwirth is a really-easy-to-use data-exporting system for Kubernetes that runs in only one pod (*no database is needed*). Refer to Kwirth GitHub project for [info on installation](https://github.com/jfvilas/kwirth?tab=readme-ov-file#installation). Kwirth installation is *one command away* from you.
+
+You can access [Kwirth project here](https://github.com/jfvilas/kwirth).
+
+
+## What is this plugin for?
+This Backstage plugin adds Backstage a feature for viewing real-time Kubernetes logs of your Backstage entities directly inside Backstage frontend application. The plugin will be enabled for any entity that is corectly tagged (according to Backstage Kubernetes core feature) and its correpsonding Kubernetes resources are found on any of the clusters that have been added to Backstage.
+
+When KwirthLog is correctly installed and configured, it is possible to view Kubernetes logs on your Backstage like in this sample:
+
+![kwirth-running](https://raw.githubusercontent.com/jfvilas/plugin-kwirth-log/master/images/kwirthlog-running.png)
+
+This frontend plugin includes just the visualization of log information. All needed configuration, and specially **permission settings**, are done in the backend plugin and the app-config.yaml. You can restrict access to pods, namespaces, clusters, etc... by configuring permissions to be applied on the backend plugin.
+
+## How does it work?
+Let's explain this by following a user working sequence:
+
+1. A Backstage user searchs for an entity in the Backstage.
+2. In the entity page there will be a new tab named 'KWIRTHLOG'.
+3. When the user clicks on KWIRTHLOG the frontend plugin sends a request to the backend Kiwrth plugin asking for logging information on all Kubernetes clusters available.
+4. The Kwirth backend plugin sends requests to the Kwirth instances that are running inside all the clusters added to Backstage. These requests ask for the following: *'Tell me all the pods that are labeled with the kubernetes-id label and do correspond with the entity I'm looking for'*. In response to this query, each Kwirth instance answers with a list of pods and the namespaces where they are running.
+5. The Kwirth backend plugin checks then the permissions of the connected user and prunes the pods list removing the ones that the user has not access to.
+6. With the final pod list, the backend plugin sends requests to the Kwirth instances on the clusters asking for API Keys specific for streaming pod logs.
+7. With all this information, the backend builds a unique response containing all the pods the user have access to, and all the API keys needed to access those logs.
+
+If everyting is correctly configured and tagged, the user should see a list of clusters. When selecting a cluster, the user should see a list of namespaces where the entity is running.
+
+
+## Installation
+It's very simple and straightforward, it is in fact very similar to any other forntend Backstage plugin.
+
+1. Install corresponding Backstage backend plugin [more information here](https://www.npmjs.com/package/@jfvilas/plugin-kwirth-backend).
+
+2. Install this Backstage frontend plugin:
+
+    ```bash
+    # From your Backstage root directory
+    yarn --cwd packages/app add @jfvilas/plugin-kwirth-log @jfvilas/plugin-kwirth-common
+    ```
+
+3. Make sure the [Kwirth backend plugin](https://www.npmjs.com/package/@jfvilas/plugin-kwirth-backend#configure) is installed and configured.
+
+4. Restart your Backstage instance.
+
+
+## Configuration: Entity Pages
+For Kwirth plugin to be usable on the frontend, you must tailor your Entity Page to include the Kwirth components.
+
+1. Add the plugin as a tab in your Entity pages:
+
+    Firstly, import the plugin module.
+    ```typescript
+    // In packages/app/src/components/catalog/EntityPage.tsx
+    import { EntityKwirthLogContent, isKirthAvailable } from '@jfvilas/plugin-kwirth-log';
+    ```
+
+    Then, add a tab to your EntityPage (the 'if' is optional, you can keep the 'KwirthLog' tab always visible if you prefer to do it that way).
+    ````jsx
+    // Note: Add to any other Pages as well (e.g. defaultEntityPage or webSiteEntityPage, for example)
+    const serviceEntityPage = (
+      <EntityLayout>
+        {/* other tabs... */}
+        <EntityLayout.Route if={isKwirthAvailable} path="/kwirthlog" title="KwirthLog">
+          <EntityKwirthLogContent />
+        </EntityLayout.Route>
+      </EntityLayout>
+    )
+    ```
+
+2. Add `backstage.io/kubernetes-id` annotation to your `catalog-info.yaml` for the entities deployed to Kubernetes whose logs you want to be 'viewable' on Backstage. This is the same annotation that the Kubernetes core plugin uses, so, maybe you already have added it to your components.
+
+    ```yaml
+    metadata:
+      annotaations:
+        backstage.io/kubernetes-id: entity-name
+    ```
+
+3. Add proper **labels** to your Kubernetes objects so Backstage can *link* forward and backward the Backstage entities with the Kubernetes objects. To do this, you need to add `labels` to your Kubernetes YAML objects (please, don't get confused: **annotations in Backstage YAML, labels in Kubernetes YAML**). This is an example of a typical Kubernetes deployment with the required label:
+
+    ```yaml
+    apiVersion: apps/v1
+    kind: Deployment
+    metadata:
+      name: ijkl
+      labels:
+        backstage.io/kubernetes-id: ijkl
+    spec:
+      selector:
+        matchLabels:
+          app: ijkl
+      template:
+        metadata:
+          name: 'ijkl-pod'
+          labels:
+            app: ijkl
+            backstage.io/kubernetes-id: ijkl
+        spec:
+          containers:
+            - name: ijkl
+              image: your-OCI-image
+        ...    
+    ```
+
+    Please note that the kubernetes-id label is **on the deployment** and on the **spec pod template** also.
+
+## Ready, set, go!
+If you followed all these steps and our work is well done (not sure on this), you would see a 'KwirthLog' tab in your **Entity Page**, like this one:
+
+![kwirthlog-tab](https://raw.githubusercontent.com/jfvilas/plugin-kwirth-log/master/images/kwirthlog-tab.png)
+
+When you access the tab, if you have not yet tagged your entities you would see a message like this one explaning how to do that:
+
+![notfound](https://raw.githubusercontent.com/jfvilas/plugin-kwirth-log/master/images/kwirthlog-notfound.png)
+
+Once you tagged your entities and your Kubernetes objects, you should see something similar to this:
+
+![available](https://raw.githubusercontent.com/jfvilas/plugin-kwirth-log/master/images/kwirthlog-available.png)
+
+KwirthLog is ready to show logs!!
+
+Just *select the cluster* on the cluster card and eventually set the *options* you want for the log streaming. On the card on right, you will see all the Kubernetes namespaces available and a stream control (download, play, pause and stop). *Select a namespace*, and two selectros for 'pod' and 'conatiner' will become available just under the namespace chips.
+
+Select the pod/pods and container/containers you want to stream log, *click PLAY* button and the party starts!!
+
+Now you will see your log refreshing in real-time. If you selected more than one namespace/pod/contianer, the log stream will contain all the source log lines streamed following time line.
+
+![running](https://raw.githubusercontent.com/jfvilas/plugin-kwirth-log/master/images/kwirthlog-running.png)
+
+Feel free to open issues and ask for more features.
+
+## Status information
+When the log stream starts, and all along the life of the stream (until it gets stopped or the window is closed), you will receive status information regarding the kubernetes objects you are watching. This status information is shown on the top of the card (just at the immediate right of the cluster name) including 3 kinds of information:
+
+  - **Info**. Informaiton regarding pod management at Kubernetes cluster level (new pod, pod ended or pod modified).
+  - **Warning**. Warnings related to the log stream.
+  - **Error**. If there is an error in the stream, like invalid key use, or erroneous pod tagging, erros will be shown here.
+
+The icons will light up in its corresponding color when a new message arrives.
+
+This is how it feels:
+![status info](https://raw.githubusercontent.com/jfvilas/plugin-kwirth-log/master/images/status-info.png)

package/dist/api/KwirthLogClient.esm.js

@@ -0,0 +1,65 @@
+class KwirthLogClient {
+  discoveryApi;
+  fetchApi;
+  constructor(options) {
+    this.discoveryApi = options.discoveryApi;
+    this.fetchApi = options.fetchApi;
+  }
+  /**
+   * 
+   * @param entity 
+   * @returns an array of clusters (with their correpsonding info) and a pod list for each, where the entity has been dicovered
+   */
+  async getVersion() {
+    try {
+      const baseUrl = await this.discoveryApi.getBaseUrl("kwirthbackstage");
+      const targetUrl = `${baseUrl}/version`;
+      const result = await this.fetchApi.fetch(targetUrl);
+      const data = await result.json();
+      if (!result.ok) {
+        throw new Error(`getVersion error: not ok`);
+      }
+      return data.version;
+    } catch (err) {
+      throw new Error(`getVersion error: ${err}`);
+    }
+  }
+  async getResources(entity) {
+    try {
+      const baseUrl = await this.discoveryApi.getBaseUrl("kwirthbackstage");
+      const targetUrl = `${baseUrl}/start`;
+      var payload = JSON.stringify(entity);
+      const result = await this.fetchApi.fetch(targetUrl, { method: "POST", body: payload, headers: { "Content-Type": "application/json" } });
+      const data = await result.json();
+      if (!result.ok) {
+        throw new Error(`getResources error: not ok`);
+      }
+      return data;
+    } catch (err) {
+      throw new Error(`getResources error: ${err}`);
+    }
+  }
+  async requestAccess(entity, channel, scopes) {
+    try {
+      const baseUrl = await this.discoveryApi.getBaseUrl("kwirthbackstage");
+      var targetUrl = new URL(`${baseUrl}/access`);
+      targetUrl.searchParams.append("scopes", scopes.join(","));
+      targetUrl.searchParams.append("channel", channel);
+      var payload = JSON.stringify(entity);
+      const result = await this.fetchApi.fetch(targetUrl, { method: "POST", body: payload, headers: { "Content-Type": "application/json" } });
+      const data = await result.json();
+      for (var c of data) {
+        c.accessKeys = new Map(JSON.parse(c.accessKeys));
+      }
+      if (!result.ok) {
+        throw new Error(`requestAccess error: not ok`);
+      }
+      return data;
+    } catch (err) {
+      throw new Error(`requestAccess error: ${err}`);
+    }
+  }
+}
+
+export { KwirthLogClient };
+//# sourceMappingURL=KwirthLogClient.esm.js.map

package/dist/api/KwirthLogClient.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KwirthLogClient.esm.js","sources":["../../src/api/KwirthLogClient.ts"],"sourcesContent":["/*\r\nCopyright 2024 Julio Fernandez\r\n\r\nLicensed under the Apache License, Version 2.0 (the \"License\");\r\nyou may not use this file except in compliance with the License.\r\nYou may obtain a copy of the License at\r\n\r\n    http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nUnless required by applicable law or agreed to in writing, software\r\ndistributed under the License is distributed on an \"AS IS\" BASIS,\r\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\nSee the License for the specific language governing permissions and\r\nlimitations under the License.\r\n*/\r\nimport { DiscoveryApi, FetchApi } from '@backstage/core-plugin-api'\r\nimport { KwirthLogApi } from './types'\r\nimport { Entity } from '@backstage/catalog-model'\r\nimport { ClusterValidPods } from '@jfvilas/plugin-kwirth-common'\r\nimport { InstanceConfigScopeEnum } from '@jfvilas/kwirth-common'\r\n\r\nexport interface KwirthLogClientOptions {\r\n    discoveryApi: DiscoveryApi\r\n    fetchApi: FetchApi\r\n}\r\n\r\nexport class KwirthLogClient implements KwirthLogApi {\r\n    private readonly discoveryApi: DiscoveryApi\r\n    private readonly fetchApi: FetchApi\r\n\r\n    constructor(options: KwirthLogClientOptions) {\r\n        this.discoveryApi = options.discoveryApi\r\n        this.fetchApi = options.fetchApi\r\n    }\r\n\r\n    /**\r\n     * \r\n     * @param entity \r\n     * @returns an array of clusters (with their correpsonding info) and a pod list for each, where the entity has been dicovered\r\n     */\r\n    async getVersion(): Promise<string> {\r\n        try {\r\n            const baseUrl = await this.discoveryApi.getBaseUrl('kwirthbackstage')\r\n            const targetUrl = `${baseUrl}/version`\r\n\r\n            const result = await this.fetchApi.fetch(targetUrl)\r\n            const data = await result.json()\r\n\r\n            if (!result.ok) {\r\n                throw new Error(`getVersion error: not ok`)\r\n            }\r\n            return data.version\r\n        }\r\n        catch (err) {\r\n            throw new Error(`getVersion error: ${err}`)\r\n        }\r\n    }\r\n\r\n    async getResources(entity:Entity): Promise<ClusterValidPods> {\r\n        try {\r\n            const baseUrl = await this.discoveryApi.getBaseUrl('kwirthbackstage')\r\n            const targetUrl = `${baseUrl}/start`\r\n\r\n            var payload=JSON.stringify(entity)\r\n            const result = await this.fetchApi.fetch(targetUrl, {method:'POST', body:payload, headers:{'Content-Type':'application/json'}})\r\n            const data = await result.json() as ClusterValidPods\r\n\r\n            if (!result.ok) {\r\n                throw new Error(`getResources error: not ok`)\r\n            }\r\n            return data\r\n        }\r\n        catch (err) {\r\n            throw new Error(`getResources error: ${err}`)\r\n        }\r\n    }\r\n\r\n    async requestAccess(entity:Entity, channel:string, scopes:InstanceConfigScopeEnum[]): Promise<ClusterValidPods[]> {\r\n        try {\r\n            const baseUrl = await this.discoveryApi.getBaseUrl('kwirthbackstage')\r\n            var targetUrl:URL= new URL (`${baseUrl}/access`)\r\n            targetUrl.searchParams.append('scopes',scopes.join(','))  //+++ poner mas elegante\r\n            targetUrl.searchParams.append('channel',channel)\r\n\r\n            var payload=JSON.stringify(entity)\r\n            const result = await this.fetchApi.fetch(targetUrl, {method:'POST', body:payload, headers:{'Content-Type':'application/json'}})\r\n            const data = await result.json() as ClusterValidPods[]\r\n\r\n            // we reconstruct the 'Map' from string of arrays\r\n            for (var c of data) {\r\n                c.accessKeys = new Map(JSON.parse(((c as any).accessKeys)))\r\n            }\r\n            if (!result.ok) {\r\n                throw new Error(`requestAccess error: not ok`)\r\n            }\r\n            return data\r\n        }\r\n        catch (err) {\r\n            throw new Error(`requestAccess error: ${err}`)\r\n        }\r\n    }\r\n\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/api/types.esm.js

@@ -0,0 +1,8 @@
+import { createApiRef } from '@backstage/core-plugin-api';
+
+const kwirthLogApiRef = createApiRef({
+  id: "plugin.kwirthlog.api"
+});
+
+export { kwirthLogApiRef };
+//# sourceMappingURL=types.esm.js.map

package/dist/api/types.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.esm.js","sources":["../../src/api/types.ts"],"sourcesContent":["/*\r\nCopyright 2024 Julio Fernandez\r\n\r\nLicensed under the Apache License, Version 2.0 (the \"License\");\r\nyou may not use this file except in compliance with the License.\r\nYou may obtain a copy of the License at\r\n\r\n    http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nUnless required by applicable law or agreed to in writing, software\r\ndistributed under the License is distributed on an \"AS IS\" BASIS,\r\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\nSee the License for the specific language governing permissions and\r\nlimitations under the License.\r\n*/\r\nimport { Entity } from '@backstage/catalog-model'\r\nimport { createApiRef } from '@backstage/core-plugin-api'\r\nimport { InstanceConfigScopeEnum } from '@jfvilas/kwirth-common'\r\nimport { ClusterValidPods } from '@jfvilas/plugin-kwirth-common'\r\n\r\nexport interface KwirthLogApi {\r\n    getResources(entity:Entity): Promise<any>\r\n    //requestAccess(entity:Entity, scopes:string[]): Promise<any>\r\n    requestAccess(entity:Entity, channel:string, scopes:InstanceConfigScopeEnum[]): Promise<ClusterValidPods[]>\r\n    getVersion(): Promise<any>\r\n}\r\n\r\nexport const kwirthLogApiRef = createApiRef<KwirthLogApi>({\r\n  id: 'plugin.kwirthlog.api',\r\n})\r\n"],"names":[],"mappings":";;AA2BO,MAAM,kBAAkB,YAA2B,CAAA;AAAA,EACxD,EAAI,EAAA;AACN,CAAC;;;;"}

package/dist/assets/kwirth-log-component-not-found.svg

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 340 260" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(0.9912869334220885, 0, 0, 0.9992620348930358, -14.405802726745609, -13.716870307922363)">
+    <rect style="fill-rule: nonzero; stroke: rgb(255, 255, 255); stroke-width: 0px; fill: rgb(230, 230, 230); transform-origin: 251.826px 205.425px;" transform="matrix(0.985986, -0.166827, 0.164416, 0.986394, -63.927027, -123.853593)" x="111.287" y="192.512" width="281.077" height="25.826" rx="12.015" ry="12.015"/>
+    <rect style="fill-rule: nonzero; stroke: rgb(255, 255, 255); stroke-width: 0px; fill: rgb(230, 230, 230); transform-origin: 183.734px 205.425px;" transform="matrix(0.985986, -0.166827, 0.164416, 0.986394, 25.09495, -102.378974)" x="81.196" y="192.512" width="205.077" height="25.826" rx="12.015" ry="12.015"/>
+    <rect style="fill-rule: nonzero; stroke: rgb(255, 255, 255); stroke-width: 0px; fill: rgb(230, 230, 230); transform-origin: 233.847px 205.425px;" transform="matrix(0.985986, -0.166827, 0.164416, 0.986394, -88.514386, -142.044601)" x="103.341" y="192.512" width="261.01" height="25.826" rx="12.015" ry="12.015"/>
+    <rect style="fill-rule: nonzero; stroke: rgb(255, 255, 255); stroke-width: 0px; fill: rgb(230, 230, 230); transform-origin: 293.722px 205.425px;" transform="matrix(0.985986, -0.166827, 0.164416, 0.986394, -99.946111, -14.149463)" x="129.802" y="192.512" width="327.839" height="25.826" rx="12.015" ry="12.015"/>
+    <rect style="fill-rule: nonzero; stroke: rgb(255, 255, 255); stroke-width: 0px; fill: rgb(230, 230, 230); transform-origin: 230.511px 205.425px;" transform="matrix(0.985986, -0.166827, 0.164416, 0.986394, -36.575721, 10.839559)" x="101.867" y="192.512" width="257.287" height="25.826" rx="12.015" ry="12.015"/>
+    <rect style="fill-rule: nonzero; stroke: rgb(255, 255, 255); stroke-width: 0px; fill: rgb(230, 230, 230); transform-origin: 233.847px 205.425px;" transform="matrix(0.985986, -0.166827, 0.164416, 0.986394, -59.583989, -36.241093)" x="103.341" y="192.512" width="261.01" height="25.826" rx="12.015" ry="12.015"/>
+    <path d="M 277.832 76.239 L 277.832 265.059 C 277.832 269.951 273.864 273.919 268.972 273.919 L 98.872 273.919 C 93.979 273.919 90.012 269.951 90.012 265.059 L 90.012 29.879 C 90.012 24.987 93.977 21.019 98.872 21.019 L 222.616 21.019 C 224.965 21.019 227.218 21.952 228.882 23.613 L 275.241 69.972 C 276.899 71.633 277.832 73.887 277.832 76.239 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(200, 200, 200);" stroke-linecap="round"/>
+    <path d="M 270.711 68.946 L 270.711 257.767 C 270.711 262.659 266.743 266.627 261.851 266.627 L 91.751 266.627 C 86.859 266.627 82.891 262.659 82.891 257.767 L 82.891 22.587 C 82.891 17.695 86.856 13.727 91.751 13.727 L 215.495 13.727 C 217.844 13.727 220.097 14.66 221.761 16.321 L 268.12 62.68 C 269.778 64.341 270.711 66.594 270.711 68.946 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(220,223,225); fill-rule: nonzero; opacity: 1;" stroke-linecap="round"/>
+    <path d="M 270.711 65.276 L 227.235 65.276 C 222.775 65.276 219.162 61.663 219.162 57.203 L 219.162 13.727" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(171,178,184); fill-rule: nonzero; opacity: 1;" stroke-linecap="round"/>
+    <g transform="matrix(2.81, 0, 0, 2.81, 48.534809, 14.406067)" style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;">
+      <path d="M 67.477 67.368 L 25.059 67.368 C 24.507 67.368 24.059 66.921 24.059 66.368 C 24.059 65.815 24.507 65.368 25.059 65.368 L 67.477 65.368 C 68.03 65.368 68.477 65.815 68.477 66.368 C 68.477 66.921 68.03 67.368 67.477 67.368 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+      <path d="M 47.92 78.45 L 24.609 78.45 C 24.305 78.45 24.059 78.003 24.059 77.45 C 24.059 76.897 24.305 76.45 24.609 76.45 L 47.92 76.45 C 48.225 76.45 48.471 76.897 48.471 77.45 C 48.471 78.003 48.225 78.45 47.92 78.45 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+      <path d="M 53.459 61.827 L 24.736 61.827 C 24.362 61.827 24.059 61.38 24.059 60.827 C 24.059 60.274 24.362 59.827 24.736 59.827 L 53.459 59.827 C 53.833 59.827 54.136 60.274 54.136 60.827 C 54.136 61.38 53.833 61.827 53.459 61.827 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+      <path d="M 58.371 72.909 L 24.849 72.909 C 24.413 72.909 24.059 72.462 24.059 71.909 C 24.059 71.356 24.413 70.909 24.849 70.909 L 58.371 70.909 C 58.808 70.909 59.161 71.356 59.161 71.909 C 59.161 72.462 58.808 72.909 58.371 72.909 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+      <path d="M 61.849 56.286 L 24.929 56.286 C 24.449 56.286 24.059 55.839 24.059 55.286 C 24.059 54.733 24.449 54.286 24.929 54.286 L 61.849 54.286 C 62.33 54.286 62.719 54.733 62.719 55.286 C 62.719 55.839 62.33 56.286 61.849 56.286 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+      <path d="M 59.387 83.993 L 24.873 83.993 C 24.424 83.993 24.059 83.546 24.059 82.993 C 24.059 82.44 24.424 81.993 24.873 81.993 L 59.387 81.993 C 59.837 81.993 60.201 82.44 60.201 82.993 C 60.201 83.546 59.837 83.993 59.387 83.993 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+    </g>
+    <text style="fill: rgb(172, 172, 172); font-family: Consolas; font-size: 34px; font-weight: 700; stroke-miterlimit: 10; stroke-width: 0px; white-space: pre;" x="114.293" y="147.365">Kubelog</text>
+    <g transform="matrix(2.81, 0, 0, 2.81, 46.879719, -88.482063)" style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;">
+      <g>
+        <path d="M 68.066 63.467 L 25.648 63.467 C 25.096 63.467 24.648 63.02 24.648 62.467 C 24.648 61.914 25.096 61.467 25.648 61.467 L 68.066 61.467 C 68.619 61.467 69.066 61.914 69.066 62.467 C 69.066 63.02 68.619 63.467 68.066 63.467 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+        <path d="M 54.048 57.926 L 25.325 57.926 C 24.951 57.926 24.648 57.479 24.648 56.926 C 24.648 56.373 24.951 55.926 25.325 55.926 L 54.048 55.926 C 54.422 55.926 54.725 56.373 54.725 56.926 C 54.725 57.479 54.422 57.926 54.048 57.926 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+        <path d="M 58.96 69.008 L 25.438 69.008 C 25.002 69.008 24.648 68.561 24.648 68.008 C 24.648 67.455 25.002 67.008 25.438 67.008 L 58.96 67.008 C 59.397 67.008 59.75 67.455 59.75 68.008 C 59.75 68.561 59.397 69.008 58.96 69.008 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+        <path d="M 50.623 52.385 L 25.246 52.385 C 24.916 52.385 24.648 51.938 24.648 51.385 C 24.648 50.832 24.916 50.385 25.246 50.385 L 50.623 50.385 C 50.953 50.385 51.221 50.832 51.221 51.385 C 51.221 51.938 50.953 52.385 50.623 52.385 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+        <path d="M 56.366 45.86 L 25.378 45.86 C 24.975 45.86 24.648 45.413 24.648 44.86 C 24.648 44.307 24.975 43.86 25.378 43.86 L 56.366 43.86 C 56.77 43.86 57.097 44.307 57.097 44.86 C 57.097 45.413 56.77 45.86 56.366 45.86 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(172, 172, 172);" stroke-linecap="round"/>
+      </g>
+    </g>
+  </g>
+</svg>

package/dist/assets/kwirthlog-logo.svg

@@ -0,0 +1,23 @@
+<svg viewBox="0 0 152 200" xmlns="http://www.w3.org/2000/svg" xmlns:bx="https://boxy-svg.com">
+  <g id="g2938" transform="matrix(1.212132, 0, 0, 1.287234, -1690.147827, -17146.523437)" style="">
+    <g id="g2923" transform="matrix(1, 0, 0, 1, -88.077026, -4.644278)">
+      <path style="color: rgb(0, 0, 0); font-style: normal; font-variant: normal; font-weight: normal; font-stretch: normal; font-size: medium; line-height: normal; font-family: sans-serif; font-feature-settings: normal; text-indent: 0px; text-align: start; text-decoration: none solid rgb(0, 0, 0); letter-spacing: normal; word-spacing: normal; text-transform: none; writing-mode: lr-tb; direction: ltr; text-orientation: mixed; dominant-baseline: auto; baseline-shift: baseline; text-anchor: start; white-space: normal; clip-rule: nonzero; display: inline; overflow: visible; visibility: visible; opacity: 1; isolation: auto; mix-blend-mode: normal; color-interpolation: srgb; color-interpolation-filters: linearrgb; vector-effect: none; fill: rgb(255, 255, 255); fill-opacity: 1; fill-rule: evenodd; stroke-width: 4.68925; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 4; stroke-dasharray: none; stroke-dashoffset: 0; stroke-opacity: 1; color-rendering: auto; image-rendering: auto; shape-rendering: auto; text-rendering: auto; paint-order: fill; stroke: rgb(167, 171, 176);" d="m 1484.9121,13327.59 h 120.5098 v 150.57 h -120.5098 z" id="path3310"></path>
+    </g>
+    <g id="g3330" transform="matrix(0.363994, 0, 0, 0.363994, 662.559143, 9263.273438)">
+      <g transform="matrix(6.103682, 0, 0, 5.928513, 1904.565796, 10952.352539)">
+        <g>
+          <path d="M 68.066 63.636 L 25.648 63.636 C 25.096 63.636 24.648 63.189 24.648 62.636 C 24.648 62.083 25.096 61.636 25.648 61.636 L 68.066 61.636 C 68.619 61.636 69.066 62.083 69.066 62.636 C 69.066 63.189 68.619 63.636 68.066 63.636 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+          <path d="M 54.048 57.677 L 25.325 57.677 C 24.951 57.677 24.648 57.23 24.648 56.677 C 24.648 56.124 24.951 55.677 25.325 55.677 L 54.048 55.677 C 54.422 55.677 54.725 56.124 54.725 56.677 C 54.725 57.23 54.422 57.677 54.048 57.677 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+          <path d="M 58.96 69.595 L 25.438 69.595 C 25.002 69.595 24.648 69.148 24.648 68.595 C 24.648 68.042 25.002 67.595 25.438 67.595 L 58.96 67.595 C 59.397 67.595 59.75 68.042 59.75 68.595 C 59.75 69.148 59.397 69.595 58.96 69.595 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+          <path d="M 50.623 51.718 L 25.246 51.718 C 24.916 51.718 24.648 51.271 24.648 50.718 C 24.648 50.165 24.916 49.718 25.246 49.718 L 50.623 49.718 C 50.953 49.718 51.221 50.165 51.221 50.718 C 51.221 51.271 50.953 51.718 50.623 51.718 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+          <path d="M 56.366 45.759 L 25.378 45.759 C 24.975 45.759 24.648 45.312 24.648 44.759 C 24.648 44.206 24.975 43.759 25.378 43.759 L 56.366 43.759 C 56.77 43.759 57.097 44.206 57.097 44.759 C 57.097 45.312 56.77 45.759 56.366 45.759 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+          <path d="M 54.048 75.556 L 25.325 75.556 C 24.951 75.556 24.648 75.109 24.648 74.556 C 24.648 74.003 24.951 73.556 25.325 73.556 L 54.048 73.556 C 54.422 73.556 54.725 74.003 54.725 74.556 C 54.725 75.109 54.422 75.556 54.048 75.556 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+          <path d="M 50.623 98.363 L 25.246 98.363 C 24.916 98.363 24.648 97.916 24.648 97.363 C 24.648 96.81 24.916 96.363 25.246 96.363 L 50.623 96.363 C 50.953 96.363 51.221 96.81 51.221 97.363 C 51.221 97.916 50.953 98.363 50.623 98.363 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+          <path d="M 56.366 92.082 L 25.378 92.082 C 24.975 92.082 24.648 91.635 24.648 91.082 C 24.648 90.529 24.975 90.082 25.378 90.082 L 56.366 90.082 C 56.77 90.082 57.097 90.529 57.097 91.082 C 57.097 91.635 56.77 92.082 56.366 92.082 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+          <path d="M 50.623 39.8 L 25.246 39.8 C 24.916 39.8 24.648 39.353 24.648 38.8 C 24.648 38.247 24.916 37.8 25.246 37.8 L 50.623 37.8 C 50.953 37.8 51.221 38.247 51.221 38.8 C 51.221 39.353 50.953 39.8 50.623 39.8 Z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill-rule: nonzero; opacity: 1; fill: rgb(156, 156, 156);" stroke-linecap="round"></path>
+        </g>
+      </g>
+    </g>
+  </g>
+  <text style="fill: rgb(74, 74, 74); font-family: Consolas; font-size: 34px; font-weight: 700; stroke-miterlimit: 10; stroke-width: 0px; white-space: pre;" transform="matrix(0.654152, 0, 0, 0.636825, -54.393276, 53.200108)" x="114.293" y="147.365">KwirthLog</text>
+</svg>

package/dist/components/ClusterList/ClusterList.esm.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import Box from '@material-ui/core/Box';
+import CardHeader from '@material-ui/core/CardHeader';
+import Divider from '@material-ui/core/Divider';
+import List from '@material-ui/core/List';
+import ListItem from '@material-ui/core/ListItem';
+import ListItemText from '@material-ui/core/ListItemText';
+import Typography from '@material-ui/core/Typography';
+import { makeStyles } from '@material-ui/core/styles';
+
+const useStyles = makeStyles((_theme) => ({
+  clusterBox: {
+    display: "flex",
+    marginTop: "8px"
+  }
+}));
+const ClusterList = (props) => {
+  const classes = useStyles();
+  const { resources, selectedClusterName, onSelect } = props;
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(CardHeader, { title: "Clusters" }), /* @__PURE__ */ React.createElement(Divider, { style: { marginTop: 8 } }), /* @__PURE__ */ React.createElement(List, { dense: true }, resources.map((cluster, index) => /* @__PURE__ */ React.createElement(ListItem, { button: true, key: index, selected: selectedClusterName === cluster.name, onClick: () => onSelect(cluster.name), disabled: cluster.data.length === 0 }, /* @__PURE__ */ React.createElement(
+    ListItemText,
+    {
+      primary: cluster.name,
+      secondary: /* @__PURE__ */ React.createElement(Box, { component: "span", className: classes.clusterBox }, /* @__PURE__ */ React.createElement(Typography, { component: "span", style: { fontSize: 12 } }, cluster.title))
+    }
+  )))));
+};
+
+export { ClusterList };
+//# sourceMappingURL=ClusterList.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ClusterList.esm.js","sources":["../../../src/components/ClusterList/ClusterList.tsx"],"sourcesContent":["import React from 'react'\r\nimport Box from '@material-ui/core/Box'\r\nimport CardHeader from '@material-ui/core/CardHeader'\r\nimport Divider from '@material-ui/core/Divider'\r\nimport List from '@material-ui/core/List'\r\nimport ListItem from '@material-ui/core/ListItem'\r\nimport ListItemText from '@material-ui/core/ListItemText'\r\nimport Typography from '@material-ui/core/Typography'\r\nimport { makeStyles, Theme } from '@material-ui/core/styles'\r\nimport { ClusterValidPods } from '@jfvilas/plugin-kwirth-common'\r\n\r\ninterface IProps {\r\n\tresources: ClusterValidPods[]\r\n\tselectedClusterName: string\r\n\tonSelect:(name:string|undefined) => void\r\n}\r\n\r\nconst useStyles = makeStyles((_theme: Theme) => ({\r\n    clusterBox: {\r\n      display: 'flex',\r\n      marginTop: '8px',\r\n    },\r\n}));\r\n   \r\nconst ClusterList = (props: IProps) => {  \r\n    const classes=useStyles();\r\n    const { resources, selectedClusterName, onSelect } = props;\r\n  \r\n\treturn (\r\n\t\t<>\r\n\t\t<CardHeader title={'Clusters'}/>\r\n\t\t\r\n\t\t<Divider style={{marginTop:8}}/>\r\n\r\n\t\t<List dense>\r\n\t\t\t{resources.map((cluster, index) => (\r\n\t\t\t<ListItem button key={index} selected={selectedClusterName === cluster.name} onClick={() => onSelect(cluster.name)} disabled={cluster.data.length===0}>\r\n\t\t\t\t<ListItemText\r\n\t\t\t\tprimary={cluster.name}\r\n\t\t\t\tsecondary={\r\n\t\t\t\t\t<Box component={'span'} className={classes.clusterBox}>\r\n\t\t\t\t\t<Typography component={'span'} style={{fontSize:12}}>\r\n\t\t\t\t\t\t{cluster.title}\r\n\t\t\t\t\t</Typography>\r\n\t\t\t\t\t</Box>\r\n\t\t\t\t}\r\n\t\t\t\t/>\r\n\t\t\t</ListItem>\r\n\t\t\t))}\r\n\t\t</List>\r\n\t\t</>\r\n\t)\r\n}\r\n\r\nexport { ClusterList }"],"names":[],"mappings":";;;;;;;;;;AAiBA,MAAM,SAAA,GAAY,UAAW,CAAA,CAAC,MAAmB,MAAA;AAAA,EAC7C,UAAY,EAAA;AAAA,IACV,OAAS,EAAA,MAAA;AAAA,IACT,SAAW,EAAA;AAAA;AAEjB,CAAE,CAAA,CAAA;AAEI,MAAA,WAAA,GAAc,CAAC,KAAkB,KAAA;AACnC,EAAA,MAAM,UAAQ,SAAU,EAAA;AACxB,EAAA,MAAM,EAAE,SAAA,EAAW,mBAAqB,EAAA,QAAA,EAAa,GAAA,KAAA;AAExD,EAAA,iFAEE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,OAAO,UAAW,EAAA,CAAA,sCAE7B,OAAQ,EAAA,EAAA,KAAA,EAAO,EAAC,SAAU,EAAA,CAAA,IAAG,CAE9B,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,KAAK,EAAA,IAAA,EAAA,EACT,UAAU,GAAI,CAAA,CAAC,SAAS,KACzB,qBAAA,KAAA,CAAA,aAAA,CAAC,YAAS,MAAM,EAAA,IAAA,EAAC,KAAK,KAAO,EAAA,QAAA,EAAU,wBAAwB,OAAQ,CAAA,IAAA,EAAM,SAAS,MAAM,QAAA,CAAS,QAAQ,IAAI,CAAA,EAAG,UAAU,OAAQ,CAAA,IAAA,CAAK,WAAS,CACnJ,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACD,SAAS,OAAQ,CAAA,IAAA;AAAA,MACjB,2BACE,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,WAAW,MAAQ,EAAA,SAAA,EAAW,QAAQ,UAC3C,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAW,SAAW,EAAA,MAAA,EAAQ,OAAO,EAAC,QAAA,EAAS,IAC9C,EAAA,EAAA,OAAA,CAAQ,KACV,CACA;AAAA;AAAA,GAGF,CACC,CACF,CACA,CAAA;AAEF;;;;"}

package/dist/components/ComponentNotFound/ComponentNotFound.esm.js

@@ -0,0 +1,60 @@
+import React from 'react';
+import { CodeSnippet } from '@backstage/core-components';
+import { Grid, Typography, Button } from '@material-ui/core';
+import KubelogComponentNotFound from '../../assets/kwirth-log-component-not-found.svg';
+import { ANNOTATION_KUBELOG_LOCATION } from '@jfvilas/plugin-kubelog-common';
+
+var ErrorType = /* @__PURE__ */ ((ErrorType2) => {
+  ErrorType2[ErrorType2["NO_PODS"] = 0] = "NO_PODS";
+  ErrorType2[ErrorType2["NO_CLUSTERS"] = 1] = "NO_CLUSTERS";
+  return ErrorType2;
+})(ErrorType || {});
+const KUBERNETES_YAML = `apiVersion: apps/v1
+kind: Deployment
+metadata:
+  name: '$entityName'
+  description: '$entityDescription'
+  labels:
+    ${ANNOTATION_KUBELOG_LOCATION}: '$entityName'
+spec:
+  selector:
+    matchLabels:
+      app: '$entityName'
+  template:
+    metadata:
+      name: '$entityName'-pod
+      labels:
+        app: '$entityName'
+        ${ANNOTATION_KUBELOG_LOCATION}: '$entityName'
+    spec:
+      containers:
+        - name: '$entityName'
+          image: your-OCI-image
+    ...`;
+const ComponentNotFound = (props) => {
+  var text = "";
+  var content = /* @__PURE__ */ React.createElement(
+    CodeSnippet,
+    {
+      text: KUBERNETES_YAML.replaceAll("$entityName", props.entity.metadata.name).replaceAll("$entityDescription", props.entity.metadata.description),
+      language: "yaml",
+      showLineNumbers: true,
+      highlightedNumbers: [7, 17],
+      customStyle: { background: "inherit" }
+    }
+  );
+  var nopodsMsg = `Although this component is well tagged, and we have found some clusters configured in Backstage, we were unable to find "${props.entity.metadata.name}" running on any pod. Maybe you need to tag Kubernetes objects (deployment and pod templates).`;
+  var noclustersMsg = `Although this component has a correct 'kubernetes-id' in the ${props.entity.metadata.name} Component YAML, we couldn't find any cluster. Maybe you need to tag Kubernetes objects (deployments and pod templates).`;
+  switch (props.error) {
+    case 0 /* NO_PODS */:
+      text = nopodsMsg;
+      break;
+    case 1 /* NO_CLUSTERS */:
+      text = noclustersMsg;
+      break;
+  }
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "row", justifyContent: "flex-start", alignItems: "flex-start", spacing: 2 }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 6, md: 6 }, /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "column" }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: true }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, "Component not found")), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: true }, /* @__PURE__ */ React.createElement(Typography, { variant: "body1" }, text)), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: true }, content))), /* @__PURE__ */ React.createElement("img", { src: KubelogComponentNotFound, style: { left: "10%", marginTop: "10%", width: "30%", position: "relative" } })), /* @__PURE__ */ React.createElement(Button, { variant: "contained", color: "primary", target: "_blank", href: "https://backstage.io/docs/features/kubernetes/configuration#surfacing-your-kubernetes-components-as-part-of-an-entity" }, "READ MORE"));
+};
+
+export { ComponentNotFound, ErrorType };
+//# sourceMappingURL=ComponentNotFound.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ComponentNotFound.esm.js","sources":["../../../src/components/ComponentNotFound/ComponentNotFound.tsx"],"sourcesContent":["/*\r\nCopyright 2024 Julio Fernandez\r\n\r\nLicensed under the Apache License, Version 2.0 (the \"License\");\r\nyou may not use this file except in compliance with the License.\r\nYou may obtain a copy of the License at\r\n\r\n    http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nUnless required by applicable law or agreed to in writing, software\r\ndistributed under the License is distributed on an \"AS IS\" BASIS,\r\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\nSee the License for the specific language governing permissions and\r\nlimitations under the License.\r\n*/\r\nimport React from 'react'\r\nimport { Entity } from '@backstage/catalog-model'\r\nimport { CodeSnippet } from '@backstage/core-components'\r\nimport { Button, Grid, Typography } from '@material-ui/core'\r\nimport KubelogComponentNotFound from '../../assets/kwirth-log-component-not-found.svg'\r\nimport { ANNOTATION_KUBELOG_LOCATION } from '@jfvilas/plugin-kubelog-common'\r\n\r\nenum ErrorType {\r\n  NO_PODS,\r\n  NO_CLUSTERS\r\n}\r\n\r\nconst KUBERNETES_YAML = `apiVersion: apps/v1\r\nkind: Deployment\r\nmetadata:\r\n  name: '$entityName'\r\n  description: '$entityDescription'\r\n  labels:\r\n    ${ANNOTATION_KUBELOG_LOCATION}: '$entityName'\r\nspec:\r\n  selector:\r\n    matchLabels:\r\n      app: '$entityName'\r\n  template:\r\n    metadata:\r\n      name: '$entityName'-pod\r\n      labels:\r\n        app: '$entityName'\r\n        ${ANNOTATION_KUBELOG_LOCATION}: '$entityName'\r\n    spec:\r\n      containers:\r\n        - name: '$entityName'\r\n          image: your-OCI-image\r\n    ...`;\r\n\r\nconst ComponentNotFound = (props: {error: ErrorType, entity:Entity}) => {\r\n    var text:string='';\r\n    var content:JSX.Element=<CodeSnippet\r\n      text={KUBERNETES_YAML.replaceAll('$entityName', props.entity.metadata.name).replaceAll('$entityDescription',props.entity.metadata.description!)}\r\n      language=\"yaml\"\r\n      showLineNumbers\r\n      highlightedNumbers={[7, 17]}\r\n      customStyle={{ background: 'inherit' }}\r\n    />;\r\n\r\n    var nopodsMsg=`Although this component is well tagged, and we have found some clusters configured in Backstage, we were unable to find \"${props.entity.metadata.name}\" running on any pod. Maybe you need to tag Kubernetes objects (deployment and pod templates).`;\r\n    var noclustersMsg=`Although this component has a correct 'kubernetes-id' in the ${props.entity.metadata.name} Component YAML, we couldn't find any cluster. Maybe you need to tag Kubernetes objects (deployments and pod templates).`;\r\n  \r\n    switch(props.error) {\r\n      case ErrorType.NO_PODS:\r\n        text=nopodsMsg;\r\n        break;\r\n      case ErrorType.NO_CLUSTERS:\r\n        text=noclustersMsg;\r\n        break;\r\n    }\r\n\r\n    return (<>\r\n        <Grid container direction=\"row\" justifyContent=\"flex-start\" alignItems=\"flex-start\" spacing={2} >\r\n            <Grid item xs={6} md={6}>\r\n                <Grid container direction=\"column\">\r\n                    <Grid item xs>\r\n                    <Typography variant=\"h5\">{'Component not found'}</Typography>\r\n                    </Grid>\r\n                    <Grid item xs>\r\n                    <Typography variant=\"body1\">{text}</Typography>\r\n                    </Grid>\r\n                    <Grid item xs>\r\n                    {content}\r\n                    </Grid>\r\n                </Grid>\r\n            </Grid>\r\n            <img src={KubelogComponentNotFound} style={{ left:'10%', marginTop:'10%', width:'30%', position:'relative' }} />\r\n        </Grid>\r\n        <Button variant=\"contained\" color=\"primary\" target=\"_blank\" href=\"https://backstage.io/docs/features/kubernetes/configuration#surfacing-your-kubernetes-components-as-part-of-an-entity\">\r\n            READ MORE\r\n        </Button>\r\n    </>);\r\n}\r\n\r\nexport { ComponentNotFound, ErrorType }"],"names":["ErrorType"],"mappings":";;;;;;AAsBK,IAAA,SAAA,qBAAAA,UAAL,KAAA;AACE,EAAAA,UAAA,CAAA,UAAA,CAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,SAAA;AACA,EAAAA,UAAA,CAAA,UAAA,CAAA,aAAA,CAAA,GAAA,CAAA,CAAA,GAAA,aAAA;AAFG,EAAAA,OAAAA,UAAAA;AAAA,CAAA,EAAA,SAAA,IAAA,EAAA;AAKL,MAAM,eAAkB,GAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAA,EAMlB,2BAA2B,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAAA,EAUvB,2BAA2B,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAAA,CAAA;AAO/B,MAAA,iBAAA,GAAoB,CAAC,KAA6C,KAAA;AACpE,EAAA,IAAI,IAAY,GAAA,EAAA;AAChB,EAAA,IAAI,OAAoB,mBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACvB,IAAM,EAAA,eAAA,CAAgB,UAAW,CAAA,aAAA,EAAe,MAAM,MAAO,CAAA,QAAA,CAAS,IAAI,CAAA,CAAE,UAAW,CAAA,oBAAA,EAAqB,KAAM,CAAA,MAAA,CAAO,SAAS,WAAY,CAAA;AAAA,MAC9I,QAAS,EAAA,MAAA;AAAA,MACT,eAAe,EAAA,IAAA;AAAA,MACf,kBAAA,EAAoB,CAAC,CAAA,EAAG,EAAE,CAAA;AAAA,MAC1B,WAAA,EAAa,EAAE,UAAA,EAAY,SAAU;AAAA;AAAA,GACvC;AAEA,EAAA,IAAI,SAAU,GAAA,CAAA,yHAAA,EAA4H,KAAM,CAAA,MAAA,CAAO,SAAS,IAAI,CAAA,8FAAA,CAAA;AACpK,EAAA,IAAI,aAAc,GAAA,CAAA,6DAAA,EAAgE,KAAM,CAAA,MAAA,CAAO,SAAS,IAAI,CAAA,wHAAA,CAAA;AAE5G,EAAA,QAAO,MAAM,KAAO;AAAA,IAClB,KAAK,CAAA;AACH,MAAK,IAAA,GAAA,SAAA;AACL,MAAA;AAAA,IACF,KAAK,CAAA;AACH,MAAK,IAAA,GAAA,aAAA;AACL,MAAA;AAAA;AAGJ,EAAA,iFACK,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,WAAS,IAAC,EAAA,SAAA,EAAU,OAAM,cAAe,EAAA,YAAA,EAAa,YAAW,YAAa,EAAA,OAAA,EAAS,qBACxF,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,GAAG,EAAI,EAAA,CAAA,EAAA,sCACjB,IAAK,EAAA,EAAA,SAAA,EAAS,MAAC,SAAU,EAAA,QAAA,EAAA,sCACrB,IAAK,EAAA,EAAA,IAAA,EAAI,MAAC,EAAE,EAAA,IAAA,EAAA,sCACZ,UAAW,EAAA,EAAA,OAAA,EAAQ,QAAM,qBAAsB,CAChD,mBACC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAE,wBACZ,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,SAAQ,OAAS,EAAA,EAAA,IAAK,CAClC,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,IAAI,EAAA,IAAA,EAAC,IAAE,IACZ,EAAA,EAAA,OACD,CACJ,CACJ,CAAA,sCACC,KAAI,EAAA,EAAA,GAAA,EAAK,0BAA0B,KAAO,EAAA,EAAE,MAAK,KAAO,EAAA,SAAA,EAAU,OAAO,KAAM,EAAA,KAAA,EAAO,UAAS,UAAW,EAAA,EAAG,CAClH,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAO,OAAQ,EAAA,WAAA,EAAY,OAAM,SAAU,EAAA,MAAA,EAAO,UAAS,IAAK,EAAA,uHAAA,EAAA,EAAwH,WAEzL,CACJ,CAAA;AACJ;;;;"}