@jfvilas/plugin-kwirth-log 0.12.7 → 0.13.0

package/README.md

@@ -28,7 +28,9 @@ 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.
+4. Next step is to identify the Kubernetes objects that match requested entity. As well as it occurs with other Backstage Kwirth plugins, Kwirth implements two strategies for getting the listo of kubernetes objects that match:
+  - Option 1. Your catalog-info contains an annotation of this type: **backstage.io/kubernetes-id**. In this case, the Backstage 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.
+  - Option 2. Your catalog-info contains an annotation of this type: **backstage.io/kubernetes-label-selector**. In this case, the Backstage 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 whose labels match with the kubernetes-label-selector label selector*. 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.
@@ -41,8 +43,10 @@ Following table shows version compatibility between this Kwirth Backstage plugin
 
 | Plugin Kwirth version | Kwirth version |
 |-|-|
-|0.11.3|0.3.160|
+|0.13.0|0.4.131|
+|0.12.8|0.4.45|
 |0.12.5|0.4.20|
+|0.11.3|0.3.160|
 
 
 ## Installation
@@ -75,7 +79,7 @@ For Kwirth plugin to be usable on the frontend, you must tailor your Entity Page
     ```
 
     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
+    ```jsx
     // Note: Add to any other Pages as well (e.g. defaultEntityPage or webSiteEntityPage, for example)
     const serviceEntityPage = (
       <EntityLayout>
@@ -87,15 +91,47 @@ For Kwirth plugin to be usable on the frontend, you must tailor your Entity Page
     )
     ```
 
-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.
+    You can setup some default *viewing* options on the `EntityKwirthLogContent` component, so, when the entity loads the default options will be set. These options are:
+    - `formStart`
+    - `showNames`
+    - `showTimestamp`
+    - `followLog`
+    - `wrapLines`
+    (The meaning of these properties are explained at the end of this document)
+
+    For example, you could setup your default log stream like this:
+    ```jsx
+      ...
+      <EntityLayout.Route if={isKwirthAvailable} path="/kwirthlog" title="KwirthLog">
+        <EntityKwirthLogContent enableRestart={false} fromStrat={true} showTimestamp={true} wrapLines={true} />
+      </EntityLayout.Route>
+      ...
+    ```
+
+2. Label your catalog-info according to one of these two startegies:
+
+- **Strategy 1: one-to-one**. Add `backstage.io/kubernetes-id` annotation to your `catalog-info.yaml` for the entities deployed to Kubernetes you want to work with on Backstage. This is the same annotation that the Kubernetes core plugin uses, so, maybe you already have added it to your components. Exmaple:
+
+    ```yaml
+    metadata:
+      annotations:
+        backstage.io/kubernetes-id: entity001
+    ```
+
+- **Strategy 2: use selectors**. Add `backstage.io/kubernetes-label-selector` annotation to your `catalog-info.yaml` for the entities you want to work with. This is the same annotation that the Kubernetes core plugin uses, so, maybe you already have added it to your components. The label selector value follows Kubernetes [label selector semantics](https://kubernetes.io/docs/concepts/overview/working-with-objects/labels/). Example:
 
     ```yaml
     metadata:
       annotaations:
-        backstage.io/kubernetes-id: entity-name
+        backstage.io/kubernetes-id: 'app=core,artifact=backend'
     ```
 
-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:
+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**).
+
+- ***VERY IMPORTANT NOTE:*** If you opted for using label selectors **you have nothing new to add to your pods**.
+
+- If you use labels (no label selectors), please note that the kubernetes-id label is **on the deployment** and on the **spec pod template** also. This is an example of a typical Kubernetes deployment with the required label:
+
 
     ```yaml
     apiVersion: apps/v1
