diff --git a/plugins/api-docs/src/alpha.tsx b/plugins/api-docs/src/alpha.tsx
index 98655d56ba..14a27ddd57 100644
--- a/plugins/api-docs/src/alpha.tsx
+++ b/plugins/api-docs/src/alpha.tsx
@@ -19,6 +19,7 @@ import React from 'react';
import {
createApiExtension,
createApiFactory,
+ createNavItemExtension,
createPageExtension,
createPlugin,
createSchemaFromZod,
@@ -37,6 +38,19 @@ import {
createEntityContentExtension,
} from '@backstage/plugin-catalog-react/alpha';
import { Grid } from '@material-ui/core';
+import { useApp } from '@backstage/core-plugin-api';
+
+function ApiIcon() {
+ const app = useApp();
+ const Component = app.getSystemIcon('kind:api')!;
+ return ;
+}
+
+const ApiDocsNavItem = createNavItemExtension({
+ title: 'APIs',
+ routeRef: convertLegacyRouteRef(rootRoute),
+ icon: () => compatWrapper(),
+});
const ApiDocsConfigApi = createApiExtension({
factory: createApiFactory({
@@ -147,6 +161,26 @@ const ApiDocsDefinitionEntityContent = createEntityContentExtension({
),
});
+const ApiDocsApisEntityContent = createEntityContentExtension({
+ name: 'apis',
+ defaultPath: '/apis',
+ defaultTitle: 'APIs',
+ filter: 'kind:component has:apis',
+ loader: async () =>
+ import('./components/ApisCards').then(m =>
+ compatWrapper(
+
+
+
+
+
+
+
+ ,
+ ),
+ ),
+});
+
export default createPlugin({
id: 'api-docs',
routes: {
@@ -156,6 +190,7 @@ export default createPlugin({
registerApi: convertLegacyRouteRef(registerComponentRouteRef),
},
extensions: [
+ ApiDocsNavItem,
ApiDocsConfigApi,
ApiDocsExplorerPage,
ApiDocsHasApisEntityCard,
@@ -165,5 +200,6 @@ export default createPlugin({
ApiDocsConsumingComponentsEntityCard,
ApiDocsProvidingComponentsEntityCard,
ApiDocsDefinitionEntityContent,
+ ApiDocsApisEntityContent,
],
});