Switch to details panel instead of labels

Signed-off-by: Sebastian Malton <sebastian@malton.name>

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 {
-  Details: React.ComponentType<any>;
+export interface CatalogEntityDetailsProps<T extends CatalogEntity> {
+  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

@@ -106,9 +106,9 @@ export class ClusterManager extends Singleton {
     entity.metadata.labels = {
       ...entity.metadata.labels,
       ...cluster.labels,
-      distro: cluster.distribution,
-      "kube-version": cluster.version,
     };
+    entity.metadata.distro = cluster.distribution;
+    entity.metadata.kubeVersion = cluster.version;
     entity.metadata.name = cluster.name;
     entity.spec.metrics ||= { source: "local" };
 
@@ -237,9 +237,9 @@ export function catalogEntityFromCluster(cluster: Cluster) {
       source: "local",
       labels: {
         ...cluster.labels,
-        distro: cluster.distribution,
-        "kube-version": cluster.version,
-      }
+      },
+      distro: cluster.distribution,
+      kubeVersion: cluster.version,
     },
     spec: {
       kubeconfigPath: cluster.kubeConfigPath,

src/renderer/bootstrap.tsx

@@ -79,6 +79,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,49 @@
+/**
+ * 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 } from "../components/drawer";
+
+export function initCatalogEntityDetailRegistry() {
+  CatalogEntityDetailRegistry.getInstance()
+    .add([
+      {
+        apiVersions: [KubernetesCluster.apiVersion],
+        kind: KubernetesCluster.kind,
+        components: {
+          Details: ({ entity }: CatalogEntityDetailsProps<KubernetesCluster>) => (
+            <>
+              <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";