@@ -121,8 +157,6 @@ For Kwirth plugin to be usable on the frontend, you must tailor your Entity Page
         ...    
     ```
 
-    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:
 
@@ -150,6 +184,13 @@ Now you will see your log refreshing in real-time. If you selected more than one
 
 ![running](https://raw.githubusercontent.com/jfvilas/plugin-kwirth-log/master/images/kwirthlog-running.png)
 
+### Filtering
+When the log stream starts you will see a filter text field you can use for filtering messages. The use is as follows:
+  - If you type something, the messages (or the pod names or the container names) are expected to match that text.
+  - If you select `Aa`, the text match will be performed taking **casing** into account.
+  - If you select `.*` then the text entered will be treated as a regular expression.
+  - You can select *casing* and *regex* if you want regexes to match taking casing into account.
+
 Feel free to open issues and ask for more features.
 
 ## Status information
@@ -166,3 +207,21 @@ This is how it feels:
 
 If you click on one of the status icons when theyr are enableds (coloured), you will see the detail of the status.
 ![status detail](https://raw.githubusercontent.com/jfvilas/plugin-kwirth-log/master/images/kwirthlog-status-detail.png)
+
+## Log stream options
+The log streaming system implemented in KwirthLog has some configuration options whose meaning is explained below.
+
+### From start (`fromStart`)
+If checked, the log streams will be retieved since pod start time. Please be careful with this option, it may impact your browser performance.
+
+### Show message time (`showTimestamp`)
+Decide whether to show timestamps next to messages or not. Usually your application logs messages with timestamp, but it this doesn't occur you can add message time (as provided by Kubernetes) to your messages.
+
+### Show pod names (`showNames`)
+Show pod names and container names next to messages. You may need to use this option if you are showing messages from different sources.
+
+### Follow log stream (`followLog`)
+If you activate this option, the log stream wil move to the end wehn a new messages arrives (it's like a `tail -f`).
+
+### Wrap log lines (`wrapLines`)
+Normally, KwirthLog will add hotizontal and vertical scrollers as needed in order to preserve original log lines, but you can activate this option to wrap lines and not to show horizontal scroller.

package/dist/api/KwirthLogClient.esm.js

@@ -1,4 +1,4 @@
-import { getVersion, getResources, requestAccess } from '@jfvilas/plugin-kwirth-common';
+import { getVersion, getInfo, getResources, requestAccess } from '@jfvilas/plugin-kwirth-common';
 
 class KwirthLogClient {
   discoveryApi;
@@ -12,70 +12,18 @@ class KwirthLogClient {
    * @param entity 
    * @returns an array of clusters (with their correpsonding info) and a pod list for each, where the entity has been dicovered
    */
-  // +++ test
   async getVersion() {
     return getVersion(this.discoveryApi, this.fetchApi);
   }
-  // async getVersion(): Promise<string> {
-  //     try {
-  //         const baseUrl = await this.discoveryApi.getBaseUrl('kwirth')
-  //         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}`)
-  //     }
-  // }
-  // move to common
-  // async getResources(entity:Entity): Promise<ClusterValidPods> {
-  //     try {
-  //         const baseUrl = await this.discoveryApi.getBaseUrl('kwirth')
-  //         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() as ClusterValidPods
-  //         if (!result.ok) {
-  //             throw new Error(`getResources error: not ok`)
-  //         }
-  //         return data
-  //     }
-  //     catch (err) {
-  //         throw new Error(`getResources error: ${err}`)
-  //     }
-  // }
+  async getInfo() {
+    return getInfo(this.discoveryApi, this.fetchApi);
+  }
   async getResources(entity) {
     return getResources(this.discoveryApi, this.fetchApi, entity);
   }
   async requestAccess(entity, channel, scopes) {
     return requestAccess(this.discoveryApi, this.fetchApi, entity, channel, scopes);
   }
-  // async requestAccess(entity:Entity, channel:string, scopes:InstanceConfigScopeEnum[]): Promise<ClusterValidPods[]> {
-  //     try {
-  //         const baseUrl = await this.discoveryApi.getBaseUrl('kwirth')
-  //         var targetUrl:URL= 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() as ClusterValidPods[]
-  //         // we reconstruct the 'Map' from string of arrays
-  //         for (var c of data) {
-  //             c.accessKeys = new Map(JSON.parse(((c as any).accessKeys)))
-  //         }
-  //         if (!result.ok) {
-  //             throw new Error(`requestAccess error: not ok`)
-  //         }
-  //         return data
-  //     }
-  //     catch (err) {
-  //         throw new Error(`requestAccess error: ${err}`)
-  //     }
-  // }
 }
 
 export { KwirthLogClient };

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

