@backstage/plugin-techdocs 1.11.3-next.2 → 1.12.1-next.0

package/CHANGELOG.md

@@ -1,5 +1,41 @@
 # @backstage/plugin-techdocs
 
+## 1.12.1-next.0
+
+### Patch Changes
+
+- Updated dependencies
+  - @backstage/plugin-catalog-react@1.15.1-next.0
+  - @backstage/integration-react@1.2.2
+  - @backstage/core-compat-api@0.3.4
+
+## 1.12.0
+
+### Minor Changes
+
+- e153ca6: Add pagination support to TechDocs Index Page and make it the default
+
+### Patch Changes
+
+- 7d8777d: Added support for the Search bar in docs residing in the entity page tab, and not only the global "/docs" page.
+- Updated dependencies
+  - @backstage/plugin-catalog-react@1.15.0
+  - @backstage/integration@1.16.0
+  - @backstage/plugin-search-react@1.8.4
+  - @backstage/core-compat-api@0.3.4
+  - @backstage/frontend-plugin-api@0.9.3
+  - @backstage/theme@0.6.3
+  - @backstage/core-components@0.16.2
+  - @backstage/errors@1.2.6
+  - @backstage/catalog-model@1.7.2
+  - @backstage/config@1.3.1
+  - @backstage/core-plugin-api@1.10.2
+  - @backstage/integration-react@1.2.2
+  - @backstage/plugin-auth-react@0.1.10
+  - @backstage/plugin-search-common@1.2.16
+  - @backstage/plugin-techdocs-common@0.1.0
+  - @backstage/plugin-techdocs-react@1.2.12
+
 ## 1.11.3-next.2
 
 ### Patch Changes

package/dist/home/components/DefaultTechDocsHome.esm.js

@@ -7,8 +7,14 @@ import { EntityListDocsTable } from './Tables/EntityListDocsTable.esm.js';
 import './Tables/DocsTable.esm.js';
 
 const DefaultTechDocsHome = (props) => {
-  const { initialFilter = "owned", columns, actions, ownerPickerMode } = props;
-  return /* @__PURE__ */ React.createElement(TechDocsPageWrapper, null, /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(ContentHeader, { title: "" }, /* @__PURE__ */ React.createElement(SupportButton, null, "Discover documentation in your ecosystem.")), /* @__PURE__ */ React.createElement(EntityListProvider, null, /* @__PURE__ */ React.createElement(CatalogFilterLayout, null, /* @__PURE__ */ React.createElement(CatalogFilterLayout.Filters, null, /* @__PURE__ */ React.createElement(TechDocsPicker, null), /* @__PURE__ */ React.createElement(UserListPicker, { initialFilter }), /* @__PURE__ */ React.createElement(EntityOwnerPicker, { mode: ownerPickerMode }), /* @__PURE__ */ React.createElement(EntityTagPicker, null)), /* @__PURE__ */ React.createElement(CatalogFilterLayout.Content, null, /* @__PURE__ */ React.createElement(EntityListDocsTable, { actions, columns }))))));
+  const {
+    initialFilter = "owned",
+    columns,
+    actions,
+    ownerPickerMode,
+    pagination
+  } = props;
+  return /* @__PURE__ */ React.createElement(TechDocsPageWrapper, null, /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(ContentHeader, { title: "" }, /* @__PURE__ */ React.createElement(SupportButton, null, "Discover documentation in your ecosystem.")), /* @__PURE__ */ React.createElement(EntityListProvider, { pagination }, /* @__PURE__ */ React.createElement(CatalogFilterLayout, null, /* @__PURE__ */ React.createElement(CatalogFilterLayout.Filters, null, /* @__PURE__ */ React.createElement(TechDocsPicker, null), /* @__PURE__ */ React.createElement(UserListPicker, { initialFilter }), /* @__PURE__ */ React.createElement(EntityOwnerPicker, { mode: ownerPickerMode }), /* @__PURE__ */ React.createElement(EntityTagPicker, null)), /* @__PURE__ */ React.createElement(CatalogFilterLayout.Content, null, /* @__PURE__ */ React.createElement(EntityListDocsTable, { actions, columns }))))));
 };
 
 export { DefaultTechDocsHome };

