wrap columnFactories in object

Signed-off-by: Johan Haals <johan.haals@gmail.com>
This commit is contained in:
Johan Haals
2022-02-17 12:01:35 +01:00
parent b17958bc60
commit 63351cb855
5 changed files with 202 additions and 218 deletions
+57 -53
View File
@@ -102,42 +102,32 @@ export type CatalogReactUserListPickerClassKey =
export const catalogRouteRef: RouteRef<undefined>;
// @public (undocumented)
function createDomainColumn<T extends Entity>(): TableColumn<T>;
// @public (undocumented)
function createEntityRefColumn<T extends Entity>(options: {
defaultKind?: string;
}): TableColumn<T>;
// @public (undocumented)
function createEntityRelationColumn<T extends Entity>({
title,
relation,
defaultKind,
filter: entityFilter,
}: {
title: string;
relation: string;
defaultKind?: string;
filter?: {
kind: string;
};
}): TableColumn<T>;
// @public (undocumented)
function createMetadataDescriptionColumn<T extends Entity>(): TableColumn<T>;
// @public (undocumented)
function createOwnerColumn<T extends Entity>(): TableColumn<T>;
// @public (undocumented)
function createSpecLifecycleColumn<T extends Entity>(): TableColumn<T>;
// @public (undocumented)
function createSpecTypeColumn<T extends Entity>(): TableColumn<T>;
// @public (undocumented)
function createSystemColumn<T extends Entity>(): TableColumn<T>;
export const columnFactories: Readonly<{
createEntityRefColumn<T extends Entity>(options: {
defaultKind?: string;
}): TableColumn<T>;
createEntityRelationColumn<T_1 extends Entity>({
title,
relation,
defaultKind,
filter: entityFilter,
}: {
title: string;
relation: string;
defaultKind?: string | undefined;
filter?:
| {
kind: string;
}
| undefined;
}): TableColumn<T_1>;
createOwnerColumn<T_2 extends Entity>(): TableColumn<T_2>;
createDomainColumn<T_3 extends Entity>(): TableColumn<T_3>;
createSystemColumn<T_4 extends Entity>(): TableColumn<T_4>;
createMetadataDescriptionColumn<T_5 extends Entity>(): TableColumn<T_5>;
createSpecLifecycleColumn<T_6 extends Entity>(): TableColumn<T_6>;
createSpecTypeColumn<T_7 extends Entity>(): TableColumn<T_7>;
}>;
// @public (undocumented)
export type DefaultEntityFilters = {
@@ -329,24 +319,38 @@ export type EntitySourceLocation = {
integrationType?: string;
};
// Warning: (ae-missing-release-tag) "EntityTable" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
//
// @public
export function EntityTable<T extends Entity>(
props: EntityTableProps<T>,
): JSX.Element;
// @public (undocumented)
export namespace EntityTable {
var // Warning: (ae-forgotten-export) The symbol "columnFactories" needs to be exported by the entry point index.d.ts
//
// (undocumented)
columns: typeof columnFactories;
var // (undocumented)
systemEntityColumns: TableColumn<SystemEntity>[];
var // (undocumented)
componentEntityColumns: TableColumn<ComponentEntity>[];
}
export const EntityTable: {
<T extends Entity>(props: EntityTableProps<T>): JSX.Element;
columns: Readonly<{
createEntityRefColumn<T_1 extends Entity>(options: {
defaultKind?: string | undefined;
}): TableColumn<T_1>;
createEntityRelationColumn<T_2 extends Entity>({
title,
relation,
defaultKind,
filter: entityFilter,
}: {
title: string;
relation: string;
defaultKind?: string | undefined;
filter?:
| {
kind: string;
}
| undefined;
}): TableColumn<T_2>;
createOwnerColumn<T_3 extends Entity>(): TableColumn<T_3>;
createDomainColumn<T_4 extends Entity>(): TableColumn<T_4>;
createSystemColumn<T_5 extends Entity>(): TableColumn<T_5>;
createMetadataDescriptionColumn<T_6 extends Entity>(): TableColumn<T_6>;
createSpecLifecycleColumn<T_7 extends Entity>(): TableColumn<T_7>;
createSpecTypeColumn<T_8 extends Entity>(): TableColumn<T_8>;
}>;
systemEntityColumns: TableColumn<SystemEntity>[];
componentEntityColumns: TableColumn<ComponentEntity>[];
};
// @public
export interface EntityTableProps<T extends Entity> {
@@ -17,12 +17,12 @@
import { Entity } from '@backstage/catalog-model';
import { makeStyles } from '@material-ui/core';
import React, { ReactNode } from 'react';
import * as columnFactories from './columns';
import { columnFactories } from './columns';
import { componentEntityColumns, systemEntityColumns } from './presets';
import { Table, TableColumn } from '@backstage/core-components';
/**
* Props for {@link (EntityTable:function)}.
* Props for {@link EntityTable}.
*
* @public
*/
@@ -48,7 +48,7 @@ const useStyles = makeStyles(theme => ({
*
* @public
*/
export function EntityTable<T extends Entity>(props: EntityTableProps<T>) {
export const EntityTable = <T extends Entity>(props: EntityTableProps<T>) => {
const {
entities,
title,
@@ -85,7 +85,7 @@ export function EntityTable<T extends Entity>(props: EntityTableProps<T>) {
data={entities}
/>
);
}
};
EntityTable.columns = columnFactories;
@@ -30,150 +30,136 @@ import {
} from '../EntityRefLink';
/** @public */
export function createEntityRefColumn<T extends Entity>(options: {
defaultKind?: string;
}): TableColumn<T> {
const { defaultKind } = options;
function formatContent(entity: T): string {
return (
entity.metadata?.title ||
formatEntityRefTitle(entity, {
defaultKind,
})
);
}
return {
title: 'Name',
highlight: true,
customFilterAndSearch(filter, entity) {
// TODO: We could implement this more efficiently, like searching over
// each field that is displayed individually (kind, namespace, name).
// but that might confuse the user as it will behave different than a
// simple text search.
// Another alternative would be to cache the values. But writing them
// into the entity feels bad too.
return formatContent(entity).includes(filter);
},
customSort(entity1, entity2) {
// TODO: We could implement this more efficiently by comparing field by field.
// This has similar issues as above.
return formatContent(entity1).localeCompare(formatContent(entity2));
},
render: entity => (
<EntityRefLink
entityRef={entity}
defaultKind={defaultKind}
title={entity.metadata?.title}
/>
),
};
}
/** @public */
export function createEntityRelationColumn<T extends Entity>({
title,
relation,
defaultKind,
filter: entityFilter,
}: {
title: string;
relation: string;
defaultKind?: string;
filter?: { kind: string };
}): TableColumn<T> {
function getRelations(entity: T): EntityName[] {
return getEntityRelations(entity, relation, entityFilter);
}
function formatContent(entity: T): string {
return getRelations(entity)
.map(r => formatEntityRefTitle(r, { defaultKind }))
.join(', ');
}
return {
title,
customFilterAndSearch(filter, entity) {
return formatContent(entity).includes(filter);
},
customSort(entity1, entity2) {
return formatContent(entity1).localeCompare(formatContent(entity2));
},
render: entity => {
export const columnFactories = Object.freeze({
createEntityRefColumn<T extends Entity>(options: {
defaultKind?: string;
}): TableColumn<T> {
const { defaultKind } = options;
function formatContent(entity: T): string {
return (
<EntityRefLinks
entityRefs={getRelations(entity)}
defaultKind={defaultKind}
/>
entity.metadata?.title ||
formatEntityRefTitle(entity, {
defaultKind,
})
);
},
};
}
}
/** @public */
export function createOwnerColumn<T extends Entity>(): TableColumn<T> {
return createEntityRelationColumn({
title: 'Owner',
relation: RELATION_OWNED_BY,
defaultKind: 'group',
});
}
return {
title: 'Name',
highlight: true,
customFilterAndSearch(filter, entity) {
// TODO: We could implement this more efficiently, like searching over
// each field that is displayed individually (kind, namespace, name).
// but that might confuse the user as it will behave different than a
// simple text search.
// Another alternative would be to cache the values. But writing them
// into the entity feels bad too.
return formatContent(entity).includes(filter);
},
customSort(entity1, entity2) {
// TODO: We could implement this more efficiently by comparing field by field.
// This has similar issues as above.
return formatContent(entity1).localeCompare(formatContent(entity2));
},
render: entity => (
<EntityRefLink
entityRef={entity}
defaultKind={defaultKind}
title={entity.metadata?.title}
/>
),
};
},
createEntityRelationColumn<T extends Entity>({
title,
relation,
defaultKind,
filter: entityFilter,
}: {
title: string;
relation: string;
defaultKind?: string;
filter?: { kind: string };
}): TableColumn<T> {
function getRelations(entity: T): EntityName[] {
return getEntityRelations(entity, relation, entityFilter);
}
/** @public */
export function createDomainColumn<T extends Entity>(): TableColumn<T> {
return createEntityRelationColumn({
title: 'Domain',
relation: RELATION_PART_OF,
defaultKind: 'domain',
filter: {
kind: 'domain',
},
});
}
function formatContent(entity: T): string {
return getRelations(entity)
.map(r => formatEntityRefTitle(r, { defaultKind }))
.join(', ');
}
/** @public */
export function createSystemColumn<T extends Entity>(): TableColumn<T> {
return createEntityRelationColumn({
title: 'System',
relation: RELATION_PART_OF,
defaultKind: 'system',
filter: {
kind: 'system',
},
});
}
/** @public */
export function createMetadataDescriptionColumn<
T extends Entity,
>(): TableColumn<T> {
return {
title: 'Description',
field: 'metadata.description',
render: entity => (
<OverflowTooltip
text={entity.metadata.description}
placement="bottom-start"
line={2}
/>
),
width: 'auto',
};
}
/** @public */
export function createSpecLifecycleColumn<T extends Entity>(): TableColumn<T> {
return {
title: 'Lifecycle',
field: 'spec.lifecycle',
};
}
/** @public */
export function createSpecTypeColumn<T extends Entity>(): TableColumn<T> {
return {
title: 'Type',
field: 'spec.type',
};
}
return {
title,
customFilterAndSearch(filter, entity) {
return formatContent(entity).includes(filter);
},
customSort(entity1, entity2) {
return formatContent(entity1).localeCompare(formatContent(entity2));
},
render: entity => {
return (
<EntityRefLinks
entityRefs={getRelations(entity)}
defaultKind={defaultKind}
/>
);
},
};
},
createOwnerColumn<T extends Entity>(): TableColumn<T> {
return this.createEntityRelationColumn({
title: 'Owner',
relation: RELATION_OWNED_BY,
defaultKind: 'group',
});
},
createDomainColumn<T extends Entity>(): TableColumn<T> {
return this.createEntityRelationColumn({
title: 'Domain',
relation: RELATION_PART_OF,
defaultKind: 'domain',
filter: {
kind: 'domain',
},
});
},
createSystemColumn<T extends Entity>(): TableColumn<T> {
return this.createEntityRelationColumn({
title: 'System',
relation: RELATION_PART_OF,
defaultKind: 'system',
filter: {
kind: 'system',
},
});
},
createMetadataDescriptionColumn<T extends Entity>(): TableColumn<T> {
return {
title: 'Description',
field: 'metadata.description',
render: entity => (
<OverflowTooltip
text={entity.metadata.description}
placement="bottom-start"
line={2}
/>
),
width: 'auto',
};
},
createSpecLifecycleColumn<T extends Entity>(): TableColumn<T> {
return {
title: 'Lifecycle',
field: 'spec.lifecycle',
};
},
createSpecTypeColumn<T extends Entity>(): TableColumn<T> {
return {
title: 'Type',
field: 'spec.type',
};
},
});
@@ -15,4 +15,5 @@
*/
export { EntityTable } from './EntityTable';
export { columnFactories } from './columns';
export type { EntityTableProps } from './EntityTable';
@@ -15,29 +15,22 @@
*/
import { ComponentEntity, SystemEntity } from '@backstage/catalog-model';
import {
createDomainColumn,
createEntityRefColumn,
createMetadataDescriptionColumn,
createOwnerColumn,
createSpecLifecycleColumn,
createSpecTypeColumn,
createSystemColumn,
} from './columns';
import { columnFactories } from './columns';
import { TableColumn } from '@backstage/core-components';
export const systemEntityColumns: TableColumn<SystemEntity>[] = [
createEntityRefColumn({ defaultKind: 'system' }),
createDomainColumn(),
createOwnerColumn(),
createMetadataDescriptionColumn(),
columnFactories.createEntityRefColumn({ defaultKind: 'system' }),
columnFactories.createDomainColumn(),
columnFactories.createOwnerColumn(),
columnFactories.createMetadataDescriptionColumn(),
];
export const componentEntityColumns: TableColumn<ComponentEntity>[] = [
createEntityRefColumn({ defaultKind: 'component' }),
createSystemColumn(),
createOwnerColumn(),
createSpecTypeColumn(),
createSpecLifecycleColumn(),
createMetadataDescriptionColumn(),
columnFactories.createEntityRefColumn({ defaultKind: 'component' }),
columnFactories.createSystemColumn(),
columnFactories.createOwnerColumn(),
columnFactories.createSpecTypeColumn(),
columnFactories.createSpecLifecycleColumn(),
columnFactories.createMetadataDescriptionColumn(),
];