mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Configurable columns in CRDs tables
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
parent
3ef06b961a
commit
7c11763e3a
@ -19,7 +19,7 @@ export const crdGroupsUrlParam = createPageParam<string[]>({
|
||||
defaultValue: [],
|
||||
});
|
||||
|
||||
enum sortBy {
|
||||
enum columnId {
|
||||
kind = "kind",
|
||||
group = "group",
|
||||
version = "version",
|
||||
@ -47,14 +47,16 @@ export class CrdList extends React.Component {
|
||||
render() {
|
||||
const selectedGroups = this.groups;
|
||||
const sortingCallbacks = {
|
||||
[sortBy.kind]: (crd: CustomResourceDefinition) => crd.getResourceKind(),
|
||||
[sortBy.group]: (crd: CustomResourceDefinition) => crd.getGroup(),
|
||||
[sortBy.version]: (crd: CustomResourceDefinition) => crd.getVersion(),
|
||||
[sortBy.scope]: (crd: CustomResourceDefinition) => crd.getScope(),
|
||||
[columnId.kind]: (crd: CustomResourceDefinition) => crd.getResourceKind(),
|
||||
[columnId.group]: (crd: CustomResourceDefinition) => crd.getGroup(),
|
||||
[columnId.version]: (crd: CustomResourceDefinition) => crd.getVersion(),
|
||||
[columnId.scope]: (crd: CustomResourceDefinition) => crd.getScope(),
|
||||
};
|
||||
|
||||
return (
|
||||
<KubeObjectListLayout
|
||||
isConfigurable
|
||||
tableId="crd"
|
||||
className="CrdList"
|
||||
isClusterScoped={true}
|
||||
store={crdStore}
|
||||
@ -97,11 +99,11 @@ export class CrdList extends React.Component {
|
||||
};
|
||||
}}
|
||||
renderTableHeader={[
|
||||
{ title: "Resource", className: "kind", sortBy: sortBy.kind },
|
||||
{ title: "Group", className: "group", sortBy: sortBy.group },
|
||||
{ title: "Version", className: "version", sortBy: sortBy.group },
|
||||
{ title: "Scope", className: "scope", sortBy: sortBy.scope },
|
||||
{ title: "Age", className: "age", sortBy: sortBy.age },
|
||||
{ title: "Resource", className: "kind", sortBy: columnId.kind, id: columnId.kind },
|
||||
{ title: "Group", className: "group", sortBy: columnId.group, id: columnId.group },
|
||||
{ title: "Version", className: "version", sortBy: columnId.version, id: columnId.version },
|
||||
{ title: "Scope", className: "scope", sortBy: columnId.scope, id: columnId.scope },
|
||||
{ title: "Age", className: "age", sortBy: columnId.age, id: columnId.age },
|
||||
]}
|
||||
renderTableContents={(crd: CustomResourceDefinition) => [
|
||||
<Link key="link" to={crd.getResourceUrl()} onClick={stopPropagation}>
|
||||
|
||||
@ -16,7 +16,7 @@ import { parseJsonPath } from "../../utils/jsonPath";
|
||||
interface Props extends RouteComponentProps<ICRDRouteParams> {
|
||||
}
|
||||
|
||||
enum sortBy {
|
||||
enum columnId {
|
||||
name = "name",
|
||||
namespace = "namespace",
|
||||
age = "age",
|
||||
@ -55,9 +55,9 @@ export class CrdResources extends React.Component<Props> {
|
||||
const isNamespaced = crd.isNamespaced();
|
||||
const extraColumns = crd.getPrinterColumns(false); // Cols with priority bigger than 0 are shown in details
|
||||
const sortingCallbacks: { [sortBy: string]: TableSortCallback } = {
|
||||
[sortBy.name]: (item: KubeObject) => item.getName(),
|
||||
[sortBy.namespace]: (item: KubeObject) => item.getNs(),
|
||||
[sortBy.age]: (item: KubeObject) => item.metadata.creationTimestamp,
|
||||
[columnId.name]: (item: KubeObject) => item.getName(),
|
||||
[columnId.namespace]: (item: KubeObject) => item.getNs(),
|
||||
[columnId.age]: (item: KubeObject) => item.metadata.creationTimestamp,
|
||||
};
|
||||
|
||||
extraColumns.forEach(column => {
|
||||
@ -66,6 +66,8 @@ export class CrdResources extends React.Component<Props> {
|
||||
|
||||
return (
|
||||
<KubeObjectListLayout
|
||||
isConfigurable
|
||||
tableId="crd_resources"
|
||||
className="CrdResources"
|
||||
isClusterScoped={!isNamespaced}
|
||||
store={store}
|
||||
@ -75,18 +77,19 @@ export class CrdResources extends React.Component<Props> {
|
||||
]}
|
||||
renderHeaderTitle={crd.getResourceTitle()}
|
||||
renderTableHeader={[
|
||||
{ title: "Name", className: "name", sortBy: sortBy.name },
|
||||
isNamespaced && { title: "Namespace", className: "namespace", sortBy: sortBy.namespace },
|
||||
{ title: "Name", className: "name", sortBy: columnId.name, id: columnId.name },
|
||||
isNamespaced && { title: "Namespace", className: "namespace", sortBy: columnId.namespace, id: columnId.namespace },
|
||||
...extraColumns.map(column => {
|
||||
const { name } = column;
|
||||
|
||||
return {
|
||||
title: name,
|
||||
className: name.toLowerCase(),
|
||||
sortBy: name
|
||||
sortBy: name,
|
||||
id: name
|
||||
};
|
||||
}),
|
||||
{ title: "Age", className: "age", sortBy: sortBy.age },
|
||||
{ title: "Age", className: "age", sortBy: columnId.age, id: columnId.age },
|
||||
]}
|
||||
renderTableContents={(crdInstance: KubeObject) => [
|
||||
crdInstance.getName(),
|
||||
|
||||
Loading…
Reference in New Issue
Block a user