Add buttons to quicky filter the current view by a specific namespace (#6677)

* Add quick namespace filtering in pods view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to HorizontalPodAutoscalers view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Leases view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to LimitRanges view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to ConfigMaps view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Remove last usage of legacy global Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to PodDisruptionBudgets view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to ResourceQuotas view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Secrets view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Remove last usage of legacy global secretsStore Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to CustomResources view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Events view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to HelmReleases view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Endpoints view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Remove last usage of legacy global endpointsStore Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Ingresses view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to NetworkPolicies view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to PortForwards view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Services view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to PersistentVolumeClaims view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to RoleBindings view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Roles view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to ServiceAccounts view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to CronJobs view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to DaemonSets view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Deployments view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to Jobs view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to StatefulSets view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add quick namespace filtering to ReplicaSets view Signed-off-by: Sebastian Malton <sebastian@malton.name> * Remove last usage of legacy global replicaSetStore Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix up missing styles Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix tests Signed-off-by: Sebastian Malton <sebastian@malton.name> Signed-off-by: Sebastian Malton <sebastian@malton.name>
2025-05-20 05:10:56 +00:00 · 2022-12-01 09:20:56 -05:00
1 parent ab4a99bd93
commit a546f3b8ae
@@ -15,9 +15,12 @@ import { prevDefault, stopPropagation } from "../../utils";
 import { DrawerTitle } from "../drawer";
 import { Table, TableCell, TableHead, TableRow } from "../table";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
-import { replicaSetStore } from "../+workloads-replicasets/legacy-store";
-import { showDetails } from "../kube-detail-params";
 import { KubeObjectAge } from "../kube-object/age";
+import type { ReplicaSetStore } from "../+workloads-replicasets/store";
+import type { ShowDetails } from "../kube-detail-params/show-details.injectable";
+import { withInjectables } from "@ogre-tools/injectable-react";
+import showDetailsInjectable from "../kube-detail-params/show-details.injectable";
+import replicaSetStoreInjectable from "../+workloads-replicasets/store.injectable";


 enum sortBy {
@@ -31,14 +34,23 @@ export interface DeploymentReplicaSetsProps {
  replicaSets: ReplicaSet[];
 }

+interface Dependencies {
+  replicaSetStore: ReplicaSetStore;
+  showDetails: ShowDetails;
+}
+
@observer
-export class DeploymentReplicaSets extends React.Component<DeploymentReplicaSetsProps> {
+class NonInjectedDeploymentReplicaSets extends React.Component<DeploymentReplicaSetsProps & Dependencies> {
  getPodsLength(replicaSet: ReplicaSet) {
-    return replicaSetStore.getChildPods(replicaSet).length;
+    return this.props.replicaSetStore.getChildPods(replicaSet).length;
  }

  render() {
-    const { replicaSets } = this.props;
+    const {
+      replicaSets,
+      replicaSetStore,
+      showDetails,
+    } = this.props;

    if (!replicaSets.length && !replicaSetStore.isLoaded) return (
      <div className="ReplicaSets"><Spinner center/></div>
@@ -95,6 +107,14 @@ export class DeploymentReplicaSets extends React.Component<DeploymentReplicaSets
  }
 }

+export const DeploymentReplicaSets = withInjectables<Dependencies, DeploymentReplicaSetsProps>(NonInjectedDeploymentReplicaSets, {
+  getProps: (di, props) => ({
+    ...props,
+    replicaSetStore: di.inject(replicaSetStoreInjectable),
+    showDetails: di.inject(showDetailsInjectable),
+  }),
+});
+
 export function ReplicaSetMenu(props: KubeObjectMenuProps<ReplicaSet>) {
  return (
    <KubeObjectMenu {...props}/>
@@ -42,5 +42,9 @@
        }
      }
    }
+
+    a.filterNamespace {
+      border-bottom: unset;
+    }
  }
 }
@@ -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<Dependencies> {
  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 (
      <SiblingsInTabLayout>
        <KubeObjectListLayout
@@ -82,7 +99,13 @@ export class Deployments extends React.Component {
          renderTableContents={deployment => [
            deployment.getName(),
            <KubeObjectStatusIcon key="icon" object={deployment} />,
-            deployment.getNs(),
+            <a
+              key="namespace"
+              className="filterNamespace"
+              onClick={prevDefault(() => filterByNamespace(deployment.getNs()))}
+            >
+              {deployment.getNs()}
+            </a>,
            this.renderPods(deployment),
            deployment.getReplicas(),
            <KubeObjectAge key="age" object={deployment} />,
@@ -93,3 +116,12 @@ export class Deployments extends React.Component {
    );
  }
 }
+
+export const Deployments = withInjectables<Dependencies>(NonInjectedDeployments, {
+  getProps: (di, props) => ({
+    ...props,
+    deploymentStore: di.inject(deploymentStoreInjectable),
+    eventStore: di.inject(eventStoreInjectable),
+    filterByNamespace: di.inject(filterByNamespaceInjectable),
+  }),
+});
@@ -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);