diff --git a/src/renderer/components/+config-maps/config-maps.scss b/src/renderer/components/+config-maps/config-maps.scss index e936512c42..aa3ad93385 100644 --- a/src/renderer/components/+config-maps/config-maps.scss +++ b/src/renderer/components/+config-maps/config-maps.scss @@ -20,5 +20,9 @@ &.age { flex: .5; } + + a.namespaceFilter { + border-bottom: unset; + } } } diff --git a/src/renderer/components/+config-maps/config-maps.tsx b/src/renderer/components/+config-maps/config-maps.tsx index ccfcc48962..212e8020e0 100644 --- a/src/renderer/components/+config-maps/config-maps.tsx +++ b/src/renderer/components/+config-maps/config-maps.tsx @@ -7,11 +7,16 @@ import "./config-maps.scss"; import React from "react"; import { observer } from "mobx-react"; -import { configMapStore } from "./legacy-store"; import { KubeObjectListLayout } from "../kube-object-list-layout"; import { KubeObjectStatusIcon } from "../kube-object-status-icon"; import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout"; import { KubeObjectAge } from "../kube-object/age"; +import { prevDefault } from "../../utils"; +import type { ConfigMapStore } from "./store"; +import type { FilterByNamespace } from "../+namespaces/namespace-select-filter-model/filter-by-namespace.injectable"; +import { withInjectables } from "@ogre-tools/injectable-react"; +import configMapStoreInjectable from "./store.injectable"; +import filterByNamespaceInjectable from "../+namespaces/namespace-select-filter-model/filter-by-namespace.injectable"; enum columnId { name = "name", @@ -20,8 +25,13 @@ enum columnId { age = "age", } +interface Dependencies { + configMapStore: ConfigMapStore; + filterByNamespace: FilterByNamespace; +} + @observer -export class ConfigMaps extends React.Component { +class NonInjectedConfigMaps extends React.Component { render() { return ( @@ -29,7 +39,7 @@ export class ConfigMaps extends React.Component { isConfigurable tableId="configuration_configmaps" className="ConfigMaps" - store={configMapStore} + store={this.props.configMapStore} sortingCallbacks={{ [columnId.name]: configMap => configMap.getName(), [columnId.namespace]: configMap => configMap.getNs(), @@ -51,7 +61,13 @@ export class ConfigMaps extends React.Component { renderTableContents={configMap => [ configMap.getName(), , - configMap.getNs(), + this.props.filterByNamespace(configMap.getNs()))} + > + {configMap.getNs()} + , configMap.getKeys().join(", "), , ]} @@ -60,3 +76,11 @@ export class ConfigMaps extends React.Component { ); } } + +export const ConfigMaps = withInjectables(NonInjectedConfigMaps, { + getProps: (di, props) => ({ + ...props, + configMapStore: di.inject(configMapStoreInjectable), + filterByNamespace: di.inject(filterByNamespaceInjectable), + }), +});