@@ -1 +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, getResources, getVersion, requestAccess } 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    // +++ test\r\n    async getVersion() : Promise<string> {\r\n        return getVersion(this.discoveryApi, this.fetchApi)\r\n    }\r\n    // async getVersion(): Promise<string> {\r\n    //     try {\r\n    //         const baseUrl = await this.discoveryApi.getBaseUrl('kwirth')\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    // move to common\r\n    // async getResources(entity:Entity): Promise<ClusterValidPods> {\r\n    //     try {\r\n    //         const baseUrl = await this.discoveryApi.getBaseUrl('kwirth')\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    async getResources(entity:Entity): Promise<ClusterValidPods> {\r\n        return getResources(this.discoveryApi, this.fetchApi, entity)\r\n    }\r\n\r\n    async requestAccess(entity:Entity, channel:string, scopes:InstanceConfigScopeEnum[]): Promise<ClusterValidPods[]> {\r\n        return requestAccess(this.discoveryApi, this.fetchApi, entity, channel, scopes)\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('kwirth')\r\n    //         var targetUrl:URL= new URL (`${baseUrl}/access`)\r\n    //         targetUrl.searchParams.append('scopes',scopes.join(','))\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":";;AA0BO,MAAM,eAAwC,CAAA;AAAA,EAChC,YAAA;AAAA,EACA,QAAA;AAAA,EAEjB,YAAY,OAAiC,EAAA;AACzC,IAAA,IAAA,CAAK,eAAe,OAAQ,CAAA,YAAA;AAC5B,IAAA,IAAA,CAAK,WAAW,OAAQ,CAAA,QAAA;AAAA;AAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQA,MAAM,UAA+B,GAAA;AACjC,IAAA,OAAO,UAAW,CAAA,IAAA,CAAK,YAAc,EAAA,IAAA,CAAK,QAAQ,CAAA;AAAA;AACtD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAsCA,MAAM,aAAa,MAA0C,EAAA;AACzD,IAAA,OAAO,YAAa,CAAA,IAAA,CAAK,YAAc,EAAA,IAAA,CAAK,UAAU,MAAM,CAAA;AAAA;AAChE,EAEA,MAAM,aAAA,CAAc,MAAe,EAAA,OAAA,EAAgB,MAA+D,EAAA;AAC9G,IAAA,OAAO,cAAc,IAAK,CAAA,YAAA,EAAc,KAAK,QAAU,EAAA,MAAA,EAAQ,SAAS,MAAM,CAAA;AAAA;AAClF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2BJ;;;;"}
+{"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, getInfo, getResources, getVersion, IBackendInfo, requestAccess } 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        return getVersion(this.discoveryApi, this.fetchApi)\r\n    }\r\n\r\n    async getInfo() : Promise<IBackendInfo> {\r\n        return getInfo(this.discoveryApi, this.fetchApi)\r\n    }\r\n\r\n    async getResources(entity:Entity): Promise<ClusterValidPods> {\r\n        return getResources(this.discoveryApi, this.fetchApi, entity)\r\n    }\r\n\r\n    async requestAccess(entity:Entity, channel:string, scopes:InstanceConfigScopeEnum[]): Promise<ClusterValidPods[]> {\r\n        return requestAccess(this.discoveryApi, this.fetchApi, entity, channel, scopes)\r\n    }\r\n\r\n}\r\n"],"names":[],"mappings":";;AA0BO,MAAM,eAAA,CAAwC;AAAA,EAChC,YAAA;AAAA,EACA,QAAA;AAAA,EAEjB,YAAY,OAAA,EAAiC;AACzC,IAAA,IAAA,CAAK,eAAe,OAAA,CAAQ,YAAA;AAC5B,IAAA,IAAA,CAAK,WAAW,OAAA,CAAQ,QAAA;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,MAAM,UAAA,GAA+B;AACjC,IAAA,OAAO,UAAA,CAAW,IAAA,CAAK,YAAA,EAAc,IAAA,CAAK,QAAQ,CAAA;AAAA,EACtD;AAAA,EAEA,MAAM,OAAA,GAAkC;AACpC,IAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,YAAA,EAAc,IAAA,CAAK,QAAQ,CAAA;AAAA,EACnD;AAAA,EAEA,MAAM,aAAa,MAAA,EAA0C;AACzD,IAAA,OAAO,YAAA,CAAa,IAAA,CAAK,YAAA,EAAc,IAAA,CAAK,UAAU,MAAM,CAAA;AAAA,EAChE;AAAA,EAEA,MAAM,aAAA,CAAc,MAAA,EAAe,OAAA,EAAgB,MAAA,EAA+D;AAC9G,IAAA,OAAO,cAAc,IAAA,CAAK,YAAA,EAAc,KAAK,QAAA,EAAU,MAAA,EAAQ,SAAS,MAAM,CAAA;AAAA,EAClF;AAEJ;;;;"}

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

@@ -1 +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, 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":";;AA0BO,MAAM,kBAAkB,YAA2B,CAAA;AAAA,EACxD,EAAI,EAAA;AACN,CAAC;;;;"}
+{"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, channel:string, scopes:InstanceConfigScopeEnum[]): Promise<ClusterValidPods[]>\r\n    getVersion(): Promise<any>\r\n    getInfo(): 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,YAAA,CAA2B;AAAA,EACxD,EAAA,EAAI;AACN,CAAC;;;;"}

package/dist/components/{EntityKwirthLogContent/EntityKwirthLogContent.esm.js → EntityKwirthLogContent.esm.js}

@@ -2,16 +2,13 @@ import React, { useState, useRef } from 'react';
 import useAsync from 'react-use/esm/useAsync';
 import { Progress, WarningPanel } from '@backstage/core-components';
 import { useApi, alertApiRef } from '@backstage/core-plugin-api';
-import { isKwirthAvailable, ANNOTATION_BACKSTAGE_KUBERNETES_LABELID, ANNOTATION_BACKSTAGE_KUBERNETES_LABELSELECTOR } from '@jfvilas/plugin-kwirth-common';
+import { isKwirthAvailable, ANNOTATION_BACKSTAGE_KUBERNETES_LABELID, ANNOTATION_BACKSTAGE_KUBERNETES_LABELSELECTOR, getPodList, getContainerList } from '@jfvilas/plugin-kwirth-common';
 import { useEntity, MissingAnnotationEmptyState } from '@backstage/plugin-catalog-react';
-import { kwirthLogApiRef } from '../../api/types.esm.js';
+import { kwirthLogApiRef } from '../api/types.esm.js';
 import { SignalMessageLevelEnum, InstanceConfigScopeEnum, InstanceMessageChannelEnum, InstanceMessageTypeEnum, OpsCommandEnum, accessKeySerialize, InstanceMessageFlowEnum, InstanceMessageActionEnum, InstanceConfigViewEnum, InstanceConfigObjectEnum } from '@jfvilas/kwirth-common';
