diff --git a/plugins/techdocs/src/home/components/Tables/CursorPaginatedDocsTable.tsx b/plugins/techdocs/src/home/components/Tables/CursorPaginatedDocsTable.tsx
index e5ed54c624..48a1ecddce 100644
--- a/plugins/techdocs/src/home/components/Tables/CursorPaginatedDocsTable.tsx
+++ b/plugins/techdocs/src/home/components/Tables/CursorPaginatedDocsTable.tsx
@@ -29,8 +29,17 @@ type PaginatedDocsTableProps = {
*/
export function CursorPaginatedDocsTable(props: PaginatedDocsTableProps) {
- const { columns, data, next, prev, title, isLoading, options, ...restProps } =
- props;
+ const {
+ actions,
+ columns,
+ data,
+ next,
+ prev,
+ title,
+ isLoading,
+ options,
+ ...restProps
+ } = props;
return (
{
if (page > 0) {
diff --git a/plugins/techdocs/src/home/components/Tables/EntityListDocsTable.tsx b/plugins/techdocs/src/home/components/Tables/EntityListDocsTable.tsx
index 563bec4d22..6ed3138c01 100644
--- a/plugins/techdocs/src/home/components/Tables/EntityListDocsTable.tsx
+++ b/plugins/techdocs/src/home/components/Tables/EntityListDocsTable.tsx
@@ -24,14 +24,22 @@ import {
TableProps,
WarningPanel,
} from '@backstage/core-components';
+import { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';
+import { RELATION_OWNED_BY } from '@backstage/catalog-model';
import {
+ getEntityRelations,
+ humanizeEntityRef,
useEntityList,
useStarredEntities,
} from '@backstage/plugin-catalog-react';
import { DocsTable } from './DocsTable';
+import { OffsetPaginatedDocsTable } from './OffsetPaginatedDocsTable';
+import { CursorPaginatedDocsTable } from './CursorPaginatedDocsTable';
import { actionFactories } from './actions';
import { columnFactories } from './columns';
import { DocsTableRow } from './types';
+import { toLowerMaybe } from '../../../helpers';
+import { rootDocsRouteRef } from '../../../routes';
/**
* Props for {@link EntityListDocsTable}.
@@ -44,6 +52,14 @@ export type EntityListDocsTableProps = {
options?: TableOptions;
};
+const defaultColumns: TableColumn[] = [
+ columnFactories.createTitleColumn({ hidden: true }),
+ columnFactories.createNameColumn(),
+ columnFactories.createOwnerColumn(),
+ columnFactories.createKindColumn(),
+ columnFactories.createTypeColumn(),
+];
+
/**
* Component which renders a table with entities from catalog.
*
@@ -51,9 +67,12 @@ export type EntityListDocsTableProps = {
*/
export const EntityListDocsTable = (props: EntityListDocsTableProps) => {
const { columns, actions, options } = props;
- const { loading, error, entities, filters } = useEntityList();
+ const { loading, error, entities, filters, paginationMode, pageInfo } =
+ useEntityList();
const { isStarredEntity, toggleStarredEntity } = useStarredEntities();
const [, copyToClipboard] = useCopyToClipboard();
+ const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);
+ const config = useApi(configApiRef);
const title = capitalize(filters.user?.value ?? 'all');
@@ -65,6 +84,53 @@ export const EntityListDocsTable = (props: EntityListDocsTableProps) => {
),
];
+ const documents = entities.map(entity => {
+ const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);
+ return {
+ entity,
+ resolved: {
+ docsUrl: getRouteToReaderPageFor({
+ namespace: toLowerMaybe(
+ entity.metadata.namespace ?? 'default',
+ config,
+ ),
+ kind: toLowerMaybe(entity.kind, config),
+ name: toLowerMaybe(entity.metadata.name, config),
+ }),
+ ownedByRelations,
+ ownedByRelationsTitle: ownedByRelations
+ .map(r => humanizeEntityRef(r, { defaultKind: 'group' }))
+ .join(', '),
+ },
+ };
+ });
+
+ if (paginationMode === 'cursor') {
+ return (
+
+ );
+ } else if (paginationMode === 'offset') {
+ return (
+
+ );
+ }
+
if (error) {
return (
) {
- const { columns, data, isLoading, options } = props;
+ const { actions, columns, data, isLoading, options } = props;
const { updateFilters, setLimit, setOffset, limit, totalItems, offset } =
useEntityList();
const [page, setPage] = React.useState(
@@ -51,8 +51,10 @@ export function OffsetPaginatedDocsTable(props: TableProps) {
pageSizeOptions: [5, 10, 20, 50, 100],
pageSize: limit,
emptyRowsWhenPaging: false,
+ actionsColumnIndex: -1,
...options,
}}
+ actions={actions}
onSearchChange={(searchText: string) =>
updateFilters({
text: searchText ? new EntityTextFilter(searchText) : undefined,