1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

chore: Fix type errors from CustomResources

Signed-off-by: Sebastian Malton <sebastian@malton.name>
This commit is contained in:
Sebastian Malton 2023-06-01 10:33:18 -04:00
parent cadc7e0a30
commit 544d9e2686
2 changed files with 87 additions and 95 deletions

View File

@ -2,11 +2,12 @@
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
import { getFrontEndRouteInjectable } from "../../../front-end-route-injection-token";
const customResourcesRouteInjectable = getFrontEndRouteInjectable({
id: "custom-resources-route",
path: "/crd/:group?/:name?",
path: "/crd/:group/:name",
clusterFrame: true,
});

View File

@ -8,7 +8,6 @@ import "./view.scss";
import React from "react";
import { observer } from "mobx-react";
import { KubeObjectListLayout } from "../kube-object-list-layout";
import { computed } from "mobx";
import type { ApiManager } from "../../../common/k8s-api/api-manager";
import { formatJSONValue, safeJSONPathValue } from "@k8slens/utilities";
import { TabLayout } from "../layout/tab-layout-2";
@ -37,100 +36,92 @@ export interface CustomResourcesProps {
params: ParametersFromRouteInjectable<typeof customResourcesRouteInjectable>;
}
@observer
class NonInjectedCustomResources extends React.Component<Dependencies & CustomResourcesProps> {
readonly crd = computed(() => {
if (this.props.params.group && this.props.params.name) {
return this.props.customResourceDefinitionStore.getByGroup(this.props.params.group, this.props.params.name);
}
const NonInjectedCustomResources = observer((props: Dependencies & CustomResourcesProps) => {
const {
apiManager,
customResourceDefinitionStore,
params,
} = props;
const crd = customResourceDefinitionStore.getByGroup(params.group, params.name);
const store = apiManager.getStore(crd?.getResourceApiBase());
return undefined;
});
readonly store = computed(() => this.props.apiManager.getStore(this.crd.get()?.getResourceApiBase()));
render() {
const crd = this.crd.get();
const store = this.store.get();
if (!crd || !store) {
return null;
}
const isNamespaced = crd.isNamespaced();
const extraColumns = crd.getPrinterColumns(false); // Cols with priority bigger than 0 are shown in details
const version = crd.getPreferredVersion();
return (
<TabLayout>
<KubeObjectListLayout
isConfigurable
key={`crd_resources_${crd.getResourceApiBase()}`}
tableId="crd_resources"
className="CustomResources"
store={store}
sortingCallbacks={{
[columnId.name]: customResource => customResource.getName(),
[columnId.namespace]: customResource => customResource.getNs(),
[columnId.age]: customResource => -customResource.getCreationTimestamp(),
...Object.fromEntries(extraColumns.map(({ name, jsonPath }) => [
name,
customResource => formatJSONValue(safeJSONPathValue(customResource, jsonPath)),
])),
}}
searchFilters={[
customResource => customResource.getSearchFields(),
]}
renderHeaderTitle={crd.getResourceKind()}
customizeHeader={({ searchProps, ...headerPlaceholders }) => ({
searchProps: {
...searchProps,
placeholder: `${crd.getResourceKind()} search ...`,
},
...headerPlaceholders,
})}
renderTableHeader={[
{ title: "Name", className: "name", sortBy: columnId.name, id: columnId.name },
isNamespaced
? { title: "Namespace", className: "namespace", sortBy: columnId.namespace, id: columnId.namespace }
: undefined,
...extraColumns.map(({ name }) => ({
title: name,
className: name.toLowerCase().replace(/\s+/g, "-"),
sortBy: name,
id: name,
"data-testid": `custom-resource-column-title-${name.toLowerCase().replace(/\s+/g, "-")}`,
})),
{ title: "Age", className: "age", sortBy: columnId.age, id: columnId.age },
]}
renderTableContents={customResource => [
customResource.getName(),
isNamespaced && (
<NamespaceSelectBadge namespace={customResource.getNs() as string} />
),
...extraColumns.map((column): TableCellProps => ({
"data-testid": `custom-resource-column-cell-${column.name.toLowerCase().replace(/\s+/g, "-")}-for-${customResource.getScopedName()}`,
title: formatJSONValue(safeJSONPathValue(customResource, column.jsonPath)),
})),
<KubeObjectAge key="age" object={customResource} />,
]}
failedToLoadMessage={(
<>
<p>
{`Failed to load ${crd.getPluralName()}`}
</p>
{!version.served && (
<p>
{`Preferred version (${crd.getGroup()}/${version.name}) is not served`}
</p>
)}
</>
)}
/>
</TabLayout>
);
if (!crd || !store) {
return null;
}
}
const isNamespaced = crd.isNamespaced();
const extraColumns = crd.getPrinterColumns(false); // Cols with priority bigger than 0 are shown in details
const version = crd.getPreferredVersion();
return (
<TabLayout>
<KubeObjectListLayout
isConfigurable
key={`crd_resources_${crd.getResourceApiBase()}`}
tableId="crd_resources"
className="CustomResources"
store={store}
sortingCallbacks={{
[columnId.name]: customResource => customResource.getName(),
[columnId.namespace]: customResource => customResource.getNs(),
[columnId.age]: customResource => -customResource.getCreationTimestamp(),
...Object.fromEntries(extraColumns.map(({ name, jsonPath }) => [
name,
customResource => formatJSONValue(safeJSONPathValue(customResource, jsonPath)),
])),
}}
searchFilters={[
customResource => customResource.getSearchFields(),
]}
renderHeaderTitle={crd.getResourceKind()}
customizeHeader={({ searchProps, ...headerPlaceholders }) => ({
searchProps: {
...searchProps,
placeholder: `${crd.getResourceKind()} search ...`,
},
...headerPlaceholders,
})}
renderTableHeader={[
{ title: "Name", className: "name", sortBy: columnId.name, id: columnId.name },
isNamespaced
? { title: "Namespace", className: "namespace", sortBy: columnId.namespace, id: columnId.namespace }
: undefined,
...extraColumns.map(({ name }) => ({
title: name,
className: name.toLowerCase().replace(/\s+/g, "-"),
sortBy: name,
id: name,
"data-testid": `custom-resource-column-title-${name.toLowerCase().replace(/\s+/g, "-")}`,
})),
{ title: "Age", className: "age", sortBy: columnId.age, id: columnId.age },
]}
renderTableContents={customResource => [
customResource.getName(),
isNamespaced && (
<NamespaceSelectBadge namespace={customResource.getNs() as string} />
),
...extraColumns.map((column): TableCellProps => ({
"data-testid": `custom-resource-column-cell-${column.name.toLowerCase().replace(/\s+/g, "-")}-for-${customResource.getScopedName()}`,
title: formatJSONValue(safeJSONPathValue(customResource, column.jsonPath)),
})),
<KubeObjectAge key="age" object={customResource} />,
]}
failedToLoadMessage={(
<>
<p>
{`Failed to load ${crd.getPluralName()}`}
</p>
{!version.served && (
<p>
{`Preferred version (${crd.getGroup()}/${version.name}) is not served`}
</p>
)}
</>
)}
/>
</TabLayout>
);
});
export const CustomResources = withInjectables<Dependencies, CustomResourcesProps>(NonInjectedCustomResources, {
getProps: (di, props) => ({