-import { ComponentNotFound, ErrorType } from '../ComponentNotFound/ComponentNotFound.esm.js';
-import { ObjectSelector } from '../ObjectSelector/ObjectSelector.esm.js';
-import { Options } from '../Options/Options.esm.js';
-import { ClusterList } from '../ClusterList/ClusterList.esm.js';
-import { StatusLog } from '../StatusLog/StatusLog.esm.js';
-import { Box, Grid, Card, CardHeader, CardContent } from '@material-ui/core';
+import { Options } from './Options.esm.js';
+import { ComponentNotFound, ErrorType, ClusterList, KwirthNews, ObjectSelector, StatusLog } from '@jfvilas/plugin-kwirth-frontend';
+import { Box, Grid, Card, CardHeader, TextField, InputAdornment, CardContent } from '@material-ui/core';
 import Divider from '@material-ui/core/Divider';
 import IconButton from '@material-ui/core/IconButton';
 import Typography from '@material-ui/core/Typography';
@@ -22,7 +19,7 @@ import InfoIcon from '@material-ui/icons/Info';
 import WarningIcon from '@material-ui/icons/Warning';
 import ErrorIcon from '@material-ui/icons/Error';
 import DownloadIcon from '@material-ui/icons/CloudDownload';
-import KwirthLogLogo from '../../assets/kwirthlog-logo.svg';
+import KwirthLogLogo from '../assets/kwirthlog-logo.svg';
 import RefreshIcon from '@material-ui/icons/Refresh';
 
 const LOG_MAX_MESSAGES = 1e3;
