Add kube-version and distro on detail panel (#3335)

src/common/catalog-entities/kubernetes-cluster.ts

@@ -55,13 +55,18 @@ export interface KubernetesClusterSpec extends CatalogEntitySpec {
   };
 }
 
+export interface KubernetesClusterMetadata extends CatalogEntityMetadata {
+  distro?: string;
+  kubeVersion?: string;
+}
+
 export type KubernetesClusterStatusPhase = "connected" | "connecting" | "disconnected" | "deleting";
 
 export interface KubernetesClusterStatus extends CatalogEntityStatus {
   phase: KubernetesClusterStatusPhase;
 }
 
-export class KubernetesCluster extends CatalogEntity<CatalogEntityMetadata, KubernetesClusterStatus, KubernetesClusterSpec> {
+export class KubernetesCluster extends CatalogEntity<KubernetesClusterMetadata, KubernetesClusterStatus, KubernetesClusterSpec> {
   public static readonly apiVersion = "entity.k8slens.dev/v1alpha1";
   public static readonly kind = "KubernetesCluster";
 

src/extensions/lens-renderer-extension.ts

@@ -23,6 +23,7 @@ import type * as registries from "./registries";
 import type { Cluster } from "../main/cluster";
 import { LensExtension } from "./lens-extension";
 import { getExtensionPageUrl } from "./registries/page-registry";
+import type { CatalogEntity } from "../common/catalog";
 
 export class LensRendererExtension extends LensExtension {
   globalPages: registries.PageRegistration[] = [];
@@ -37,7 +38,7 @@ export class LensRendererExtension extends LensExtension {
   kubeWorkloadsOverviewItems: registries.WorkloadsOverviewDetailRegistration[] = [];
   commands: registries.CommandRegistration[] = [];
   welcomeMenus: registries.WelcomeMenuRegistration[] = [];
-  catalogEntityDetailItems: registries.CatalogEntityDetailRegistration[] = [];
+  catalogEntityDetailItems: registries.CatalogEntityDetailRegistration<CatalogEntity>[] = [];
   topBarItems: registries.TopBarRegistration[] = [];
 
   async navigate<P extends object>(pageId?: string, params?: P) {

src/extensions/registries/catalog-entity-detail-registry.ts

@@ -20,20 +20,25 @@
  */
 
 import type React from "react";
+import type { CatalogEntity } from "../common-api/catalog";
 import { BaseRegistry } from "./base-registry";
 
-export interface CatalogEntityDetailComponents {
+export interface CatalogEntityDetailsProps<T extends CatalogEntity> {
-  Details: React.ComponentType<any>;
+  entity: T;
 }
 
-export interface CatalogEntityDetailRegistration {
+export interface CatalogEntityDetailComponents<T extends CatalogEntity> {
+  Details: React.ComponentType<CatalogEntityDetailsProps<T>>;
+}
+
+export interface CatalogEntityDetailRegistration<T extends CatalogEntity> {
   kind: string;
   apiVersions: string[];
-  components: CatalogEntityDetailComponents;
+  components: CatalogEntityDetailComponents<T>;
   priority?: number;
 }
 
-export class CatalogEntityDetailRegistry extends BaseRegistry<CatalogEntityDetailRegistration> {
+export class CatalogEntityDetailRegistry extends BaseRegistry<CatalogEntityDetailRegistration<CatalogEntity>> {
   getItemsForKind(kind: string, apiVersion: string) {
     const items = this.getItems().filter((item) => {
       return item.kind === kind && item.apiVersions.includes(apiVersion);

src/main/cluster-manager.ts

@@ -23,7 +23,7 @@ import "../common/cluster-ipc";
 import type http from "http";
 import { action, autorun, makeObservable, observable, observe, reaction, toJS } from "mobx";
 import { ClusterId, ClusterStore, getClusterIdFromHost } from "../common/cluster-store";
-import type { Cluster } from "./cluster";
+import { Cluster } from "./cluster";
 import logger from "./logger";
 import { apiKubePrefix } from "../common/vars";
 import { Singleton } from "../common/utils";
@@ -103,13 +103,13 @@ export class ClusterManager extends Singleton {
 
     this.updateEntityStatus(entity, cluster);
 
-    entity.metadata.labels = Object.assign({}, cluster.labels, entity.metadata.labels);
+    entity.metadata.labels = {
-    entity.metadata.labels.distro = cluster.distribution;
+      ...entity.metadata.labels,
-
+      ...cluster.labels,
-    if (cluster.preferences?.clusterName) {
+    };
-      entity.metadata.name = cluster.preferences.clusterName;
+    entity.metadata.distro = cluster.distribution;
-    }
+    entity.metadata.kubeVersion = cluster.version;
-
+    entity.metadata.name = cluster.name;
     entity.spec.metrics ||= { source: "local" };
 
     if (entity.spec.metrics.source === "local") {
@@ -236,8 +236,10 @@ export function catalogEntityFromCluster(cluster: Cluster) {
       name: cluster.name,
       source: "local",
       labels: {
-        distro: cluster.distribution,
+        ...cluster.labels,
-      }
+      },
+      distro: cluster.distribution,
+      kubeVersion: cluster.version,
     },
     spec: {
       kubeconfigPath: cluster.kubeConfigPath,

src/main/cluster.ts

@@ -235,8 +235,18 @@ export class Cluster implements ClusterModel, ClusterState {
     return this.preferences.clusterName || this.contextName;
   }
 
+  /**
+   * The detected kubernetes distribution
+   */
   @computed get distribution(): string {
-    return this.metadata.distribution?.toString() || "unknown";
+    return this.metadata[ClusterMetadataKey.DISTRIBUTION]?.toString() || "unknown";
+  }
+
+  /**
+   * The detected kubernetes version
+   */
+  @computed get version(): string {
+    return this.metadata[ClusterMetadataKey.VERSION]?.toString() || "unknown";
   }
 
   /**
@@ -251,13 +261,6 @@ export class Cluster implements ClusterModel, ClusterState {
     return toJS({ prometheus, prometheusProvider });
   }
 
-  /**
-   * Kubernetes version
-   */
-  get version(): string {
-    return String(this.metadata?.version ?? "");
-  }
-
   constructor(model: ClusterModel) {
     makeObservable(this);
     this.id = model.id;

src/renderer/bootstrap.tsx

@@ -80,6 +80,7 @@ export async function bootstrap(App: AppComponent) {
   initializers.intiKubeObjectDetailRegistry();
   initializers.initWelcomeMenuRegistry();
   initializers.initWorkloadsOverviewDetailRegistry();
+  initializers.initCatalogEntityDetailRegistry();
   initializers.initCatalog();
   initializers.initIpcRendererListeners();
 

src/renderer/initializers/catalog-entity-detail-registry.tsx

@@ -0,0 +1,50 @@
+/**
+ * Copyright (c) 2021 OpenLens Authors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of
+ * this software and associated documentation files (the "Software"), to deal in
+ * the Software without restriction, including without limitation the rights to
+ * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+ * the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+ * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+ * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+ * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+import React from "react";
+import { KubernetesCluster } from "../../common/catalog-entities";
+import { CatalogEntityDetailRegistry, CatalogEntityDetailsProps } from "../../extensions/registries";
+import { DrawerItem, DrawerTitle } from "../components/drawer";
+
+export function initCatalogEntityDetailRegistry() {
+  CatalogEntityDetailRegistry.getInstance()
+    .add([
+      {
+        apiVersions: [KubernetesCluster.apiVersion],
+        kind: KubernetesCluster.kind,
+        components: {
+          Details: ({ entity }: CatalogEntityDetailsProps<KubernetesCluster>) => (
+            <>
+              <DrawerTitle title="Kubernetes Information" />
+              <div className="box grow EntityMetadata">
+                <DrawerItem name="Distribution">
+                  {entity.metadata.distro || "unknown"}
+                </DrawerItem>
+                <DrawerItem name="Kubelet Version">
+                  {entity.metadata.kubeVersion || "unknown"}
+                </DrawerItem>
+              </div>
+            </>
+          ),
+        },
+      }
+    ]);
+}

src/renderer/initializers/index.ts

@@ -19,12 +19,13 @@
  * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  */
 
+export * from "./catalog-entity-detail-registry";
+export * from "./catalog";
 export * from "./command-registry";
 export * from "./entity-settings-registry";
+export * from "./ipc";
 export * from "./kube-object-detail-registry";
 export * from "./kube-object-menu-registry";
 export * from "./registries";
 export * from "./welcome-menu-registry";
 export * from "./workloads-overview-detail-registry";
-export * from "./catalog";
-export * from "./ipc";