Merge pull request #27487 from luccasmtxr/luccasmtxr/api-docs-pagination

add pagination to defaultApiExplorerPage

.changeset/angry-bags-compete.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-api-docs': minor
+---
+
+Added support for pagination in api-docs plugin - DefaultApiExplorerPage

plugins/api-docs/README.md

@@ -371,6 +371,23 @@ export const apis: AnyApiFactory[] = [
 ]
 ```
 
+### Pagination
+
+You can add pagination support to `ApiExplorerPage` extension.
+
+This is an example:
+
+```tsx
+// In packages/app/src/App.tsx
+
+import { ApiExplorerPage } from '@backstage/plugin-api-docs';
+
+<Route
+  path="/api-docs"
+  element={<ApiExplorerPage pagination={{ mode: 'offset', limit: 20 }} />}
+/>;
+```
+
 ## Links
 
 - [The Backstage homepage](https://backstage.io)

plugins/api-docs/report.api.md

@@ -10,6 +10,7 @@ import { ApiRef } from '@backstage/core-plugin-api';
 import { BackstagePlugin } from '@backstage/core-plugin-api';
 import { CatalogTableRow } from '@backstage/plugin-catalog';
 import { ComponentEntity } from '@backstage/catalog-model';
+import { EntityListPagination } from '@backstage/plugin-catalog-react';
 import { EntityOwnerPickerProps } from '@backstage/plugin-catalog-react';
 import { ExternalRouteRef } from '@backstage/core-plugin-api';
 import { InfoCardVariants } from '@backstage/core-components';
@@ -121,6 +122,7 @@ export type DefaultApiExplorerPageProps = {
   columns?: TableColumn<CatalogTableRow>[];
   actions?: TableProps<CatalogTableRow>['actions'];
   ownerPickerMode?: EntityOwnerPickerProps['mode'];
+  pagination?: EntityListPagination;
 };
 
 // @public (undocumented)

plugins/api-docs/src/components/ApiExplorerPage/DefaultApiExplorerPage.tsx

@@ -29,6 +29,7 @@ import {
   EntityKindPicker,
   EntityLifecyclePicker,
   EntityListProvider,
+  EntityListPagination,
   EntityOwnerPicker,
   EntityTagPicker,
   EntityTypePicker,
@@ -62,6 +63,7 @@ export type DefaultApiExplorerPageProps = {
   columns?: TableColumn<CatalogTableRow>[];
   actions?: TableProps<CatalogTableRow>['actions'];
   ownerPickerMode?: EntityOwnerPickerProps['mode'];
+  pagination?: EntityListPagination;
 };
 
 /**
@@ -74,6 +76,7 @@ export const DefaultApiExplorerPage = (props: DefaultApiExplorerPageProps) => {
     columns,
     actions,
     ownerPickerMode,
+    pagination,
   } = props;
 
   const configApi = useApi(configApiRef);
@@ -102,7 +105,7 @@ export const DefaultApiExplorerPage = (props: DefaultApiExplorerPageProps) => {
           )}
           <SupportButton>All your APIs</SupportButton>
         </ContentHeader>
-        <EntityListProvider>
+        <EntityListProvider pagination={pagination}>
           <CatalogFilterLayout>
             <CatalogFilterLayout.Filters>
               <EntityKindPicker initialFilter="api" hidden />