@@ -30,7 +27,7 @@ const EntityKwirthLogContent = (props) => {
   const { entity } = useEntity();
   const kwirthLogApi = useApi(kwirthLogApiRef);
   const alertApi = useApi(alertApiRef);
-  const [resources, setResources] = useState([]);
+  const [validClusters, setResources] = useState([]);
   const [selectedClusterName, setSelectedClusterName] = useState("");
   const [selectedNamespaces, setSelectedNamespaces] = useState([]);
   const [selectedPodNames, setSelectedPodNames] = useState([]);
@@ -43,20 +40,33 @@ const EntityKwirthLogContent = (props) => {
   const [statusMessages, setStatusMessages] = useState([]);
   const [websocket, setWebsocket] = useState();
   const [instance, setInstance] = useState();
-  const kwirthLogOptionsRef = useRef({ timestamp: false, follow: true, fromStart: false });
+  const kwirthLogOptionsRef = useRef({
+    fromStart: props.fromStart !== void 0 ? props.fromStart : false,
+    showTimestamp: props.showTimestamp !== void 0 ? props.showTimestamp : false,
+    showNames: props.showNames !== void 0 ? props.showNames : true,
+    followLog: props.followLog !== void 0 ? props.followLog : true,
+    wrapLines: props.wrapLines !== void 0 ? props.wrapLines : false
+  });
   const [showStatusDialog, setShowStatusDialog] = useState(false);
   const [statusLevel, setStatusLevel] = useState(SignalMessageLevelEnum.INFO);
   const preRef = useRef(null);
   const lastRef = useRef(null);
   const [backendVersion, setBackendVersion] = useState("");
+  const [backendInfo, setBackendInfo] = useState();
   const { loading, error } = useAsync(async () => {
     if (backendVersion === "") setBackendVersion(await kwirthLogApi.getVersion());
+    if (!backendInfo) setBackendInfo(await kwirthLogApi.getInfo());
     let reqScopes = [InstanceConfigScopeEnum.VIEW];
     if (props.enableRestart) reqScopes.push(InstanceConfigScopeEnum.RESTART);
     let data = await kwirthLogApi.requestAccess(entity, InstanceMessageChannelEnum.LOG, reqScopes);
     setResources(data);
   });
   const buffer = useRef(/* @__PURE__ */ new Map());
+  const [filter, setFilter] = useState("");
+  const [filterCasing, setFilterCasing] = useState(false);
+  const [filterRegex, setFilterRegex] = useState(false);
+  const adornmentSelected = { margin: 0, borderWidth: 1, borderStyle: "solid", borderColor: "gray", paddingLeft: 3, paddingRight: 3, backgroundColor: "gray", cursor: "pointer", color: "white" };
+  const adornmentNotSelected = { margin: 0, borderWidth: 1, borderStyle: "solid", borderColor: "#f0f0f0", backgroundColor: "#f0f0f0", paddingLeft: 3, paddingRight: 3, cursor: "pointer" };
   const clickStart = (options) => {
     if (!paused.current) {
       setStarted(true);
@@ -80,21 +90,32 @@ const EntityKwirthLogContent = (props) => {
     paused.current = false;
     stopLogViewer();
   };
-  const onSelectCluster = (name) => {
-    if (name) {
-      setSelectedClusterName(name);
-      setMessages([{
-        type: InstanceMessageTypeEnum.SIGNAL,
-        text: "Select namespace in order to decide which pod logs to view.",
-        namespace: "",
-        pod: "",
-        container: ""
-      }]);
-      setSelectedNamespaces([]);
+  const onSelectCluster = (clusterName) => {
+    if (started) onClickStop();
+    if (clusterName) {
+      setSelectedClusterName(clusterName);
       setSelectedPodNames([]);
       setSelectedContainerNames([]);
       setStatusMessages([]);
-      onClickStop();
+      let cluster = validClusters.find((cluster2) => cluster2.name === clusterName);
+      if (cluster && cluster.pods) {
+        let validNamespaces = Array.from(new Set(cluster.pods.map((pod) => pod.namespace)));
+        if (validNamespaces.length === 1) {
+          setSelectedNamespaces(validNamespaces);
+          let podList = getPodList(cluster.pods, validNamespaces);
+          setSelectedPodNames(podList.map((pod) => pod.name));
+          setSelectedContainerNames(getContainerList(cluster.pods, validNamespaces, podList.map((pod) => pod.name)));
+        } else {
+          setMessages([{
+            type: InstanceMessageTypeEnum.SIGNAL,
+            text: "Select namespace in order to decide which pod logs to view.",
+            namespace: "",
+            pod: "",
+            container: ""
+          }]);
+          setSelectedNamespaces([]);
+        }
+      }
     }
   };
   const processLogMessage = (wsEvent) => {
@@ -130,7 +151,7 @@ const EntityKwirthLogContent = (props) => {
               while (prev.length > LOG_MAX_MESSAGES - 1) {
                 prev.splice(0, 1);
               }
-              if (kwirthLogOptionsRef.current.follow && lastRef.current) lastRef.current.scrollIntoView({ behavior: "instant", block: "start" });
+              if (kwirthLogOptionsRef.current.followLog && lastRef.current) lastRef.current.scrollIntoView({ behavior: "instant", block: "start" });
               return [...prev, logLine];
             });
           }
@@ -142,24 +163,28 @@ const EntityKwirthLogContent = (props) => {
             setInstance(instanceMessage.instance);
           else {
             let signalMessage = instanceMessage;
-            alertApi.post({ message: signalMessage.text, severity: "error", display: "transient" });
+            if (signalMessage.text) {
+              alertApi.post({ message: signalMessage.text, severity: "error", display: "transient" });
+            }
           }
         } else {
           let signalMessage = instanceMessage;
-          addMessage(signalMessage.level, signalMessage.text);
-          switch (signalMessage.level) {
-            case SignalMessageLevelEnum.INFO:
-              alertApi.post({ message: signalMessage.text, severity: "info", display: "transient" });
-              break;
-            case SignalMessageLevelEnum.WARNING:
-              alertApi.post({ message: signalMessage.text, severity: "warning", display: "transient" });
-              break;
-            case SignalMessageLevelEnum.ERROR:
-              alertApi.post({ message: signalMessage.text, severity: "error", display: "transient" });
-              break;
-            default:
-              alertApi.post({ message: signalMessage.text, severity: "success", display: "transient" });
-              break;
+          if (signalMessage.text) {
+            addMessage(signalMessage.level, signalMessage.text);
+            switch (signalMessage.level) {
+              case SignalMessageLevelEnum.INFO:
+                alertApi.post({ message: signalMessage.text, severity: "info", display: "transient" });
+                break;
+              case SignalMessageLevelEnum.WARNING:
+                alertApi.post({ message: signalMessage.text, severity: "warning", display: "transient" });
+                break;
+              case SignalMessageLevelEnum.ERROR:
+                alertApi.post({ message: signalMessage.text, severity: "error", display: "transient" });
+                break;
+              default:
+                alertApi.post({ message: signalMessage.text, severity: "success", display: "transient" });
+                break;
+            }
           }
         }
         break;
@@ -203,12 +228,12 @@ const EntityKwirthLogContent = (props) => {
     }
   };
   const websocketOnOpen = (ws, options) => {
-    let cluster = resources.find((cluster2) => cluster2.name === selectedClusterName);
+    let cluster = validClusters.find((cluster2) => cluster2.name === selectedClusterName);
     if (!cluster) {
       addMessage(SignalMessageLevelEnum.ERROR, "No cluster selected");
       return;
     }
-    let pods = cluster.data.filter((p2) => selectedNamespaces.includes(p2.namespace));
+    let pods = cluster.pods.filter((p2) => selectedNamespaces.includes(p2.namespace));
     if (!pods) {
       addMessage(SignalMessageLevelEnum.ERROR, "No pods found");
       return;
@@ -238,7 +263,7 @@ const EntityKwirthLogContent = (props) => {
         pod: selectedPodNames.map((p2) => p2).join(","),
         container: containers.join(","),
         data: {
-          timestamp: options.timestamp,
+          timestamp: options.showTimestamp,
           previous: false,
           maxMessages: LOG_MAX_MESSAGES,
           fromStart: options.fromStart
@@ -252,7 +277,7 @@ const EntityKwirthLogContent = (props) => {
     }
   };
   const startLogViewer = (options) => {
-    let cluster = resources.find((cluster2) => cluster2.name === selectedClusterName);
+    let cluster = validClusters.find((cluster2) => cluster2.name === selectedClusterName);
     if (!cluster) {
       addMessage(SignalMessageLevelEnum.ERROR, "No cluster selected");
       return;
@@ -314,7 +339,7 @@ const EntityKwirthLogContent = (props) => {
     URL.revokeObjectURL(url);
   };
   const onClickRestart = () => {
-    var cluster = resources.find((cluster2) => cluster2.name === selectedClusterName);
+    var cluster = validClusters.find((cluster2) => cluster2.name === selectedClusterName);
     if (!cluster) {
       addMessage(SignalMessageLevelEnum.ERROR, "No cluster selected");
       return;
@@ -328,7 +353,7 @@ const EntityKwirthLogContent = (props) => {
       addMessage(SignalMessageLevelEnum.ERROR, "No instance has been established");
       return;
     }
-    let pods = cluster.data.filter((pod) => selectedNamespaces.includes(pod.namespace));
+    let pods = cluster.pods.filter((pod) => selectedNamespaces.includes(pod.namespace));
     for (let pod of pods) {
       let opsMessage = {
         msgtype: "opsmessage",
@@ -361,7 +386,7 @@ const EntityKwirthLogContent = (props) => {
   };
   const actionButtons = () => {
     let hasViewKey = false, hasRestartKey = false;
-    let cluster = resources.find((cluster2) => cluster2.name === selectedClusterName);
+    let cluster = validClusters.find((cluster2) => cluster2.name === selectedClusterName);
     if (cluster) {
       hasViewKey = Boolean(cluster.accessKeys.get(InstanceConfigScopeEnum.VIEW));
       hasRestartKey = Boolean(cluster.accessKeys.get(InstanceConfigScopeEnum.RESTART));
@@ -373,7 +398,10 @@ const EntityKwirthLogContent = (props) => {
       setShowStatusDialog(true);
       setStatusLevel(level);
     };
-    return /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "row" }, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, title)), /* @__PURE__ */ React.createElement(Grid, { item: true, style: { marginTop: "-8px" } }, /* @__PURE__ */ React.createElement(IconButton, { title: "info", disabled: !statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.INFO), onClick: () => show(SignalMessageLevelEnum.INFO) }, /* @__PURE__ */ React.createElement(InfoIcon, { style: { color: statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.INFO) ? "blue" : "#BDBDBD" } })), /* @__PURE__ */ React.createElement(IconButton, { title: "warning", disabled: !statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.WARNING), onClick: () => show(SignalMessageLevelEnum.WARNING), style: { marginLeft: "-16px" } }, /* @__PURE__ */ React.createElement(WarningIcon, { style: { color: statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.WARNING) ? "orange" : "#BDBDBD" } })), /* @__PURE__ */ React.createElement(IconButton, { title: "error", disabled: !statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.ERROR), onClick: () => show(SignalMessageLevelEnum.ERROR), style: { marginLeft: "-16px" } }, /* @__PURE__ */ React.createElement(ErrorIcon, { style: { color: statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.ERROR) ? "red" : "#BDBDBD" } }))));
+    const prepareText = (txt) => {
+      return txt ? txt.length > 25 ? txt.substring(0, 25) + "..." : txt : "N/A";
+    };
+    return /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "row" }, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, prepareText(title))), /* @__PURE__ */ React.createElement(Grid, { item: true, style: { marginTop: "-8px" } }, /* @__PURE__ */ React.createElement(IconButton, { title: "info", disabled: !statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.INFO), onClick: () => show(SignalMessageLevelEnum.INFO) }, /* @__PURE__ */ React.createElement(InfoIcon, { style: { color: statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.INFO) ? "blue" : "#BDBDBD" } })), /* @__PURE__ */ React.createElement(IconButton, { title: "warning", disabled: !statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.WARNING), onClick: () => show(SignalMessageLevelEnum.WARNING), style: { marginLeft: "-16px" } }, /* @__PURE__ */ React.createElement(WarningIcon, { style: { color: statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.WARNING) ? "orange" : "#BDBDBD" } })), /* @__PURE__ */ React.createElement(IconButton, { title: "error", disabled: !statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.ERROR), onClick: () => show(SignalMessageLevelEnum.ERROR), style: { marginLeft: "-16px" } }, /* @__PURE__ */ React.createElement(ErrorIcon, { style: { color: statusMessages.some((m) => m.type === InstanceMessageTypeEnum.SIGNAL && m.level === SignalMessageLevelEnum.ERROR) ? "red" : "#BDBDBD" } }))));
   };
   const statusClear = (level) => {
     setStatusMessages(statusMessages.filter((m) => m.level !== level));
@@ -384,12 +412,40 @@ const EntityKwirthLogContent = (props) => {
     setSelectedPodNames(podNames);
     setSelectedContainerNames(containerNames);
   };
+  const onChangeFilter = (event) => {
+    setFilter(event.target?.value);
+  };
   const formatMessage = (logLine) => {
     if (!logLine.pod) {
       return /* @__PURE__ */ React.createElement(React.Fragment, null, logLine.text + "\n");
     }
+    if (filter !== "") {
+      if (filterCasing) {
+        if (filterRegex) {
+          try {
+            const regex = new RegExp(filter);
+            if (!regex.test(logLine.text) && !regex.test(logLine.pod) && !regex.test(logLine.container)) return /* @__PURE__ */ React.createElement(React.Fragment, null);
+          } catch {
+            return /* @__PURE__ */ React.createElement(React.Fragment, null);
+          }
+        } else {
+          if (!logLine.text.includes(filter) && !logLine.pod.includes(filter) && !logLine.container.includes(filter)) return /* @__PURE__ */ React.createElement(React.Fragment, null);
+        }
+      } else {
+        if (filterRegex) {
+          try {
+            const regex = new RegExp(filter.toLocaleLowerCase());
+            if (!regex.test(logLine.text.toLocaleLowerCase()) && !regex.test(logLine.pod.toLocaleLowerCase()) && !regex.test(logLine.container.toLocaleLowerCase())) return /* @__PURE__ */ React.createElement(React.Fragment, null);
+          } catch {
+            return /* @__PURE__ */ React.createElement(React.Fragment, null);
+          }
+        } else {
+          if (!logLine.text.toLocaleLowerCase().includes(filter.toLowerCase()) && !logLine.pod.toLocaleLowerCase().includes(filter.toLocaleLowerCase()) && !logLine.container.toLocaleLowerCase().includes(filter.toLocaleLowerCase())) return /* @__PURE__ */ React.createElement(React.Fragment, null);
+        }
+      }
+    }
     let podPrefix = /* @__PURE__ */ React.createElement(React.Fragment, null);
-    if (selectedPodNames.length !== 1) {
+    if (selectedPodNames.length !== 1 || kwirthLogOptionsRef.current.showNames) {
       podPrefix = /* @__PURE__ */ React.createElement("span", { style: { color: "green" } }, logLine.pod + " ");
     }
     let containerPrefix = /* @__PURE__ */ React.createElement(React.Fragment, null);
@@ -398,14 +454,27 @@ const EntityKwirthLogContent = (props) => {
     }
     return /* @__PURE__ */ React.createElement(React.Fragment, null, podPrefix, containerPrefix, logLine.text + "\n");
   };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, loading && /* @__PURE__ */ React.createElement(Progress, null), !isKwirthAvailable(entity) && !loading && error && /* @__PURE__ */ React.createElement(WarningPanel, { title: "An error has ocurred while obtaining data from kuebernetes clusters.", message: error?.message }), !isKwirthAvailable(entity) && !loading && /* @__PURE__ */ React.createElement(MissingAnnotationEmptyState, { readMoreUrl: "https://github.com/jfvilas/plugin-kwirth-log", annotation: [ANNOTATION_BACKSTAGE_KUBERNETES_LABELID, ANNOTATION_BACKSTAGE_KUBERNETES_LABELSELECTOR] }), isKwirthAvailable(entity) && !loading && resources && resources.length === 0 && /* @__PURE__ */ React.createElement(ComponentNotFound, { error: ErrorType.NO_CLUSTERS, entity }), isKwirthAvailable(entity) && !loading && resources && resources.length > 0 && resources.reduce((sum, cluster) => sum + cluster.data.length, 0) === 0 && /* @__PURE__ */ React.createElement(ComponentNotFound, { error: ErrorType.NO_PODS, entity }), isKwirthAvailable(entity) && !loading && resources && resources.length > 0 && resources.reduce((sum, cluster) => sum + cluster.data.length, 0) > 0 && /* @__PURE__ */ React.createElement(Box, { sx: { display: "flex", height: "70vh" } }, /* @__PURE__ */ React.createElement(Box, { sx: { width: "200px" } }, /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "column" }, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Card, null, /* @__PURE__ */ React.createElement(ClusterList, { resources, selectedClusterName, onSelect: onSelectCluster }))), /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Card, null, /* @__PURE__ */ React.createElement(Options, { options: kwirthLogOptionsRef.current, onChange: onChangeLogConfig, disabled: selectedContainerNames.length === 0 || started || paused.current }))))), /* @__PURE__ */ React.createElement(Box, { sx: { flexGrow: 1, flex: 1, overflow: "hidden", p: 1, maxWidth: "85%" } }, !selectedClusterName && /* @__PURE__ */ React.createElement("img", { src: KwirthLogLogo, alt: "No cluster selected", style: { left: "40%", marginTop: "10%", width: "20%", position: "relative" } }), selectedClusterName && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Card, { style: { marginTop: -8, height: "100%", display: "flex", flexDirection: "column" } }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, loading && /* @__PURE__ */ React.createElement(Progress, null), !isKwirthAvailable(entity) && !loading && error && /* @__PURE__ */ React.createElement(WarningPanel, { title: "An error has ocurred while obtaining data from kuebernetes clusters.", message: error?.message }), !isKwirthAvailable(entity) && !loading && /* @__PURE__ */ React.createElement(MissingAnnotationEmptyState, { readMoreUrl: "https://github.com/jfvilas/plugin-kwirth-log", annotation: [ANNOTATION_BACKSTAGE_KUBERNETES_LABELID, ANNOTATION_BACKSTAGE_KUBERNETES_LABELSELECTOR] }), isKwirthAvailable(entity) && !loading && validClusters && validClusters.length === 0 && /* @__PURE__ */ React.createElement(ComponentNotFound, { error: ErrorType.NO_CLUSTERS, entity }), isKwirthAvailable(entity) && !loading && validClusters && validClusters.length > 0 && validClusters.reduce((sum, cluster) => sum + cluster.pods.length, 0) === 0 && /* @__PURE__ */ React.createElement(ComponentNotFound, { error: ErrorType.NO_PODS, entity }), isKwirthAvailable(entity) && !loading && validClusters && validClusters.length > 0 && validClusters.reduce((sum, cluster) => sum + cluster.pods.length, 0) > 0 && /* @__PURE__ */ React.createElement(Box, { sx: { display: "flex", height: "70vh" } }, /* @__PURE__ */ React.createElement(Box, { sx: { width: "200px", maxWidth: "200px" } }, /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "column" }, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Card, null, /* @__PURE__ */ React.createElement(ClusterList, { resources: validClusters, selectedClusterName, onSelect: onSelectCluster }))), /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Card, null, /* @__PURE__ */ React.createElement(Options, { options: kwirthLogOptionsRef.current, onChange: onChangeLogConfig, disabled: selectedContainerNames.length === 0 || started || paused.current }))), /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Card, null, /* @__PURE__ */ React.createElement(KwirthNews, { latestVersions: backendInfo, backendVersion }))))), /* @__PURE__ */ React.createElement(Box, { sx: { flexGrow: 1, flex: 1, overflow: "hidden", p: 1, marginLeft: "8px" } }, !selectedClusterName && /* @__PURE__ */ React.createElement("img", { src: KwirthLogLogo, alt: "No cluster selected", style: { left: "40%", marginTop: "10%", width: "20%", position: "relative" } }), selectedClusterName && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Card, { style: { marginTop: -8, height: "100%", display: "flex", flexDirection: "column" } }, /* @__PURE__ */ React.createElement(
     CardHeader,
     {
       title: statusButtons(selectedClusterName),
       style: { marginTop: -4, marginBottom: 4, flexShrink: 0 },
       action: actionButtons()
     }
-  ), /* @__PURE__ */ React.createElement(Typography, { style: { marginLeft: 16, marginBottom: 4 } }, /* @__PURE__ */ React.createElement(ObjectSelector, { cluster: resources.find((cluster) => cluster.name === selectedClusterName), onSelect: onSelectObject, disabled: selectedClusterName === "" || started || paused.current, selectedNamespaces, selectedPodNames, selectedContainerNames })), /* @__PURE__ */ React.createElement(Divider, null), /* @__PURE__ */ React.createElement(CardContent, { style: { flexGrow: 1, overflow: "hidden", display: "flex", flexDirection: "column" } }, /* @__PURE__ */ React.createElement(Box, { style: { overflowY: "auto", overflowX: "auto", width: "100%", flexGrow: 1 } }, /* @__PURE__ */ React.createElement("pre", { ref: preRef }, messages.map((m) => formatMessage(m))), /* @__PURE__ */ React.createElement("span", { ref: lastRef }))))))), showStatusDialog && /* @__PURE__ */ React.createElement(StatusLog, { level: statusLevel, onClose: () => setShowStatusDialog(false), statusMessages, onClear: statusClear }));
+  ), /* @__PURE__ */ React.createElement(Grid, { container: true, style: { alignItems: "end" } }, /* @__PURE__ */ React.createElement(Grid, { item: true, style: { width: "66%" } }, /* @__PURE__ */ React.createElement(Typography, { style: { marginLeft: 14 } }, /* @__PURE__ */ React.createElement(ObjectSelector, { cluster: validClusters.find((cluster) => cluster.name === selectedClusterName), onSelect: onSelectObject, disabled: selectedClusterName === "" || started || paused.current, selectedNamespaces, selectedPodNames, selectedContainerNames, scope: InstanceConfigScopeEnum.VIEW }))), /* @__PURE__ */ React.createElement(Grid, { item: true, style: { width: "33%", marginLeft: 0 } }, /* @__PURE__ */ React.createElement(
+    TextField,
+    {
+      value: filter,
+      onChange: onChangeFilter,
+      label: "Filter",
+      fullWidth: true,
+      style: { marginBottom: 6, marginLeft: 0 },
+      disabled: !started,
+      InputProps: {
+        endAdornment: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(InputAdornment, { position: "start", onClick: () => started && setFilterRegex(!filterRegex), style: { margin: 0 } }, /* @__PURE__ */ React.createElement(Typography, { style: filterRegex ? adornmentSelected : adornmentNotSelected }, ".*")), /* @__PURE__ */ React.createElement(InputAdornment, { position: "start", onClick: () => started && setFilterCasing(!filterCasing), style: { margin: 0, marginLeft: 1 } }, /* @__PURE__ */ React.createElement(Typography, { style: filterCasing ? adornmentSelected : adornmentNotSelected }, "Aa")))
+      }
+    }
+  ))), /* @__PURE__ */ React.createElement(Divider, null), /* @__PURE__ */ React.createElement(CardContent, { style: { flexGrow: 1, overflow: "hidden", display: "flex", flexDirection: "column" } }, /* @__PURE__ */ React.createElement(Box, { style: { overflowY: "auto", width: "100%", flexGrow: 1 } }, /* @__PURE__ */ React.createElement("pre", { ref: preRef, style: { overflowX: kwirthLogOptionsRef.current.wrapLines ? "hidden" : "auto", whiteSpace: kwirthLogOptionsRef.current.wrapLines ? "pre-wrap" : "pre", wordBreak: kwirthLogOptionsRef.current.wrapLines ? "break-word" : "normal" } }, messages.map((m) => formatMessage(m))), /* @__PURE__ */ React.createElement("span", { ref: lastRef }))))))), showStatusDialog && /* @__PURE__ */ React.createElement(StatusLog, { level: statusLevel, onClose: () => setShowStatusDialog(false), statusMessages, onClear: statusClear }));
 };
 
 export { EntityKwirthLogContent };