From 4604198dc9144d5890cf94948fd087dc34fc88d2 Mon Sep 17 00:00:00 2001 From: Sebastian Malton Date: Wed, 30 Nov 2022 09:33:34 -0500 Subject: [PATCH] Add quick namespace filtering to Deployments view Signed-off-by: Sebastian Malton --- .../+workloads-deployments/deployments.scss | 4 ++ .../+workloads-deployments/deployments.tsx | 42 ++++++++++++++++--- .../+workloads-deployments/legacy-store.ts | 12 ------ 3 files changed, 41 insertions(+), 17 deletions(-) delete mode 100644 src/renderer/components/+workloads-deployments/legacy-store.ts diff --git a/src/renderer/components/+workloads-deployments/deployments.scss b/src/renderer/components/+workloads-deployments/deployments.scss index a1a1ac856f..322faa6d8d 100644 --- a/src/renderer/components/+workloads-deployments/deployments.scss +++ b/src/renderer/components/+workloads-deployments/deployments.scss @@ -42,5 +42,9 @@ } } } + + a.filterNamespace { + border-bottom: unset; + } } } diff --git a/src/renderer/components/+workloads-deployments/deployments.tsx b/src/renderer/components/+workloads-deployments/deployments.tsx index cc6f2a88c5..d069cd73c1 100644 --- a/src/renderer/components/+workloads-deployments/deployments.tsx +++ b/src/renderer/components/+workloads-deployments/deployments.tsx @@ -8,15 +8,20 @@ import "./deployments.scss"; import React from "react"; import { observer } from "mobx-react"; import type { Deployment } from "../../../common/k8s-api/endpoints"; -import { deploymentStore } from "./legacy-store"; -import { eventStore } from "../+events/legacy-store"; import { KubeObjectListLayout } from "../kube-object-list-layout"; -import { cssNames } from "../../utils"; +import { cssNames, prevDefault } from "../../utils"; import kebabCase from "lodash/kebabCase"; import orderBy from "lodash/orderBy"; import { KubeObjectStatusIcon } from "../kube-object-status-icon"; import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout"; import { KubeObjectAge } from "../kube-object/age"; +import type { DeploymentStore } from "./store"; +import type { EventStore } from "../+events/store"; +import type { FilterByNamespace } from "../+namespaces/namespace-select-filter-model/filter-by-namespace.injectable"; +import { withInjectables } from "@ogre-tools/injectable-react"; +import deploymentStoreInjectable from "./store.injectable"; +import eventStoreInjectable from "../+events/store.injectable"; +import filterByNamespaceInjectable from "../+namespaces/namespace-select-filter-model/filter-by-namespace.injectable"; enum columnId { name = "name", @@ -27,8 +32,14 @@ enum columnId { condition = "condition", } +interface Dependencies { + deploymentStore: DeploymentStore; + eventStore: EventStore; + filterByNamespace: FilterByNamespace; +} + @observer -export class Deployments extends React.Component { +class NonInjectedDeployments extends React.Component { renderPods(deployment: Deployment) { const { replicas, availableReplicas } = deployment.status ?? {}; @@ -50,6 +61,12 @@ export class Deployments extends React.Component { } render() { + const { + deploymentStore, + eventStore, + filterByNamespace, + } = this.props; + return ( [ deployment.getName(), , - deployment.getNs(), + filterByNamespace(deployment.getNs()))} + > + {deployment.getNs()} + , this.renderPods(deployment), deployment.getReplicas(), , @@ -93,3 +116,12 @@ export class Deployments extends React.Component { ); } } + +export const Deployments = withInjectables(NonInjectedDeployments, { + getProps: (di, props) => ({ + ...props, + deploymentStore: di.inject(deploymentStoreInjectable), + eventStore: di.inject(eventStoreInjectable), + filterByNamespace: di.inject(filterByNamespaceInjectable), + }), +}); diff --git a/src/renderer/components/+workloads-deployments/legacy-store.ts b/src/renderer/components/+workloads-deployments/legacy-store.ts deleted file mode 100644 index f7d629729b..0000000000 --- a/src/renderer/components/+workloads-deployments/legacy-store.ts +++ /dev/null @@ -1,12 +0,0 @@ -/** - * Copyright (c) OpenLens Authors. All rights reserved. - * Licensed under MIT License. See LICENSE in root directory for more information. - */ - -import { asLegacyGlobalForExtensionApi } from "../../../extensions/as-legacy-globals-for-extension-api/as-legacy-global-object-for-extension-api"; -import deploymentStoreInjectable from "./store.injectable"; - -/** - * @deprecated use `di.inject(deploymentStoreInjectable)` instead - */ -export const deploymentStore = asLegacyGlobalForExtensionApi(deploymentStoreInjectable);