package/dist/home/components/DefaultTechDocsHome.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultTechDocsHome.esm.js","sources":["../../../src/home/components/DefaultTechDocsHome.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n  Content,\n  ContentHeader,\n  SupportButton,\n} from '@backstage/core-components';\nimport {\n  CatalogFilterLayout,\n  EntityListProvider,\n  EntityOwnerPicker,\n  EntityTagPicker,\n  UserListPicker,\n} from '@backstage/plugin-catalog-react';\nimport { TechDocsPageWrapper } from './TechDocsPageWrapper';\nimport { TechDocsPicker } from './TechDocsPicker';\nimport { EntityListDocsTable } from './Tables';\nimport { TechDocsIndexPageProps } from './TechDocsIndexPage';\n\n/**\n * Props for {@link DefaultTechDocsHome}\n *\n * @public\n * @deprecated Please use `TechDocsIndexPageProps` instead.\n */\nexport type DefaultTechDocsHomeProps = TechDocsIndexPageProps;\n\n/**\n * Component which renders a default documentation landing page.\n *\n * @public\n */\nexport const DefaultTechDocsHome = (props: TechDocsIndexPageProps) => {\n  const { initialFilter = 'owned', columns, actions, ownerPickerMode } = props;\n  return (\n    <TechDocsPageWrapper>\n      <Content>\n        <ContentHeader title=\"\">\n          <SupportButton>\n            Discover documentation in your ecosystem.\n          </SupportButton>\n        </ContentHeader>\n        <EntityListProvider>\n          <CatalogFilterLayout>\n            <CatalogFilterLayout.Filters>\n              <TechDocsPicker />\n              <UserListPicker initialFilter={initialFilter} />\n              <EntityOwnerPicker mode={ownerPickerMode} />\n              <EntityTagPicker />\n            </CatalogFilterLayout.Filters>\n            <CatalogFilterLayout.Content>\n              <EntityListDocsTable actions={actions} columns={columns} />\n            </CatalogFilterLayout.Content>\n          </CatalogFilterLayout>\n        </EntityListProvider>\n      </Content>\n    </TechDocsPageWrapper>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AA+Ca,MAAA,mBAAA,GAAsB,CAAC,KAAkC,KAAA;AACpE,EAAA,MAAM,EAAE,aAAgB,GAAA,OAAA,EAAS,OAAS,EAAA,OAAA,EAAS,iBAAoB,GAAA,KAAA;AACvE,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,2CACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,sCACE,aAAc,EAAA,EAAA,KAAA,EAAM,EACnB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,aAAc,EAAA,IAAA,EAAA,2CAEf,CACF,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,0CACE,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,sCACE,mBAAoB,CAAA,OAAA,EAApB,IACC,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAe,EAAA,IAAA,CAAA,sCACf,cAAe,EAAA,EAAA,aAAA,EAA8B,mBAC7C,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,EAAkB,MAAM,eAAiB,EAAA,CAAA,kBACzC,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA,IAAgB,CACnB,CAAA,sCACC,mBAAoB,CAAA,OAAA,EAApB,IACC,kBAAA,KAAA,CAAA,aAAA,CAAC,mBAAoB,EAAA,EAAA,OAAA,EAAkB,SAAkB,CAC3D,CACF,CACF,CACF,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"DefaultTechDocsHome.esm.js","sources":["../../../src/home/components/DefaultTechDocsHome.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n  Content,\n  ContentHeader,\n  SupportButton,\n} from '@backstage/core-components';\nimport {\n  CatalogFilterLayout,\n  EntityListProvider,\n  EntityOwnerPicker,\n  EntityTagPicker,\n  UserListPicker,\n} from '@backstage/plugin-catalog-react';\nimport { TechDocsPageWrapper } from './TechDocsPageWrapper';\nimport { TechDocsPicker } from './TechDocsPicker';\nimport { EntityListDocsTable } from './Tables';\nimport { TechDocsIndexPageProps } from './TechDocsIndexPage';\n\n/**\n * Props for {@link DefaultTechDocsHome}\n *\n * @public\n * @deprecated Please use `TechDocsIndexPageProps` instead.\n */\nexport type DefaultTechDocsHomeProps = TechDocsIndexPageProps;\n\n/**\n * Component which renders a default documentation landing page.\n *\n * @public\n */\nexport const DefaultTechDocsHome = (props: TechDocsIndexPageProps) => {\n  const {\n    initialFilter = 'owned',\n    columns,\n    actions,\n    ownerPickerMode,\n    pagination,\n  } = props;\n  return (\n    <TechDocsPageWrapper>\n      <Content>\n        <ContentHeader title=\"\">\n          <SupportButton>\n            Discover documentation in your ecosystem.\n          </SupportButton>\n        </ContentHeader>\n        <EntityListProvider pagination={pagination}>\n          <CatalogFilterLayout>\n            <CatalogFilterLayout.Filters>\n              <TechDocsPicker />\n              <UserListPicker initialFilter={initialFilter} />\n              <EntityOwnerPicker mode={ownerPickerMode} />\n              <EntityTagPicker />\n            </CatalogFilterLayout.Filters>\n            <CatalogFilterLayout.Content>\n              <EntityListDocsTable actions={actions} columns={columns} />\n            </CatalogFilterLayout.Content>\n          </CatalogFilterLayout>\n        </EntityListProvider>\n      </Content>\n    </TechDocsPageWrapper>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AA+Ca,MAAA,mBAAA,GAAsB,CAAC,KAAkC,KAAA;AACpE,EAAM,MAAA;AAAA,IACJ,aAAgB,GAAA,OAAA;AAAA,IAChB,OAAA;AAAA,IACA,OAAA;AAAA,IACA,eAAA;AAAA,IACA;AAAA,GACE,GAAA,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,2CACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,sCACE,aAAc,EAAA,EAAA,KAAA,EAAM,EACnB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,aAAc,EAAA,IAAA,EAAA,2CAEf,CACF,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,kBAAmB,EAAA,EAAA,UAAA,EAAA,kBACjB,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,sCACE,mBAAoB,CAAA,OAAA,EAApB,IACC,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAe,EAAA,IAAA,CAAA,sCACf,cAAe,EAAA,EAAA,aAAA,EAA8B,mBAC7C,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,EAAkB,MAAM,eAAiB,EAAA,CAAA,kBACzC,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA,IAAgB,CACnB,CAAA,sCACC,mBAAoB,CAAA,OAAA,EAApB,IACC,kBAAA,KAAA,CAAA,aAAA,CAAC,mBAAoB,EAAA,EAAA,OAAA,EAAkB,SAAkB,CAC3D,CACF,CACF,CACF,CACF,CAAA;AAEJ;;;;"}

package/dist/home/components/Tables/CursorPaginatedDocsTable.esm.js

@@ -0,0 +1,49 @@
+import React from 'react';
+import { Table } from '@backstage/core-components';
+
+function CursorPaginatedDocsTable(props) {
+  const {
+    actions,
+    columns,
+    data,
+    next,
+    prev,
+    title,
+    isLoading,
+    options,
+    ...restProps
+  } = props;
+  return /* @__PURE__ */ React.createElement(
+    Table,
+    {
+      title: isLoading ? "" : title,
+      columns,
+      data,
+      options: {
+        paginationPosition: "both",
+        ...options,
+        // These settings are configured to force server side pagination
+        pageSizeOptions: [],
+        showFirstLastPageButtons: false,
+        pageSize: Number.MAX_SAFE_INTEGER,
+        emptyRowsWhenPaging: false,
+        actionsColumnIndex: -1
+      },
+      onPageChange: (page) => {
+        if (page > 0) {
+          next?.();
+        } else {
+          prev?.();
+        }
+      },
+      page: prev ? 1 : 0,
+      totalCount: next ? Number.MAX_VALUE : Number.MAX_SAFE_INTEGER,
+      localization: { pagination: { labelDisplayedRows: "" } },
+      isLoading,
+      ...restProps
+    }
+  );
+}
+
+export { CursorPaginatedDocsTable };
+//# sourceMappingURL=CursorPaginatedDocsTable.esm.js.map

package/dist/home/components/Tables/CursorPaginatedDocsTable.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CursorPaginatedDocsTable.esm.js","sources":["../../../../src/home/components/Tables/CursorPaginatedDocsTable.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nimport { Table, TableProps } from '@backstage/core-components';\nimport { DocsTableRow } from './types';\n\ntype PaginatedDocsTableProps = {\n  prev?(): void;\n  next?(): void;\n} & TableProps<DocsTableRow>;\n\n/**\n * @internal\n */\n\nexport function CursorPaginatedDocsTable(props: PaginatedDocsTableProps) {\n  const {\n    actions,\n    columns,\n    data,\n    next,\n    prev,\n    title,\n    isLoading,\n    options,\n    ...restProps\n  } = props;\n\n  return (\n    <Table\n      title={isLoading ? '' : title}\n      columns={columns}\n      data={data}\n      options={{\n        paginationPosition: 'both',\n        ...options,\n        // These settings are configured to force server side pagination\n        pageSizeOptions: [],\n        showFirstLastPageButtons: false,\n        pageSize: Number.MAX_SAFE_INTEGER,\n        emptyRowsWhenPaging: false,\n        actionsColumnIndex: -1,\n      }}\n      onPageChange={page => {\n        if (page > 0) {\n          next?.();\n        } else {\n          prev?.();\n        }\n      }}\n      /* this will enable the prev button accordingly */\n      page={prev ? 1 : 0}\n      /* this will enable the next button accordingly */\n      totalCount={next ? Number.MAX_VALUE : Number.MAX_SAFE_INTEGER}\n      localization={{ pagination: { labelDisplayedRows: '' } }}\n      isLoading={isLoading}\n      {...restProps}\n    />\n  );\n}\n"],"names":[],"mappings":";;;AA8BO,SAAS,yBAAyB,KAAgC,EAAA;AACvE,EAAM,MAAA;AAAA,IACJ,OAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,IAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,YAAY,EAAK,GAAA,KAAA;AAAA,MACxB,OAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAS,EAAA;AAAA,QACP,kBAAoB,EAAA,MAAA;AAAA,QACpB,GAAG,OAAA;AAAA;AAAA,QAEH,iBAAiB,EAAC;AAAA,QAClB,wBAA0B,EAAA,KAAA;AAAA,QAC1B,UAAU,MAAO,CAAA,gBAAA;AAAA,QACjB,mBAAqB,EAAA,KAAA;AAAA,QACrB,kBAAoB,EAAA,CAAA;AAAA,OACtB;AAAA,MACA,cAAc,CAAQ,IAAA,KAAA;AACpB,QAAA,IAAI,OAAO,CAAG,EAAA;AACZ,UAAO,IAAA,IAAA;AAAA,SACF,MAAA;AACL,UAAO,IAAA,IAAA;AAAA;AACT,OACF;AAAA,MAEA,IAAA,EAAM,OAAO,CAAI,GAAA,CAAA;AAAA,MAEjB,UAAY,EAAA,IAAA,GAAO,MAAO,CAAA,SAAA,GAAY,MAAO,CAAA,gBAAA;AAAA,MAC7C,cAAc,EAAE,UAAA,EAAY,EAAE,kBAAA,EAAoB,IAAK,EAAA;AAAA,MACvD,SAAA;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}

package/dist/home/components/Tables/DocsTable.esm.js

@@ -1,45 +1,23 @@
 import React from 'react';
 import useCopyToClipboard from 'react-use/esm/useCopyToClipboard';
 import { useRouteRef, useApi, configApiRef } from '@backstage/core-plugin-api';
-import { RELATION_OWNED_BY } from '@backstage/catalog-model';
-import { getEntityRelations, humanizeEntityRef } from '@backstage/plugin-catalog-react';
 import { rootDocsRouteRef } from '../../../routes.esm.js';
 import { Table, EmptyState, LinkButton } from '@backstage/core-components';
 import { actionFactories } from './actions.esm.js';
-import { columnFactories } from './columns.esm.js';
-import { toLowerMaybe } from '../../../helpers.esm.js';
+import { defaultColumns, columnFactories } from './columns.esm.js';
+import { entitiesToDocsMapper } from './helpers.esm.js';
 
-const defaultColumns = [
-  columnFactories.createTitleColumn({ hidden: true }),
-  columnFactories.createNameColumn(),
-  columnFactories.createOwnerColumn(),
-  columnFactories.createKindColumn(),
-  columnFactories.createTypeColumn()
-];
 const DocsTable = (props) => {
   const { entities, title, loading, columns, actions, options } = props;
   const [, copyToClipboard] = useCopyToClipboard();
   const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);
   const config = useApi(configApiRef);
   if (!entities) return null;
-  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(", ")
-      }
-    };
-  });
+  const documents = entitiesToDocsMapper(
+    entities,
+    getRouteToReaderPageFor,
+    config
+  );
   const defaultActions = [
     actionFactories.createCopyDocsUrlAction(copyToClipboard)
   ];

package/dist/home/components/Tables/DocsTable.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocsTable.esm.js","sources":["../../../../src/home/components/Tables/DocsTable.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport useCopyToClipboard from 'react-use/esm/useCopyToClipboard';\n\nimport { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { Entity, RELATION_OWNED_BY } from '@backstage/catalog-model';\nimport {\n  getEntityRelations,\n  humanizeEntityRef,\n} from '@backstage/plugin-catalog-react';\nimport { rootDocsRouteRef } from '../../../routes';\nimport {\n  EmptyState,\n  LinkButton,\n  Table,\n  TableColumn,\n  TableOptions,\n  TableProps,\n} from '@backstage/core-components';\nimport { actionFactories } from './actions';\nimport { columnFactories } from './columns';\nimport { toLowerMaybe } from '../../../helpers';\nimport { DocsTableRow } from './types';\n\n/**\n * Props for {@link DocsTable}.\n *\n * @public\n */\nexport type DocsTableProps = {\n  entities: Entity[] | undefined;\n  title?: string | undefined;\n  loading?: boolean | undefined;\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  options?: TableOptions<DocsTableRow>;\n};\n\nconst defaultColumns: TableColumn<DocsTableRow>[] = [\n  columnFactories.createTitleColumn({ hidden: true }),\n  columnFactories.createNameColumn(),\n  columnFactories.createOwnerColumn(),\n  columnFactories.createKindColumn(),\n  columnFactories.createTypeColumn(),\n];\n\n/**\n * Component which renders a table documents\n *\n * @public\n */\nexport const DocsTable = (props: DocsTableProps) => {\n  const { entities, title, loading, columns, actions, options } = props;\n  const [, copyToClipboard] = useCopyToClipboard();\n  const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);\n  const config = useApi(configApiRef);\n  if (!entities) return null;\n\n  const documents = entities.map(entity => {\n    const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);\n    return {\n      entity,\n      resolved: {\n        docsUrl: getRouteToReaderPageFor({\n          namespace: toLowerMaybe(\n            entity.metadata.namespace ?? 'default',\n            config,\n          ),\n          kind: toLowerMaybe(entity.kind, config),\n          name: toLowerMaybe(entity.metadata.name, config),\n        }),\n        ownedByRelations,\n        ownedByRelationsTitle: ownedByRelations\n          .map(r => humanizeEntityRef(r, { defaultKind: 'group' }))\n          .join(', '),\n      },\n    };\n  });\n\n  const defaultActions: TableProps<DocsTableRow>['actions'] = [\n    actionFactories.createCopyDocsUrlAction(copyToClipboard),\n  ];\n\n  const pageSize = 20;\n  const paging = documents && documents.length > pageSize;\n\n  return (\n    <>\n      {loading || (documents && documents.length > 0) ? (\n        <Table<DocsTableRow>\n          isLoading={loading}\n          options={{\n            paging,\n            pageSize,\n            search: true,\n            actionsColumnIndex: -1,\n            ...options,\n          }}\n          data={documents}\n          columns={columns || defaultColumns}\n          actions={actions || defaultActions}\n          title={\n            title\n              ? `${title} (${documents.length})`\n              : `All (${documents.length})`\n          }\n        />\n      ) : (\n        <EmptyState\n          missing=\"data\"\n          title=\"No documents to show\"\n          description=\"Create your own document. Check out our Getting Started Information\"\n          action={\n            <LinkButton\n              color=\"primary\"\n              to=\"https://backstage.io/docs/features/techdocs/getting-started\"\n              variant=\"contained\"\n            >\n              DOCS\n            </LinkButton>\n          }\n        />\n      )}\n    </>\n  );\n};\n\nDocsTable.columns = columnFactories;\nDocsTable.actions = actionFactories;\n"],"names":[],"mappings":";;;;;;;;;;;AAqDA,MAAM,cAA8C,GAAA;AAAA,EAClD,eAAgB,CAAA,iBAAA,CAAkB,EAAE,MAAA,EAAQ,MAAM,CAAA;AAAA,EAClD,gBAAgB,gBAAiB,EAAA;AAAA,EACjC,gBAAgB,iBAAkB,EAAA;AAAA,EAClC,gBAAgB,gBAAiB,EAAA;AAAA,EACjC,gBAAgB,gBAAiB;AACnC,CAAA;AAOa,MAAA,SAAA,GAAY,CAAC,KAA0B,KAAA;AAClD,EAAA,MAAM,EAAE,QAAU,EAAA,KAAA,EAAO,SAAS,OAAS,EAAA,OAAA,EAAS,SAAY,GAAA,KAAA;AAChE,EAAA,MAAM,GAAG,eAAe,CAAA,GAAI,kBAAmB,EAAA;AAC/C,EAAM,MAAA,uBAAA,GAA0B,YAAY,gBAAgB,CAAA;AAC5D,EAAM,MAAA,MAAA,GAAS,OAAO,YAAY,CAAA;AAClC,EAAI,IAAA,CAAC,UAAiB,OAAA,IAAA;AAEtB,EAAM,MAAA,SAAA,GAAY,QAAS,CAAA,GAAA,CAAI,CAAU,MAAA,KAAA;AACvC,IAAM,MAAA,gBAAA,GAAmB,kBAAmB,CAAA,MAAA,EAAQ,iBAAiB,CAAA;AACrE,IAAO,OAAA;AAAA,MACL,MAAA;AAAA,MACA,QAAU,EAAA;AAAA,QACR,SAAS,uBAAwB,CAAA;AAAA,UAC/B,SAAW,EAAA,YAAA;AAAA,YACT,MAAA,CAAO,SAAS,SAAa,IAAA,SAAA;AAAA,YAC7B;AAAA,WACF;AAAA,UACA,IAAM,EAAA,YAAA,CAAa,MAAO,CAAA,IAAA,EAAM,MAAM,CAAA;AAAA,UACtC,IAAM,EAAA,YAAA,CAAa,MAAO,CAAA,QAAA,CAAS,MAAM,MAAM;AAAA,SAChD,CAAA;AAAA,QACD,gBAAA;AAAA,QACA,qBAAuB,EAAA,gBAAA,CACpB,GAAI,CAAA,CAAA,CAAA,KAAK,iBAAkB,CAAA,CAAA,EAAG,EAAE,WAAA,EAAa,OAAQ,EAAC,CAAC,CAAA,CACvD,KAAK,IAAI;AAAA;AACd,KACF;AAAA,GACD,CAAA;AAED,EAAA,MAAM,cAAsD,GAAA;AAAA,IAC1D,eAAA,CAAgB,wBAAwB,eAAe;AAAA,GACzD;AAEA,EAAA,MAAM,QAAW,GAAA,EAAA;AACjB,EAAM,MAAA,MAAA,GAAS,SAAa,IAAA,SAAA,CAAU,MAAS,GAAA,QAAA;AAE/C,EAAA,uBAEK,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EAAA,OAAA,IAAY,SAAa,IAAA,SAAA,CAAU,SAAS,CAC3C,mBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,OAAA;AAAA,MACX,OAAS,EAAA;AAAA,QACP,MAAA;AAAA,QACA,QAAA;AAAA,QACA,MAAQ,EAAA,IAAA;AAAA,QACR,kBAAoB,EAAA,CAAA,CAAA;AAAA,QACpB,GAAG;AAAA,OACL;AAAA,MACA,IAAM,EAAA,SAAA;AAAA,MACN,SAAS,OAAW,IAAA,cAAA;AAAA,MACpB,SAAS,OAAW,IAAA,cAAA;AAAA,MACpB,KAAA,EACE,KACI,GAAA,CAAA,EAAG,KAAK,CAAA,EAAA,EAAK,UAAU,MAAM,CAAA,CAAA,CAAA,GAC7B,CAAQ,KAAA,EAAA,SAAA,CAAU,MAAM,CAAA,CAAA;AAAA;AAAA,GAIhC,mBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,MAAA;AAAA,MACR,KAAM,EAAA,sBAAA;AAAA,MACN,WAAY,EAAA,qEAAA;AAAA,MACZ,MACE,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,KAAM,EAAA,SAAA;AAAA,UACN,EAAG,EAAA,6DAAA;AAAA,UACH,OAAQ,EAAA;AAAA,SAAA;AAAA,QACT;AAAA;AAED;AAAA,GAIR,CAAA;AAEJ;AAEA,SAAA,CAAU,OAAU,GAAA,eAAA;AACpB,SAAA,CAAU,OAAU,GAAA,eAAA;;;;"}
+{"version":3,"file":"DocsTable.esm.js","sources":["../../../../src/home/components/Tables/DocsTable.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport useCopyToClipboard from 'react-use/esm/useCopyToClipboard';\n\nimport { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { Entity } from '@backstage/catalog-model';\nimport { rootDocsRouteRef } from '../../../routes';\nimport {\n  EmptyState,\n  LinkButton,\n  Table,\n  TableColumn,\n  TableOptions,\n  TableProps,\n} from '@backstage/core-components';\nimport { actionFactories } from './actions';\nimport { columnFactories, defaultColumns } from './columns';\nimport { DocsTableRow } from './types';\nimport { entitiesToDocsMapper } from './helpers';\n\n/**\n * Props for {@link DocsTable}.\n *\n * @public\n */\nexport type DocsTableProps = {\n  entities: Entity[] | undefined;\n  title?: string | undefined;\n  loading?: boolean | undefined;\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  options?: TableOptions<DocsTableRow>;\n};\n\n/**\n * Component which renders a table documents\n *\n * @public\n */\nexport const DocsTable = (props: DocsTableProps) => {\n  const { entities, title, loading, columns, actions, options } = props;\n  const [, copyToClipboard] = useCopyToClipboard();\n  const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);\n  const config = useApi(configApiRef);\n  if (!entities) return null;\n\n  const documents = entitiesToDocsMapper(\n    entities,\n    getRouteToReaderPageFor,\n    config,\n  );\n\n  const defaultActions: TableProps<DocsTableRow>['actions'] = [\n    actionFactories.createCopyDocsUrlAction(copyToClipboard),\n  ];\n\n  const pageSize = 20;\n  const paging = documents && documents.length > pageSize;\n\n  return (\n    <>\n      {loading || (documents && documents.length > 0) ? (\n        <Table<DocsTableRow>\n          isLoading={loading}\n          options={{\n            paging,\n            pageSize,\n            search: true,\n            actionsColumnIndex: -1,\n            ...options,\n          }}\n          data={documents}\n          columns={columns || defaultColumns}\n          actions={actions || defaultActions}\n          title={\n            title\n              ? `${title} (${documents.length})`\n              : `All (${documents.length})`\n          }\n        />\n      ) : (\n        <EmptyState\n          missing=\"data\"\n          title=\"No documents to show\"\n          description=\"Create your own document. Check out our Getting Started Information\"\n          action={\n            <LinkButton\n              color=\"primary\"\n              to=\"https://backstage.io/docs/features/techdocs/getting-started\"\n              variant=\"contained\"\n            >\n              DOCS\n            </LinkButton>\n          }\n        />\n      )}\n    </>\n  );\n};\n\nDocsTable.columns = columnFactories;\nDocsTable.actions = actionFactories;\n"],"names":[],"mappings":";;;;;;;;;AAsDa,MAAA,SAAA,GAAY,CAAC,KAA0B,KAAA;AAClD,EAAA,MAAM,EAAE,QAAU,EAAA,KAAA,EAAO,SAAS,OAAS,EAAA,OAAA,EAAS,SAAY,GAAA,KAAA;AAChE,EAAA,MAAM,GAAG,eAAe,CAAA,GAAI,kBAAmB,EAAA;AAC/C,EAAM,MAAA,uBAAA,GAA0B,YAAY,gBAAgB,CAAA;AAC5D,EAAM,MAAA,MAAA,GAAS,OAAO,YAAY,CAAA;AAClC,EAAI,IAAA,CAAC,UAAiB,OAAA,IAAA;AAEtB,EAAA,MAAM,SAAY,GAAA,oBAAA;AAAA,IAChB,QAAA;AAAA,IACA,uBAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,MAAM,cAAsD,GAAA;AAAA,IAC1D,eAAA,CAAgB,wBAAwB,eAAe;AAAA,GACzD;AAEA,EAAA,MAAM,QAAW,GAAA,EAAA;AACjB,EAAM,MAAA,MAAA,GAAS,SAAa,IAAA,SAAA,CAAU,MAAS,GAAA,QAAA;AAE/C,EAAA,uBAEK,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EAAA,OAAA,IAAY,SAAa,IAAA,SAAA,CAAU,SAAS,CAC3C,mBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,OAAA;AAAA,MACX,OAAS,EAAA;AAAA,QACP,MAAA;AAAA,QACA,QAAA;AAAA,QACA,MAAQ,EAAA,IAAA;AAAA,QACR,kBAAoB,EAAA,CAAA,CAAA;AAAA,QACpB,GAAG;AAAA,OACL;AAAA,MACA,IAAM,EAAA,SAAA;AAAA,MACN,SAAS,OAAW,IAAA,cAAA;AAAA,MACpB,SAAS,OAAW,IAAA,cAAA;AAAA,MACpB,KAAA,EACE,KACI,GAAA,CAAA,EAAG,KAAK,CAAA,EAAA,EAAK,UAAU,MAAM,CAAA,CAAA,CAAA,GAC7B,CAAQ,KAAA,EAAA,SAAA,CAAU,MAAM,CAAA,CAAA;AAAA;AAAA,GAIhC,mBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,MAAA;AAAA,MACR,KAAM,EAAA,sBAAA;AAAA,MACN,WAAY,EAAA,qEAAA;AAAA,MACZ,MACE,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,KAAM,EAAA,SAAA;AAAA,UACN,EAAG,EAAA,6DAAA;AAAA,UACH,OAAQ,EAAA;AAAA,SAAA;AAAA,QACT;AAAA;AAED;AAAA,GAIR,CAAA;AAEJ;AAEA,SAAA,CAAU,OAAU,GAAA,eAAA;AACpB,SAAA,CAAU,OAAU,GAAA,eAAA;;;;"}

package/dist/home/components/Tables/EntityListDocsTable.esm.js

@@ -2,16 +2,23 @@ import React from 'react';
 import useCopyToClipboard from 'react-use/esm/useCopyToClipboard';
 import { capitalize } from 'lodash';
 import { WarningPanel, CodeSnippet } from '@backstage/core-components';
+import { useRouteRef, useApi, configApiRef } from '@backstage/core-plugin-api';
 import { useEntityList, useStarredEntities } from '@backstage/plugin-catalog-react';
 import { DocsTable } from './DocsTable.esm.js';
+import { OffsetPaginatedDocsTable } from './OffsetPaginatedDocsTable.esm.js';
+import { CursorPaginatedDocsTable } from './CursorPaginatedDocsTable.esm.js';
 import { actionFactories } from './actions.esm.js';
-import { columnFactories } from './columns.esm.js';
+import { defaultColumns, columnFactories } from './columns.esm.js';
+import { rootDocsRouteRef } from '../../../routes.esm.js';
+import { entitiesToDocsMapper } from './helpers.esm.js';
 
 const EntityListDocsTable = (props) => {
   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");
   const defaultActions = [
     actionFactories.createCopyDocsUrlAction(copyToClipboard),
@@ -20,6 +27,38 @@ const EntityListDocsTable = (props) => {
       toggleStarredEntity
     )
   ];
+  const documents = entitiesToDocsMapper(
+    entities,
+    getRouteToReaderPageFor,
+    config
+  );
+  if (paginationMode === "cursor") {
+    return /* @__PURE__ */ React.createElement(
+      CursorPaginatedDocsTable,
+      {
+        columns: columns || defaultColumns,
+        isLoading: loading,
+        title,
+        actions: actions || defaultActions,
+        options,
+        data: documents,
+        next: pageInfo?.next,
+        prev: pageInfo?.prev
+      }
+    );
+  } else if (paginationMode === "offset") {
+    return /* @__PURE__ */ React.createElement(
+      OffsetPaginatedDocsTable,
+      {
+        columns: columns || defaultColumns,
+        isLoading: loading,
+        title,
+        actions: actions || defaultActions,
+        options,
+        data: documents
+      }
+    );
+  }
   if (error) {
     return /* @__PURE__ */ React.createElement(
       WarningPanel,

package/dist/home/components/Tables/EntityListDocsTable.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityListDocsTable.esm.js","sources":["../../../../src/home/components/Tables/EntityListDocsTable.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport useCopyToClipboard from 'react-use/esm/useCopyToClipboard';\nimport { capitalize } from 'lodash';\nimport {\n  CodeSnippet,\n  TableColumn,\n  TableOptions,\n  TableProps,\n  WarningPanel,\n} from '@backstage/core-components';\nimport {\n  useEntityList,\n  useStarredEntities,\n} from '@backstage/plugin-catalog-react';\nimport { DocsTable } from './DocsTable';\nimport { actionFactories } from './actions';\nimport { columnFactories } from './columns';\nimport { DocsTableRow } from './types';\n\n/**\n * Props for {@link EntityListDocsTable}.\n *\n * @public\n */\nexport type EntityListDocsTableProps = {\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  options?: TableOptions<DocsTableRow>;\n};\n\n/**\n * Component which renders a table with entities from catalog.\n *\n * @public\n */\nexport const EntityListDocsTable = (props: EntityListDocsTableProps) => {\n  const { columns, actions, options } = props;\n  const { loading, error, entities, filters } = useEntityList();\n  const { isStarredEntity, toggleStarredEntity } = useStarredEntities();\n  const [, copyToClipboard] = useCopyToClipboard();\n\n  const title = capitalize(filters.user?.value ?? 'all');\n\n  const defaultActions = [\n    actionFactories.createCopyDocsUrlAction(copyToClipboard),\n    actionFactories.createStarEntityAction(\n      isStarredEntity,\n      toggleStarredEntity,\n    ),\n  ];\n\n  if (error) {\n    return (\n      <WarningPanel\n        severity=\"error\"\n        title=\"Could not load available documentation.\"\n      >\n        <CodeSnippet language=\"text\" text={error.toString()} />\n      </WarningPanel>\n    );\n  }\n\n  return (\n    <DocsTable\n      title={title}\n      entities={entities}\n      loading={loading}\n      actions={actions || defaultActions}\n      columns={columns}\n      options={options}\n    />\n  );\n};\n\nEntityListDocsTable.columns = columnFactories;\nEntityListDocsTable.actions = actionFactories;\n"],"names":[],"mappings":";;;;;;;;;AAmDa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAA,MAAM,EAAE,OAAA,EAAS,OAAS,EAAA,OAAA,EAAY,GAAA,KAAA;AACtC,EAAA,MAAM,EAAE,OAAS,EAAA,KAAA,EAAO,QAAU,EAAA,OAAA,KAAY,aAAc,EAAA;AAC5D,EAAA,MAAM,EAAE,eAAA,EAAiB,mBAAoB,EAAA,GAAI,kBAAmB,EAAA;AACpE,EAAA,MAAM,GAAG,eAAe,CAAA,GAAI,kBAAmB,EAAA;AAE/C,EAAA,MAAM,KAAQ,GAAA,UAAA,CAAW,OAAQ,CAAA,IAAA,EAAM,SAAS,KAAK,CAAA;AAErD,EAAA,MAAM,cAAiB,GAAA;AAAA,IACrB,eAAA,CAAgB,wBAAwB,eAAe,CAAA;AAAA,IACvD,eAAgB,CAAA,sBAAA;AAAA,MACd,eAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,IAAI,KAAO,EAAA;AACT,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,QAAS,EAAA,OAAA;AAAA,QACT,KAAM,EAAA;AAAA,OAAA;AAAA,0CAEL,WAAY,EAAA,EAAA,QAAA,EAAS,QAAO,IAAM,EAAA,KAAA,CAAM,UAAY,EAAA;AAAA,KACvD;AAAA;AAIJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAS,OAAW,IAAA,cAAA;AAAA,MACpB,OAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;AAEA,mBAAA,CAAoB,OAAU,GAAA,eAAA;AAC9B,mBAAA,CAAoB,OAAU,GAAA,eAAA;;;;"}
+{"version":3,"file":"EntityListDocsTable.esm.js","sources":["../../../../src/home/components/Tables/EntityListDocsTable.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport useCopyToClipboard from 'react-use/esm/useCopyToClipboard';\nimport { capitalize } from 'lodash';\nimport {\n  CodeSnippet,\n  TableColumn,\n  TableOptions,\n  TableProps,\n  WarningPanel,\n} from '@backstage/core-components';\nimport { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport {\n  useEntityList,\n  useStarredEntities,\n} from '@backstage/plugin-catalog-react';\nimport { DocsTable } from './DocsTable';\nimport { OffsetPaginatedDocsTable } from './OffsetPaginatedDocsTable';\nimport { CursorPaginatedDocsTable } from './CursorPaginatedDocsTable';\nimport { actionFactories } from './actions';\nimport { columnFactories, defaultColumns } from './columns';\nimport { DocsTableRow } from './types';\nimport { rootDocsRouteRef } from '../../../routes';\nimport { entitiesToDocsMapper } from './helpers';\n\n/**\n * Props for {@link EntityListDocsTable}.\n *\n * @public\n */\nexport type EntityListDocsTableProps = {\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  options?: TableOptions<DocsTableRow>;\n};\n\n/**\n * Component which renders a table with entities from catalog.\n *\n * @public\n */\nexport const EntityListDocsTable = (props: EntityListDocsTableProps) => {\n  const { columns, actions, options } = props;\n  const { loading, error, entities, filters, paginationMode, pageInfo } =\n    useEntityList();\n  const { isStarredEntity, toggleStarredEntity } = useStarredEntities();\n  const [, copyToClipboard] = useCopyToClipboard();\n  const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);\n  const config = useApi(configApiRef);\n\n  const title = capitalize(filters.user?.value ?? 'all');\n\n  const defaultActions = [\n    actionFactories.createCopyDocsUrlAction(copyToClipboard),\n    actionFactories.createStarEntityAction(\n      isStarredEntity,\n      toggleStarredEntity,\n    ),\n  ];\n\n  const documents = entitiesToDocsMapper(\n    entities,\n    getRouteToReaderPageFor,\n    config,\n  );\n\n  if (paginationMode === 'cursor') {\n    return (\n      <CursorPaginatedDocsTable\n        columns={columns || defaultColumns}\n        isLoading={loading}\n        title={title}\n        actions={actions || defaultActions}\n        options={options}\n        data={documents}\n        next={pageInfo?.next}\n        prev={pageInfo?.prev}\n      />\n    );\n  } else if (paginationMode === 'offset') {\n    return (\n      <OffsetPaginatedDocsTable\n        columns={columns || defaultColumns}\n        isLoading={loading}\n        title={title}\n        actions={actions || defaultActions}\n        options={options}\n        data={documents}\n      />\n    );\n  }\n\n  if (error) {\n    return (\n      <WarningPanel\n        severity=\"error\"\n        title=\"Could not load available documentation.\"\n      >\n        <CodeSnippet language=\"text\" text={error.toString()} />\n      </WarningPanel>\n    );\n  }\n\n  return (\n    <DocsTable\n      title={title}\n      entities={entities}\n      loading={loading}\n      actions={actions || defaultActions}\n      columns={columns}\n      options={options}\n    />\n  );\n};\n\nEntityListDocsTable.columns = columnFactories;\nEntityListDocsTable.actions = actionFactories;\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAwDa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAA,MAAM,EAAE,OAAA,EAAS,OAAS,EAAA,OAAA,EAAY,GAAA,KAAA;AACtC,EAAM,MAAA,EAAE,SAAS,KAAO,EAAA,QAAA,EAAU,SAAS,cAAgB,EAAA,QAAA,KACzD,aAAc,EAAA;AAChB,EAAA,MAAM,EAAE,eAAA,EAAiB,mBAAoB,EAAA,GAAI,kBAAmB,EAAA;AACpE,EAAA,MAAM,GAAG,eAAe,CAAA,GAAI,kBAAmB,EAAA;AAC/C,EAAM,MAAA,uBAAA,GAA0B,YAAY,gBAAgB,CAAA;AAC5D,EAAM,MAAA,MAAA,GAAS,OAAO,YAAY,CAAA;AAElC,EAAA,MAAM,KAAQ,GAAA,UAAA,CAAW,OAAQ,CAAA,IAAA,EAAM,SAAS,KAAK,CAAA;AAErD,EAAA,MAAM,cAAiB,GAAA;AAAA,IACrB,eAAA,CAAgB,wBAAwB,eAAe,CAAA;AAAA,IACvD,eAAgB,CAAA,sBAAA;AAAA,MACd,eAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,MAAM,SAAY,GAAA,oBAAA;AAAA,IAChB,QAAA;AAAA,IACA,uBAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,IAAI,mBAAmB,QAAU,EAAA;AAC/B,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,wBAAA;AAAA,MAAA;AAAA,QACC,SAAS,OAAW,IAAA,cAAA;AAAA,QACpB,SAAW,EAAA,OAAA;AAAA,QACX,KAAA;AAAA,QACA,SAAS,OAAW,IAAA,cAAA;AAAA,QACpB,OAAA;AAAA,QACA,IAAM,EAAA,SAAA;AAAA,QACN,MAAM,QAAU,EAAA,IAAA;AAAA,QAChB,MAAM,QAAU,EAAA;AAAA;AAAA,KAClB;AAAA,GAEJ,MAAA,IAAW,mBAAmB,QAAU,EAAA;AACtC,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,wBAAA;AAAA,MAAA;AAAA,QACC,SAAS,OAAW,IAAA,cAAA;AAAA,QACpB,SAAW,EAAA,OAAA;AAAA,QACX,KAAA;AAAA,QACA,SAAS,OAAW,IAAA,cAAA;AAAA,QACpB,OAAA;AAAA,QACA,IAAM,EAAA;AAAA;AAAA,KACR;AAAA;AAIJ,EAAA,IAAI,KAAO,EAAA;AACT,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,QAAS,EAAA,OAAA;AAAA,QACT,KAAM,EAAA;AAAA,OAAA;AAAA,0CAEL,WAAY,EAAA,EAAA,QAAA,EAAS,QAAO,IAAM,EAAA,KAAA,CAAM,UAAY,EAAA;AAAA,KACvD;AAAA;AAIJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAS,OAAW,IAAA,cAAA;AAAA,MACpB,OAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;AAEA,mBAAA,CAAoB,OAAU,GAAA,eAAA;AAC9B,mBAAA,CAAoB,OAAU,GAAA,eAAA;;;;"}

package/dist/home/components/Tables/OffsetPaginatedDocsTable.esm.js

@@ -0,0 +1,50 @@
+import React, { useEffect } from 'react';
+import { Table } from '@backstage/core-components';
+import { useEntityList, EntityTextFilter } from '@backstage/plugin-catalog-react';
+
+function OffsetPaginatedDocsTable(props) {
+  const { actions, columns, data, isLoading, options } = props;
+  const { updateFilters, setLimit, setOffset, limit, totalItems, offset } = useEntityList();
+  const [page, setPage] = React.useState(
+    offset && limit ? Math.floor(offset / limit) : 0
+  );
+  useEffect(() => {
+    if (totalItems && page * limit >= totalItems) {
+      setOffset(Math.max(0, totalItems - limit));
+    } else {
+      setOffset(Math.max(0, page * limit));
+    }
+  }, [setOffset, page, limit, totalItems]);
+  return /* @__PURE__ */ React.createElement(
+    Table,
+    {
+      columns,
+      data,
+      options: {
+        paginationPosition: "both",
+        pageSizeOptions: [5, 10, 20, 50, 100],
+        pageSize: limit,
+        emptyRowsWhenPaging: false,
+        actionsColumnIndex: -1,
+        ...options
+      },
+      actions,
+      onSearchChange: (searchText) => updateFilters({
+        text: searchText ? new EntityTextFilter(searchText) : void 0
+      }),
+      page,
+      onPageChange: (newPage) => {
+        setPage(newPage);
+      },
+      onRowsPerPageChange: (pageSize) => {
+        setLimit(pageSize);
+      },
+      totalCount: totalItems,
+      localization: { pagination: { labelDisplayedRows: "" } },
+      isLoading
+    }
+  );
+}
+
+export { OffsetPaginatedDocsTable };
+//# sourceMappingURL=OffsetPaginatedDocsTable.esm.js.map

package/dist/home/components/Tables/OffsetPaginatedDocsTable.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OffsetPaginatedDocsTable.esm.js","sources":["../../../../src/home/components/Tables/OffsetPaginatedDocsTable.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useEffect } from 'react';\n\nimport { Table, TableProps } from '@backstage/core-components';\nimport { DocsTableRow } from './types';\nimport {\n  EntityTextFilter,\n  useEntityList,\n} from '@backstage/plugin-catalog-react';\n\n/**\n * @internal\n */\nexport function OffsetPaginatedDocsTable(props: TableProps<DocsTableRow>) {\n  const { actions, columns, data, isLoading, options } = props;\n  const { updateFilters, setLimit, setOffset, limit, totalItems, offset } =\n    useEntityList();\n  const [page, setPage] = React.useState(\n    offset && limit ? Math.floor(offset / limit) : 0,\n  );\n\n  useEffect(() => {\n    if (totalItems && page * limit >= totalItems) {\n      setOffset!(Math.max(0, totalItems - limit));\n    } else {\n      setOffset!(Math.max(0, page * limit));\n    }\n  }, [setOffset, page, limit, totalItems]);\n\n  return (\n    <Table<DocsTableRow>\n      columns={columns}\n      data={data}\n      options={{\n        paginationPosition: 'both',\n        pageSizeOptions: [5, 10, 20, 50, 100],\n        pageSize: limit,\n        emptyRowsWhenPaging: false,\n        actionsColumnIndex: -1,\n        ...options,\n      }}\n      actions={actions}\n      onSearchChange={(searchText: string) =>\n        updateFilters({\n          text: searchText ? new EntityTextFilter(searchText) : undefined,\n        })\n      }\n      page={page}\n      onPageChange={newPage => {\n        setPage(newPage);\n      }}\n      onRowsPerPageChange={pageSize => {\n        setLimit(pageSize);\n      }}\n      totalCount={totalItems}\n      localization={{ pagination: { labelDisplayedRows: '' } }}\n      isLoading={isLoading}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;AA4BO,SAAS,yBAAyB,KAAiC,EAAA;AACxE,EAAA,MAAM,EAAE,OAAS,EAAA,OAAA,EAAS,IAAM,EAAA,SAAA,EAAW,SAAY,GAAA,KAAA;AACvD,EAAM,MAAA,EAAE,eAAe,QAAU,EAAA,SAAA,EAAW,OAAO,UAAY,EAAA,MAAA,KAC7D,aAAc,EAAA;AAChB,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,KAAM,CAAA,QAAA;AAAA,IAC5B,UAAU,KAAQ,GAAA,IAAA,CAAK,KAAM,CAAA,MAAA,GAAS,KAAK,CAAI,GAAA;AAAA,GACjD;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,UAAA,IAAc,IAAO,GAAA,KAAA,IAAS,UAAY,EAAA;AAC5C,MAAA,SAAA,CAAW,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,UAAA,GAAa,KAAK,CAAC,CAAA;AAAA,KACrC,MAAA;AACL,MAAA,SAAA,CAAW,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,KAAK,CAAC,CAAA;AAAA;AACtC,KACC,CAAC,SAAA,EAAW,IAAM,EAAA,KAAA,EAAO,UAAU,CAAC,CAAA;AAEvC,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAS,EAAA;AAAA,QACP,kBAAoB,EAAA,MAAA;AAAA,QACpB,iBAAiB,CAAC,CAAA,EAAG,EAAI,EAAA,EAAA,EAAI,IAAI,GAAG,CAAA;AAAA,QACpC,QAAU,EAAA,KAAA;AAAA,QACV,mBAAqB,EAAA,KAAA;AAAA,QACrB,kBAAoB,EAAA,CAAA,CAAA;AAAA,QACpB,GAAG;AAAA,OACL;AAAA,MACA,OAAA;AAAA,MACA,cAAA,EAAgB,CAAC,UAAA,KACf,aAAc,CAAA;AAAA,QACZ,IAAM,EAAA,UAAA,GAAa,IAAI,gBAAA,CAAiB,UAAU,CAAI,GAAA,KAAA;AAAA,OACvD,CAAA;AAAA,MAEH,IAAA;AAAA,MACA,cAAc,CAAW,OAAA,KAAA;AACvB,QAAA,OAAA,CAAQ,OAAO,CAAA;AAAA,OACjB;AAAA,MACA,qBAAqB,CAAY,QAAA,KAAA;AAC/B,QAAA,QAAA,CAAS,QAAQ,CAAA;AAAA,OACnB;AAAA,MACA,UAAY,EAAA,UAAA;AAAA,MACZ,cAAc,EAAE,UAAA,EAAY,EAAE,kBAAA,EAAoB,IAAK,EAAA;AAAA,MACvD;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/home/components/Tables/columns.esm.js

@@ -61,6 +61,13 @@ const columnFactories = {
     };
   }
 };
+const defaultColumns = [
+  columnFactories.createTitleColumn({ hidden: true }),
+  columnFactories.createNameColumn(),
+  columnFactories.createOwnerColumn(),
+  columnFactories.createKindColumn(),
+  columnFactories.createTypeColumn()
+];
 
-export { columnFactories };
+export { columnFactories, defaultColumns };
 //# sourceMappingURL=columns.esm.js.map

package/dist/home/components/Tables/columns.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"columns.esm.js","sources":["../../../../src/home/components/Tables/columns.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { Link, SubvalueCell, TableColumn } from '@backstage/core-components';\nimport { EntityRefLinks } from '@backstage/plugin-catalog-react';\nimport { Entity } from '@backstage/catalog-model';\nimport { DocsTableRow } from './types';\n\nfunction customTitle(entity: Entity): string {\n  return entity.metadata.title || entity.metadata.name;\n}\n\n/**\n * Not directly exported, but through DocsTable.columns and EntityListDocsTable.columns\n *\n * @public\n */\nexport const columnFactories = {\n  createTitleColumn(options?: { hidden?: boolean }): TableColumn<DocsTableRow> {\n    const nameCol = columnFactories.createNameColumn();\n    return {\n      ...nameCol,\n      field: 'entity.metadata.title',\n      hidden: options?.hidden,\n    };\n  },\n  createNameColumn(): TableColumn<DocsTableRow> {\n    return {\n      title: 'Document',\n      field: 'entity.metadata.name',\n      highlight: true,\n      searchable: true,\n      defaultSort: 'asc',\n      customSort: (row1, row2) => {\n        const title1 = customTitle(row1.entity).toLocaleLowerCase();\n        const title2 = customTitle(row2.entity).toLocaleLowerCase();\n        return title1.localeCompare(title2);\n      },\n      render: (row: DocsTableRow) => (\n        <SubvalueCell\n          value={\n            <Link to={row.resolved.docsUrl}>{customTitle(row.entity)}</Link>\n          }\n          subvalue={row.entity.metadata.description}\n        />\n      ),\n    };\n  },\n  createOwnerColumn(): TableColumn<DocsTableRow> {\n    return {\n      title: 'Owner',\n      field: 'resolved.ownedByRelationsTitle',\n      render: ({ resolved }) => (\n        <EntityRefLinks\n          entityRefs={resolved.ownedByRelations}\n          defaultKind=\"group\"\n        />\n      ),\n    };\n  },\n  createKindColumn(): TableColumn<DocsTableRow> {\n    return {\n      title: 'Kind',\n      field: 'entity.kind',\n    };\n  },\n  createTypeColumn(): TableColumn<DocsTableRow> {\n    return {\n      title: 'Type',\n      field: 'entity.spec.type',\n    };\n  },\n};\n"],"names":[],"mappings":";;;;AAsBA,SAAS,YAAY,MAAwB,EAAA;AAC3C,EAAA,OAAO,MAAO,CAAA,QAAA,CAAS,KAAS,IAAA,MAAA,CAAO,QAAS,CAAA,IAAA;AAClD;AAOO,MAAM,eAAkB,GAAA;AAAA,EAC7B,kBAAkB,OAA2D,EAAA;AAC3E,IAAM,MAAA,OAAA,GAAU,gBAAgB,gBAAiB,EAAA;AACjD,IAAO,OAAA;AAAA,MACL,GAAG,OAAA;AAAA,MACH,KAAO,EAAA,uBAAA;AAAA,MACP,QAAQ,OAAS,EAAA;AAAA,KACnB;AAAA,GACF;AAAA,EACA,gBAA8C,GAAA;AAC5C,IAAO,OAAA;AAAA,MACL,KAAO,EAAA,UAAA;AAAA,MACP,KAAO,EAAA,sBAAA;AAAA,MACP,SAAW,EAAA,IAAA;AAAA,MACX,UAAY,EAAA,IAAA;AAAA,MACZ,WAAa,EAAA,KAAA;AAAA,MACb,UAAA,EAAY,CAAC,IAAA,EAAM,IAAS,KAAA;AAC1B,QAAA,MAAM,MAAS,GAAA,WAAA,CAAY,IAAK,CAAA,MAAM,EAAE,iBAAkB,EAAA;AAC1D,QAAA,MAAM,MAAS,GAAA,WAAA,CAAY,IAAK,CAAA,MAAM,EAAE,iBAAkB,EAAA;AAC1D,QAAO,OAAA,MAAA,CAAO,cAAc,MAAM,CAAA;AAAA,OACpC;AAAA,MACA,MAAA,EAAQ,CAAC,GACP,qBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,KAAA,kBACG,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,EAAI,EAAA,GAAA,CAAI,SAAS,OAAU,EAAA,EAAA,WAAA,CAAY,GAAI,CAAA,MAAM,CAAE,CAAA;AAAA,UAE3D,QAAA,EAAU,GAAI,CAAA,MAAA,CAAO,QAAS,CAAA;AAAA;AAAA;AAChC,KAEJ;AAAA,GACF;AAAA,EACA,iBAA+C,GAAA;AAC7C,IAAO,OAAA;AAAA,MACL,KAAO,EAAA,OAAA;AAAA,MACP,KAAO,EAAA,gCAAA;AAAA,MACP,MAAQ,EAAA,CAAC,EAAE,QAAA,EACT,qBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,cAAA;AAAA,QAAA;AAAA,UACC,YAAY,QAAS,CAAA,gBAAA;AAAA,UACrB,WAAY,EAAA;AAAA;AAAA;AACd,KAEJ;AAAA,GACF;AAAA,EACA,gBAA8C,GAAA;AAC5C,IAAO,OAAA;AAAA,MACL,KAAO,EAAA,MAAA;AAAA,MACP,KAAO,EAAA;AAAA,KACT;AAAA,GACF;AAAA,EACA,gBAA8C,GAAA;AAC5C,IAAO,OAAA;AAAA,MACL,KAAO,EAAA,MAAA;AAAA,MACP,KAAO,EAAA;AAAA,KACT;AAAA;AAEJ;;;;"}
+{"version":3,"file":"columns.esm.js","sources":["../../../../src/home/components/Tables/columns.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { Link, SubvalueCell, TableColumn } from '@backstage/core-components';\nimport { EntityRefLinks } from '@backstage/plugin-catalog-react';\nimport { Entity } from '@backstage/catalog-model';\nimport { DocsTableRow } from './types';\n\nfunction customTitle(entity: Entity): string {\n  return entity.metadata.title || entity.metadata.name;\n}\n\n/**\n * Not directly exported, but through DocsTable.columns and EntityListDocsTable.columns\n *\n * @public\n */\nexport const columnFactories = {\n  createTitleColumn(options?: { hidden?: boolean }): TableColumn<DocsTableRow> {\n    const nameCol = columnFactories.createNameColumn();\n    return {\n      ...nameCol,\n      field: 'entity.metadata.title',\n      hidden: options?.hidden,\n    };\n  },\n  createNameColumn(): TableColumn<DocsTableRow> {\n    return {\n      title: 'Document',\n      field: 'entity.metadata.name',\n      highlight: true,\n      searchable: true,\n      defaultSort: 'asc',\n      customSort: (row1, row2) => {\n        const title1 = customTitle(row1.entity).toLocaleLowerCase();\n        const title2 = customTitle(row2.entity).toLocaleLowerCase();\n        return title1.localeCompare(title2);\n      },\n      render: (row: DocsTableRow) => (\n        <SubvalueCell\n          value={\n            <Link to={row.resolved.docsUrl}>{customTitle(row.entity)}</Link>\n          }\n          subvalue={row.entity.metadata.description}\n        />\n      ),\n    };\n  },\n  createOwnerColumn(): TableColumn<DocsTableRow> {\n    return {\n      title: 'Owner',\n      field: 'resolved.ownedByRelationsTitle',\n      render: ({ resolved }) => (\n        <EntityRefLinks\n          entityRefs={resolved.ownedByRelations}\n          defaultKind=\"group\"\n        />\n      ),\n    };\n  },\n  createKindColumn(): TableColumn<DocsTableRow> {\n    return {\n      title: 'Kind',\n      field: 'entity.kind',\n    };\n  },\n  createTypeColumn(): TableColumn<DocsTableRow> {\n    return {\n      title: 'Type',\n      field: 'entity.spec.type',\n    };\n  },\n};\n\nexport const defaultColumns: TableColumn<DocsTableRow>[] = [\n  columnFactories.createTitleColumn({ hidden: true }),\n  columnFactories.createNameColumn(),\n  columnFactories.createOwnerColumn(),\n  columnFactories.createKindColumn(),\n  columnFactories.createTypeColumn(),\n];\n"],"names":[],"mappings":";;;;AAsBA,SAAS,YAAY,MAAwB,EAAA;AAC3C,EAAA,OAAO,MAAO,CAAA,QAAA,CAAS,KAAS,IAAA,MAAA,CAAO,QAAS,CAAA,IAAA;AAClD;AAOO,MAAM,eAAkB,GAAA;AAAA,EAC7B,kBAAkB,OAA2D,EAAA;AAC3E,IAAM,MAAA,OAAA,GAAU,gBAAgB,gBAAiB,EAAA;AACjD,IAAO,OAAA;AAAA,MACL,GAAG,OAAA;AAAA,MACH,KAAO,EAAA,uBAAA;AAAA,MACP,QAAQ,OAAS,EAAA;AAAA,KACnB;AAAA,GACF;AAAA,EACA,gBAA8C,GAAA;AAC5C,IAAO,OAAA;AAAA,MACL,KAAO,EAAA,UAAA;AAAA,MACP,KAAO,EAAA,sBAAA;AAAA,MACP,SAAW,EAAA,IAAA;AAAA,MACX,UAAY,EAAA,IAAA;AAAA,MACZ,WAAa,EAAA,KAAA;AAAA,MACb,UAAA,EAAY,CAAC,IAAA,EAAM,IAAS,KAAA;AAC1B,QAAA,MAAM,MAAS,GAAA,WAAA,CAAY,IAAK,CAAA,MAAM,EAAE,iBAAkB,EAAA;AAC1D,QAAA,MAAM,MAAS,GAAA,WAAA,CAAY,IAAK,CAAA,MAAM,EAAE,iBAAkB,EAAA;AAC1D,QAAO,OAAA,MAAA,CAAO,cAAc,MAAM,CAAA;AAAA,OACpC;AAAA,MACA,MAAA,EAAQ,CAAC,GACP,qBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,KAAA,kBACG,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,EAAI,EAAA,GAAA,CAAI,SAAS,OAAU,EAAA,EAAA,WAAA,CAAY,GAAI,CAAA,MAAM,CAAE,CAAA;AAAA,UAE3D,QAAA,EAAU,GAAI,CAAA,MAAA,CAAO,QAAS,CAAA;AAAA;AAAA;AAChC,KAEJ;AAAA,GACF;AAAA,EACA,iBAA+C,GAAA;AAC7C,IAAO,OAAA;AAAA,MACL,KAAO,EAAA,OAAA;AAAA,MACP,KAAO,EAAA,gCAAA;AAAA,MACP,MAAQ,EAAA,CAAC,EAAE,QAAA,EACT,qBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,cAAA;AAAA,QAAA;AAAA,UACC,YAAY,QAAS,CAAA,gBAAA;AAAA,UACrB,WAAY,EAAA;AAAA;AAAA;AACd,KAEJ;AAAA,GACF;AAAA,EACA,gBAA8C,GAAA;AAC5C,IAAO,OAAA;AAAA,MACL,KAAO,EAAA,MAAA;AAAA,MACP,KAAO,EAAA;AAAA,KACT;AAAA,GACF;AAAA,EACA,gBAA8C,GAAA;AAC5C,IAAO,OAAA;AAAA,MACL,KAAO,EAAA,MAAA;AAAA,MACP,KAAO,EAAA;AAAA,KACT;AAAA;AAEJ;AAEO,MAAM,cAA8C,GAAA;AAAA,EACzD,eAAgB,CAAA,iBAAA,CAAkB,EAAE,MAAA,EAAQ,MAAM,CAAA;AAAA,EAClD,gBAAgB,gBAAiB,EAAA;AAAA,EACjC,gBAAgB,iBAAkB,EAAA;AAAA,EAClC,gBAAgB,gBAAiB,EAAA;AAAA,EACjC,gBAAgB,gBAAiB;AACnC;;;;"}

package/dist/home/components/Tables/helpers.esm.js

@@ -0,0 +1,27 @@
+import { RELATION_OWNED_BY } from '@backstage/catalog-model';
+import { getEntityRelations, humanizeEntityRef } from '@backstage/plugin-catalog-react';
+import { toLowerMaybe } from '../../../helpers.esm.js';
+
+function entitiesToDocsMapper(entities, getRouteToReaderPageFor, config) {
+  return 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(", ")
+      }
+    };
+  });
+}
+
+export { entitiesToDocsMapper };
+//# sourceMappingURL=helpers.esm.js.map

package/dist/home/components/Tables/helpers.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.esm.js","sources":["../../../../src/home/components/Tables/helpers.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { RELATION_OWNED_BY, Entity } from '@backstage/catalog-model';\nimport {\n  getEntityRelations,\n  humanizeEntityRef,\n} from '@backstage/plugin-catalog-react';\nimport { toLowerMaybe } from '../../../helpers';\nimport { ConfigApi, RouteFunc } from '@backstage/core-plugin-api';\n\ntype getRouteFunc = RouteFunc<{\n  namespace: string;\n  kind: string;\n  name: string;\n}>;\n\nexport function entitiesToDocsMapper(\n  entities: Entity[],\n  getRouteToReaderPageFor: getRouteFunc,\n  config: ConfigApi,\n) {\n  return entities.map(entity => {\n    const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);\n    return {\n      entity,\n      resolved: {\n        docsUrl: getRouteToReaderPageFor({\n          namespace: toLowerMaybe(\n            entity.metadata.namespace ?? 'default',\n            config,\n          ),\n          kind: toLowerMaybe(entity.kind, config),\n          name: toLowerMaybe(entity.metadata.name, config),\n        }),\n        ownedByRelations,\n        ownedByRelationsTitle: ownedByRelations\n          .map(r => humanizeEntityRef(r, { defaultKind: 'group' }))\n          .join(', '),\n      },\n    };\n  });\n}\n"],"names":[],"mappings":";;;;AA8BgB,SAAA,oBAAA,CACd,QACA,EAAA,uBAAA,EACA,MACA,EAAA;AACA,EAAO,OAAA,QAAA,CAAS,IAAI,CAAU,MAAA,KAAA;AAC5B,IAAM,MAAA,gBAAA,GAAmB,kBAAmB,CAAA,MAAA,EAAQ,iBAAiB,CAAA;AACrE,IAAO,OAAA;AAAA,MACL,MAAA;AAAA,MACA,QAAU,EAAA;AAAA,QACR,SAAS,uBAAwB,CAAA;AAAA,UAC/B,SAAW,EAAA,YAAA;AAAA,YACT,MAAA,CAAO,SAAS,SAAa,IAAA,SAAA;AAAA,YAC7B;AAAA,WACF;AAAA,UACA,IAAM,EAAA,YAAA,CAAa,MAAO,CAAA,IAAA,EAAM,MAAM,CAAA;AAAA,UACtC,IAAM,EAAA,YAAA,CAAa,MAAO,CAAA,QAAA,CAAS,MAAM,MAAM;AAAA,SAChD,CAAA;AAAA,QACD,gBAAA;AAAA,QACA,qBAAuB,EAAA,gBAAA,CACpB,GAAI,CAAA,CAAA,CAAA,KAAK,iBAAkB,CAAA,CAAA,EAAG,EAAE,WAAA,EAAa,OAAQ,EAAC,CAAC,CAAA,CACvD,KAAK,IAAI;AAAA;AACd,KACF;AAAA,GACD,CAAA;AACH;;;;"}

package/dist/home/components/TechDocsCustomHome.esm.js

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import useAsync from 'react-use/esm/useAsync';
 import { makeStyles } from '@material-ui/core/styles';
-import { catalogApiRef, CATALOG_FILTER_EXISTS, useEntityOwnership } from '@backstage/plugin-catalog-react';
+import { catalogApiRef, CATALOG_FILTER_EXISTS, useEntityOwnership, EntityListProvider } from '@backstage/plugin-catalog-react';
 import './Tables/EntityListDocsTable.esm.js';
 import { DocsTable } from './Tables/DocsTable.esm.js';
 import { DocsCardGrid } from './Grids/DocsCardGrid.esm.js';
@@ -38,7 +38,7 @@ const CustomPanel = ({
     }
     return typeof config.filterPredicate === "function" && config.filterPredicate(entity);
   });
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ContentHeader, { title: config.title, description: config.description }, index === 0 ? /* @__PURE__ */ React.createElement(SupportButton, null, "Discover documentation in your ecosystem.") : null), /* @__PURE__ */ React.createElement("div", { className: classes.panelContainer }, /* @__PURE__ */ React.createElement(Panel, { "data-testid": "techdocs-custom-panel", entities: shownEntities })));
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ContentHeader, { title: config.title, description: config.description }, index === 0 ? /* @__PURE__ */ React.createElement(SupportButton, null, "Discover documentation in your ecosystem.") : null), /* @__PURE__ */ React.createElement("div", { className: classes.panelContainer }, /* @__PURE__ */ React.createElement(EntityListProvider, null, /* @__PURE__ */ React.createElement(Panel, { "data-testid": "techdocs-custom-panel", entities: shownEntities }))));
 };
 const TechDocsCustomHome = (props) => {
   const { tabsConfig } = props;

package/dist/home/components/TechDocsCustomHome.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TechDocsCustomHome.esm.js","sources":["../../../src/home/components/TechDocsCustomHome.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { CSSProperties } from '@material-ui/styles/withStyles';\nimport {\n  CATALOG_FILTER_EXISTS,\n  catalogApiRef,\n  CatalogApi,\n  useEntityOwnership,\n} from '@backstage/plugin-catalog-react';\nimport { Entity } from '@backstage/catalog-model';\nimport { DocsTable } from './Tables';\nimport { DocsCardGrid } from './Grids';\nimport { TechDocsPageWrapper } from './TechDocsPageWrapper';\n\nimport {\n  CodeSnippet,\n  Content,\n  HeaderTabs,\n  Progress,\n  WarningPanel,\n  SupportButton,\n  ContentHeader,\n} from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { TECHDOCS_ANNOTATION } from '@backstage/plugin-techdocs-common';\n\nconst panels = {\n  DocsTable: DocsTable,\n  DocsCardGrid: DocsCardGrid,\n};\n\n/**\n * Available panel types\n *\n * @public\n */\nexport type PanelType = 'DocsCardGrid' | 'DocsTable';\n\n/**\n * Type representing a TechDocsCustomHome panel.\n *\n * @public\n */\nexport interface PanelConfig {\n  title: string;\n  description: string;\n  panelType: PanelType;\n  panelCSS?: CSSProperties;\n  filterPredicate: ((entity: Entity) => boolean) | string;\n}\n\n/**\n * Type representing a TechDocsCustomHome tab.\n *\n * @public\n */\nexport interface TabConfig {\n  label: string;\n  panels: PanelConfig[];\n}\n\n/**\n * Type representing a list of TechDocsCustomHome tabs.\n *\n * @public\n */\nexport type TabsConfig = TabConfig[];\n\nconst CustomPanel = ({\n  config,\n  entities,\n  index,\n}: {\n  config: PanelConfig;\n  entities: Entity[];\n  index: number;\n}) => {\n  const useStyles = makeStyles({\n    panelContainer: {\n      marginBottom: '2rem',\n      ...(config.panelCSS ? config.panelCSS : {}),\n    },\n  });\n  const classes = useStyles();\n  const { loading: loadingOwnership, isOwnedEntity } = useEntityOwnership();\n\n  const Panel = panels[config.panelType];\n\n  const shownEntities = entities.filter(entity => {\n    if (config.filterPredicate === 'ownedByUser') {\n      if (loadingOwnership) {\n        return false;\n      }\n      return isOwnedEntity(entity);\n    }\n\n    return (\n      typeof config.filterPredicate === 'function' &&\n      config.filterPredicate(entity)\n    );\n  });\n\n  return (\n    <>\n      <ContentHeader title={config.title} description={config.description}>\n        {index === 0 ? (\n          <SupportButton>\n            Discover documentation in your ecosystem.\n          </SupportButton>\n        ) : null}\n      </ContentHeader>\n      <div className={classes.panelContainer}>\n        <Panel data-testid=\"techdocs-custom-panel\" entities={shownEntities} />\n      </div>\n    </>\n  );\n};\n\n/**\n * Props for {@link TechDocsCustomHome}\n *\n * @public\n */\nexport type TechDocsCustomHomeProps = {\n  tabsConfig: TabsConfig;\n};\n\nexport const TechDocsCustomHome = (props: TechDocsCustomHomeProps) => {\n  const { tabsConfig } = props;\n  const [selectedTab, setSelectedTab] = useState<number>(0);\n  const catalogApi: CatalogApi = useApi(catalogApiRef);\n\n  const {\n    value: entities,\n    loading,\n    error,\n  } = useAsync(async () => {\n    const response = await catalogApi.getEntities({\n      filter: {\n        [`metadata.annotations.${TECHDOCS_ANNOTATION}`]: CATALOG_FILTER_EXISTS,\n      },\n      fields: [\n        'apiVersion',\n        'kind',\n        'metadata',\n        'relations',\n        'spec.owner',\n        'spec.type',\n      ],\n    });\n    return response.items.filter((entity: Entity) => {\n      return !!entity.metadata.annotations?.[TECHDOCS_ANNOTATION];\n    });\n  });\n\n  const currentTabConfig = tabsConfig[selectedTab];\n\n  if (loading) {\n    return (\n      <TechDocsPageWrapper>\n        <Content>\n          <Progress />\n        </Content>\n      </TechDocsPageWrapper>\n    );\n  }\n\n  if (error) {\n    return (\n      <TechDocsPageWrapper>\n        <Content>\n          <WarningPanel\n            severity=\"error\"\n            title=\"Could not load available documentation.\"\n          >\n            <CodeSnippet language=\"text\" text={error.toString()} />\n          </WarningPanel>\n        </Content>\n      </TechDocsPageWrapper>\n    );\n  }\n\n  return (\n    <TechDocsPageWrapper>\n      <HeaderTabs\n        selectedIndex={selectedTab}\n        onChange={index => setSelectedTab(index)}\n        tabs={tabsConfig.map(({ label }, index) => ({\n          id: index.toString(),\n          label,\n        }))}\n      />\n      <Content data-testid=\"techdocs-content\">\n        {currentTabConfig.panels.map((config, index) => (\n          <CustomPanel\n            key={index}\n            config={config}\n            entities={!!entities ? entities : []}\n            index={index}\n          />\n        ))}\n      </Content>\n    </TechDocsPageWrapper>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TechDocsCustomHome.esm.js","sources":["../../../src/home/components/TechDocsCustomHome.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { CSSProperties } from '@material-ui/styles/withStyles';\nimport {\n  CATALOG_FILTER_EXISTS,\n  catalogApiRef,\n  CatalogApi,\n  useEntityOwnership,\n  EntityListProvider,\n} from '@backstage/plugin-catalog-react';\nimport { Entity } from '@backstage/catalog-model';\nimport { DocsTable } from './Tables';\nimport { DocsCardGrid } from './Grids';\nimport { TechDocsPageWrapper } from './TechDocsPageWrapper';\n\nimport {\n  CodeSnippet,\n  Content,\n  HeaderTabs,\n  Progress,\n  WarningPanel,\n  SupportButton,\n  ContentHeader,\n} from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { TECHDOCS_ANNOTATION } from '@backstage/plugin-techdocs-common';\n\nconst panels = {\n  DocsTable: DocsTable,\n  DocsCardGrid: DocsCardGrid,\n};\n\n/**\n * Available panel types\n *\n * @public\n */\nexport type PanelType = 'DocsCardGrid' | 'DocsTable';\n\n/**\n * Type representing a TechDocsCustomHome panel.\n *\n * @public\n */\nexport interface PanelConfig {\n  title: string;\n  description: string;\n  panelType: PanelType;\n  panelCSS?: CSSProperties;\n  filterPredicate: ((entity: Entity) => boolean) | string;\n}\n\n/**\n * Type representing a TechDocsCustomHome tab.\n *\n * @public\n */\nexport interface TabConfig {\n  label: string;\n  panels: PanelConfig[];\n}\n\n/**\n * Type representing a list of TechDocsCustomHome tabs.\n *\n * @public\n */\nexport type TabsConfig = TabConfig[];\n\nconst CustomPanel = ({\n  config,\n  entities,\n  index,\n}: {\n  config: PanelConfig;\n  entities: Entity[];\n  index: number;\n}) => {\n  const useStyles = makeStyles({\n    panelContainer: {\n      marginBottom: '2rem',\n      ...(config.panelCSS ? config.panelCSS : {}),\n    },\n  });\n  const classes = useStyles();\n  const { loading: loadingOwnership, isOwnedEntity } = useEntityOwnership();\n\n  const Panel = panels[config.panelType];\n\n  const shownEntities = entities.filter(entity => {\n    if (config.filterPredicate === 'ownedByUser') {\n      if (loadingOwnership) {\n        return false;\n      }\n      return isOwnedEntity(entity);\n    }\n\n    return (\n      typeof config.filterPredicate === 'function' &&\n      config.filterPredicate(entity)\n    );\n  });\n\n  return (\n    <>\n      <ContentHeader title={config.title} description={config.description}>\n        {index === 0 ? (\n          <SupportButton>\n            Discover documentation in your ecosystem.\n          </SupportButton>\n        ) : null}\n      </ContentHeader>\n      <div className={classes.panelContainer}>\n        <EntityListProvider>\n          <Panel data-testid=\"techdocs-custom-panel\" entities={shownEntities} />\n        </EntityListProvider>\n      </div>\n    </>\n  );\n};\n\n/**\n * Props for {@link TechDocsCustomHome}\n *\n * @public\n */\nexport type TechDocsCustomHomeProps = {\n  tabsConfig: TabsConfig;\n};\n\nexport const TechDocsCustomHome = (props: TechDocsCustomHomeProps) => {\n  const { tabsConfig } = props;\n  const [selectedTab, setSelectedTab] = useState<number>(0);\n  const catalogApi: CatalogApi = useApi(catalogApiRef);\n\n  const {\n    value: entities,\n    loading,\n    error,\n  } = useAsync(async () => {\n    const response = await catalogApi.getEntities({\n      filter: {\n        [`metadata.annotations.${TECHDOCS_ANNOTATION}`]: CATALOG_FILTER_EXISTS,\n      },\n      fields: [\n        'apiVersion',\n        'kind',\n        'metadata',\n        'relations',\n        'spec.owner',\n        'spec.type',\n      ],\n    });\n    return response.items.filter((entity: Entity) => {\n      return !!entity.metadata.annotations?.[TECHDOCS_ANNOTATION];\n    });\n  });\n\n  const currentTabConfig = tabsConfig[selectedTab];\n\n  if (loading) {\n    return (\n      <TechDocsPageWrapper>\n        <Content>\n          <Progress />\n        </Content>\n      </TechDocsPageWrapper>\n    );\n  }\n\n  if (error) {\n    return (\n      <TechDocsPageWrapper>\n        <Content>\n          <WarningPanel\n            severity=\"error\"\n            title=\"Could not load available documentation.\"\n          >\n            <CodeSnippet language=\"text\" text={error.toString()} />\n          </WarningPanel>\n        </Content>\n      </TechDocsPageWrapper>\n    );\n  }\n\n  return (\n    <TechDocsPageWrapper>\n      <HeaderTabs\n        selectedIndex={selectedTab}\n        onChange={index => setSelectedTab(index)}\n        tabs={tabsConfig.map(({ label }, index) => ({\n          id: index.toString(),\n          label,\n        }))}\n      />\n      <Content data-testid=\"techdocs-content\">\n        {currentTabConfig.panels.map((config, index) => (\n          <CustomPanel\n            key={index}\n            config={config}\n            entities={!!entities ? entities : []}\n            index={index}\n          />\n        ))}\n      </Content>\n    </TechDocsPageWrapper>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/home/components/TechDocsIndexPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TechDocsIndexPage.esm.js","sources":["../../../src/home/components/TechDocsIndexPage.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { useOutlet } from 'react-router-dom';\nimport { TableColumn, TableProps } from '@backstage/core-components';\nimport {\n  EntityOwnerPickerProps,\n  UserListFilterKind,\n} from '@backstage/plugin-catalog-react';\nimport { DefaultTechDocsHome } from './DefaultTechDocsHome';\nimport { DocsTableRow } from './Tables';\n\n/**\n * Props for {@link TechDocsIndexPage}\n *\n * @public\n */\nexport type TechDocsIndexPageProps = {\n  initialFilter?: UserListFilterKind;\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  ownerPickerMode?: EntityOwnerPickerProps['mode'];\n};\n\nexport const TechDocsIndexPage = (props: TechDocsIndexPageProps) => {\n  const outlet = useOutlet();\n\n  return outlet || <DefaultTechDocsHome {...props} />;\n};\n"],"names":[],"mappings":";;;;AAsCa,MAAA,iBAAA,GAAoB,CAAC,KAAkC,KAAA;AAClE,EAAA,MAAM,SAAS,SAAU,EAAA;AAEzB,EAAA,OAAO,MAAU,oBAAA,KAAA,CAAA,aAAA,CAAC,mBAAqB,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA;AACnD;;;;"}
+{"version":3,"file":"TechDocsIndexPage.esm.js","sources":["../../../src/home/components/TechDocsIndexPage.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { useOutlet } from 'react-router-dom';\nimport { TableColumn, TableProps } from '@backstage/core-components';\nimport {\n  EntityListPagination,\n  EntityOwnerPickerProps,\n  UserListFilterKind,\n} from '@backstage/plugin-catalog-react';\nimport { DefaultTechDocsHome } from './DefaultTechDocsHome';\nimport { DocsTableRow } from './Tables';\n\n/**\n * Props for {@link TechDocsIndexPage}\n *\n * @public\n */\nexport type TechDocsIndexPageProps = {\n  initialFilter?: UserListFilterKind;\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  ownerPickerMode?: EntityOwnerPickerProps['mode'];\n  pagination?: EntityListPagination;\n};\n\nexport const TechDocsIndexPage = (props: TechDocsIndexPageProps) => {\n  const outlet = useOutlet();\n\n  return outlet || <DefaultTechDocsHome {...props} />;\n};\n"],"names":[],"mappings":";;;;AAwCa,MAAA,iBAAA,GAAoB,CAAC,KAAkC,KAAA;AAClE,EAAA,MAAM,SAAS,SAAU,EAAA;AAEzB,EAAA,OAAO,MAAU,oBAAA,KAAA,CAAA,aAAA,CAAC,mBAAqB,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA;AACnD;;;;"}

package/dist/index.d.ts

@@ -9,7 +9,7 @@ import React__default, { ReactNode, PropsWithChildren } from 'react';
 import { ThemeOptions } from '@material-ui/core/styles';
 import { ToolbarProps } from '@material-ui/core/Toolbar';
 import { TableColumn, TableProps, TableOptions } from '@backstage/core-components';
-import { UserListFilterKind, EntityOwnerPickerProps } from '@backstage/plugin-catalog-react';
+import { UserListFilterKind, EntityOwnerPickerProps, EntityListPagination } from '@backstage/plugin-catalog-react';
 import { CSSProperties } from '@material-ui/styles/withStyles';
 import { SearchResultListItemExtensionProps } from '@backstage/plugin-search-react';
 import { ResultHighlight } from '@backstage/plugin-search-common';
@@ -466,6 +466,7 @@ type TechDocsIndexPageProps = {
     columns?: TableColumn<DocsTableRow>[];
     actions?: TableProps<DocsTableRow>['actions'];
     ownerPickerMode?: EntityOwnerPickerProps['mode'];
+    pagination?: EntityListPagination;
 };
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-techdocs",
-  "version": "1.11.3-next.2",
+  "version": "1.12.1-next.0",
   "description": "The Backstage plugin that renders technical documentation for your components",
   "backstage": {
     "role": "frontend-plugin",
@@ -68,22 +68,22 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/catalog-model": "1.7.2-next.0",
-    "@backstage/config": "1.3.1-next.0",
-    "@backstage/core-compat-api": "0.3.4-next.2",
-    "@backstage/core-components": "0.16.2-next.2",
-    "@backstage/core-plugin-api": "1.10.2-next.0",
-    "@backstage/errors": "1.2.6-next.0",
-    "@backstage/frontend-plugin-api": "0.9.3-next.2",
-    "@backstage/integration": "1.16.0-next.1",
-    "@backstage/integration-react": "1.2.2-next.1",
-    "@backstage/plugin-auth-react": "0.1.10-next.2",
-    "@backstage/plugin-catalog-react": "1.14.3-next.2",
-    "@backstage/plugin-search-common": "1.2.16-next.0",
-    "@backstage/plugin-search-react": "1.8.4-next.2",
+    "@backstage/catalog-model": "1.7.2",
+    "@backstage/config": "1.3.1",
+    "@backstage/core-compat-api": "0.3.4",
+    "@backstage/core-components": "0.16.2",
+    "@backstage/core-plugin-api": "1.10.2",
+    "@backstage/errors": "1.2.6",
+    "@backstage/frontend-plugin-api": "0.9.3",
+    "@backstage/integration": "1.16.0",
+    "@backstage/integration-react": "1.2.2",
+    "@backstage/plugin-auth-react": "0.1.10",
+    "@backstage/plugin-catalog-react": "1.15.1-next.0",
+    "@backstage/plugin-search-common": "1.2.16",
+    "@backstage/plugin-search-react": "1.8.4",
     "@backstage/plugin-techdocs-common": "0.1.0",
-    "@backstage/plugin-techdocs-react": "1.2.12-next.2",
-    "@backstage/theme": "0.6.3-next.0",
+    "@backstage/plugin-techdocs-react": "1.2.12",
+    "@backstage/theme": "0.6.3",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.61",
@@ -97,11 +97,11 @@
     "react-use": "^17.2.4"
   },
   "devDependencies": {
-    "@backstage/cli": "0.29.3-next.2",
-    "@backstage/core-app-api": "1.15.3-next.1",
-    "@backstage/dev-utils": "1.1.5-next.2",
-    "@backstage/plugin-techdocs-module-addons-contrib": "1.1.19-next.2",
-    "@backstage/test-utils": "1.7.3-next.1",
+    "@backstage/cli": "0.29.5-next.0",
+    "@backstage/core-app-api": "1.15.3",
+    "@backstage/dev-utils": "1.1.6-next.0",
+    "@backstage/plugin-techdocs-module-addons-contrib": "1.1.20-next.0",
+    "@backstage/test-utils": "1.7.3",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^16.0.0",