From 9cee1a800e7c56544eed46ddac345c809ef7a620 Mon Sep 17 00:00:00 2001 From: Jim Ehrismann Date: Thu, 4 Feb 2021 19:11:24 -0500 Subject: [PATCH] extension support for workspace overview Signed-off-by: Jim Ehrismann --- src/extensions/extension-loader.ts | 1 + src/extensions/interfaces/registrations.ts | 1 + src/extensions/lens-renderer-extension.ts | 3 +- src/extensions/registries/index.ts | 1 + .../registries/workspace-detail-registry.ts | 15 ++++ .../+landing-page/workspace-overview.scss | 23 ++++--- .../+landing-page/workspace-overview.tsx | 68 +++++++++++-------- 7 files changed, 72 insertions(+), 40 deletions(-) create mode 100644 src/extensions/registries/workspace-detail-registry.ts diff --git a/src/extensions/extension-loader.ts b/src/extensions/extension-loader.ts index 98697d252c..e51a256002 100644 --- a/src/extensions/extension-loader.ts +++ b/src/extensions/extension-loader.ts @@ -192,6 +192,7 @@ export class ExtensionLoader { registries.appPreferenceRegistry.add(extension.appPreferences), registries.clusterFeatureRegistry.add(extension.clusterFeatures), registries.statusBarRegistry.add(extension.statusBarItems), + registries.workspaceDetailRegistry.add(extension.workspaceDetails), ]; this.events.on("remove", (removedExtension: LensRendererExtension) => { diff --git a/src/extensions/interfaces/registrations.ts b/src/extensions/interfaces/registrations.ts index ff51d9a824..f9c93bd25a 100644 --- a/src/extensions/interfaces/registrations.ts +++ b/src/extensions/interfaces/registrations.ts @@ -6,3 +6,4 @@ export type { KubeObjectStatusRegistration } from "../registries/kube-object-sta export type { PageRegistration, RegisteredPage, PageParams, PageComponentProps, PageComponents, PageTarget } from "../registries/page-registry"; export type { PageMenuRegistration, ClusterPageMenuRegistration, PageMenuComponents } from "../registries/page-menu-registry"; export type { StatusBarRegistration } from "../registries/status-bar-registry"; +export type { WorkspaceDetailRegistration } from "../registries/workspace-detail-registry"; diff --git a/src/extensions/lens-renderer-extension.ts b/src/extensions/lens-renderer-extension.ts index 8b9b132114..78c160f287 100644 --- a/src/extensions/lens-renderer-extension.ts +++ b/src/extensions/lens-renderer-extension.ts @@ -1,4 +1,4 @@ -import type { AppPreferenceRegistration, ClusterFeatureRegistration, ClusterPageMenuRegistration, KubeObjectDetailRegistration, KubeObjectMenuRegistration, KubeObjectStatusRegistration, PageMenuRegistration, PageRegistration, StatusBarRegistration, } from "./registries"; +import type { AppPreferenceRegistration, ClusterFeatureRegistration, ClusterPageMenuRegistration, KubeObjectDetailRegistration, KubeObjectMenuRegistration, KubeObjectStatusRegistration, PageMenuRegistration, PageRegistration, StatusBarRegistration, WorkspaceDetailRegistration, } from "./registries"; import type { Cluster } from "../main/cluster"; import { LensExtension } from "./lens-extension"; import { getExtensionPageUrl } from "./registries/page-registry"; @@ -16,6 +16,7 @@ export class LensRendererExtension extends LensExtension { kubeObjectDetailItems: KubeObjectDetailRegistration[] = []; kubeObjectMenuItems: KubeObjectMenuRegistration[] = []; commands: CommandRegistration[] = []; + workspaceDetails: WorkspaceDetailRegistration[] = []; async navigate

(pageId?: string, params?: P) { const { navigate } = await import("../renderer/navigation"); diff --git a/src/extensions/registries/index.ts b/src/extensions/registries/index.ts index 8e343742ec..1951f443af 100644 --- a/src/extensions/registries/index.ts +++ b/src/extensions/registries/index.ts @@ -9,3 +9,4 @@ export * from "./kube-object-detail-registry"; export * from "./kube-object-menu-registry"; export * from "./cluster-feature-registry"; export * from "./kube-object-status-registry"; +export * from "./workspace-detail-registry"; diff --git a/src/extensions/registries/workspace-detail-registry.ts b/src/extensions/registries/workspace-detail-registry.ts new file mode 100644 index 0000000000..a35c878933 --- /dev/null +++ b/src/extensions/registries/workspace-detail-registry.ts @@ -0,0 +1,15 @@ +import type React from "react"; +import { BaseRegistry } from "./base-registry"; + +export interface WorkspaceDetailComponents { + Detail: React.ComponentType; +} + +export interface WorkspaceDetailRegistration { + components: WorkspaceDetailComponents; +} + +export class WorkspaceDetailRegistry extends BaseRegistry { +} + +export const workspaceDetailRegistry = new WorkspaceDetailRegistry(); diff --git a/src/renderer/components/+landing-page/workspace-overview.scss b/src/renderer/components/+landing-page/workspace-overview.scss index 8b341e62a7..cc60fd8b69 100644 --- a/src/renderer/components/+landing-page/workspace-overview.scss +++ b/src/renderer/components/+landing-page/workspace-overview.scss @@ -1,14 +1,17 @@ .WorkspaceOverview { - background-color: var(--mainBackground); - - .TableCell { - display: flex; - align-items: left; - &.cluster-icon { - align-items: center; - flex-grow: 0.2; - padding: 0; + .ItemListLayout.WorkspaceClusters { + background-color: var(--mainBackground); + + .TableCell { + display: flex; + align-items: left; + + &.cluster-icon { + align-items: center; + flex-grow: 0.2; + padding: 0; + } } } -} \ No newline at end of file +} diff --git a/src/renderer/components/+landing-page/workspace-overview.tsx b/src/renderer/components/+landing-page/workspace-overview.tsx index b245c2294b..8626628746 100644 --- a/src/renderer/components/+landing-page/workspace-overview.tsx +++ b/src/renderer/components/+landing-page/workspace-overview.tsx @@ -8,6 +8,7 @@ import { ClusterItem, WorkspaceClusterStore } from "./workspace-cluster.store"; import { navigate } from "../../navigation"; import { clusterViewURL } from "../cluster-manager/cluster-view.route"; import { WorkspaceClusterMenu } from "./workspace-cluster-menu"; +import { workspaceDetailRegistry } from "../../../extensions/registries/workspace-detail-registry"; interface Props { workspace: Workspace; @@ -32,36 +33,45 @@ export class WorkspaceOverview extends Component { workspaceClusterStore.loadAll(); + const workspaceDetails = workspaceDetailRegistry.getItems(); + return ( - Clusters} - isClusterScoped - isSearchable={false} - isSelectable={false} - className="WorkspaceOverview" - store={workspaceClusterStore} - sortingCallbacks={{ - [sortBy.name]: (item: ClusterItem) => item.name, - [sortBy.contextName]: (item: ClusterItem) => item.cluster.contextName, - [sortBy.version]: (item: ClusterItem) => item.cluster.version, - }} - renderTableHeader={[ - { title: "Name", className: "name", sortBy: sortBy.name }, - { title: "Context", className: "context", sortBy: sortBy.contextName }, - { title: "Version", className: "version", sortBy: sortBy.version }, - { title: "Status", className: "status" }, - ]} - renderTableContents={(item: ClusterItem) => [ - item.name, - item.cluster.contextName, - item.cluster.version, - item.cluster.online ? "online" : "offline" - ]} - onDetails={this.showCluster} - renderItemMenu={(clusterItem: ClusterItem) => ( - - )} - /> +

+ Clusters
} + isClusterScoped + isSearchable={false} + isSelectable={false} + store={workspaceClusterStore} + sortingCallbacks={{ + [sortBy.name]: (item: ClusterItem) => item.name, + [sortBy.contextName]: (item: ClusterItem) => item.cluster.contextName, + [sortBy.version]: (item: ClusterItem) => item.cluster.version, + }} + renderTableHeader={[ + { title: "Name", className: "name", sortBy: sortBy.name }, + { title: "Context", className: "context", sortBy: sortBy.contextName }, + { title: "Version", className: "version", sortBy: sortBy.version }, + { title: "Status", className: "status" }, + ]} + renderTableContents={(item: ClusterItem) => [ + item.name, + item.cluster.contextName, + item.cluster.version, + item.cluster.online ? "online" : "offline" + ]} + onDetails={this.showCluster} + renderItemMenu={(clusterItem: ClusterItem) => ( + + )} + /> + { workspaceDetails.length > 0 && +
+ {workspaceDetailRegistry.getItems().map(({ components: { Detail } }, index) => )} +
+ } + ); } }