diff --git a/plugins/techdocs/src/alpha.tsx b/plugins/techdocs/src/alpha.tsx
index f4d4da6e93..b7ccb0b12c 100644
--- a/plugins/techdocs/src/alpha.tsx
+++ b/plugins/techdocs/src/alpha.tsx
@@ -15,89 +15,33 @@
*/
import React from 'react';
+import LibraryBooks from '@material-ui/icons/LibraryBooks';
import {
createPlugin,
createSchemaFromZod,
createApiExtension,
createPageExtension,
+ createNavItemExtension,
} from '@backstage/frontend-plugin-api';
import { createSearchResultListItemExtension } from '@backstage/plugin-search-react/alpha';
import {
configApiRef,
createApiFactory,
- createRouteRef,
discoveryApiRef,
fetchApiRef,
identityApiRef,
} from '@backstage/core-plugin-api';
+import { convertLegacyRouteRef } from '@backstage/core-plugin-api/alpha';
import {
techdocsApiRef,
techdocsStorageApiRef,
} from '@backstage/plugin-techdocs-react';
import { TechDocsClient, TechDocsStorageClient } from './client';
-import { convertLegacyRouteRef } from '@backstage/core-plugin-api/alpha';
-
-const rootRouteRef = createRouteRef({
- id: 'plugin.techdocs.indexPage',
-});
-
-const rootDocsRouteRef = createRouteRef({
- id: 'plugin.techdocs.readerPage',
- params: ['namespace', 'kind', 'name'],
-});
-
-/** @alpha */
-export const TechDocsSearchResultListItemExtension =
- createSearchResultListItemExtension({
- id: 'techdocs',
- configSchema: createSchemaFromZod(z =>
- z.object({
- // TODO: Define how the icon can be configurable
- title: z.string().optional(),
- lineClamp: z.number().default(5),
- asLink: z.boolean().default(true),
- asListItem: z.boolean().default(true),
- noTrack: z.boolean().default(false),
- }),
- ),
- predicate: result => result.type === 'techdocs',
- component: async ({ config }) => {
- const { TechDocsSearchResultListItem } = await import(
- './search/components/TechDocsSearchResultListItem'
- );
- return props => ;
- },
- });
-
-/**
- * Responsible for rendering the provided router element
- *
- * @alpha
- */
-const TechDocsIndexPage = createPageExtension({
- id: 'plugin.techdocs.indexPage',
- defaultPath: '/docs',
- routeRef: convertLegacyRouteRef(rootRouteRef),
- loader: () =>
- import('./home/components/TechDocsIndexPage').then(m => (
-
- )),
-});
-
-/**
- * Component responsible for composing a TechDocs reader page experience
- *
- * @alpha
- */
-const TechDocsReaderPage = createPageExtension({
- id: 'plugin.techdocs.readerPage',
- loader: () =>
- import('./reader/components/TechDocsReaderPage').then(m => (
-
- )),
- routeRef: convertLegacyRouteRef(rootDocsRouteRef),
- defaultPath: '/docs/:namespace/:kind/:name/*',
-});
+import {
+ rootCatalogDocsRouteRef,
+ rootDocsRouteRef,
+ rootRouteRef,
+} from './routes';
/** @alpha */
const techDocsStorage = createApiExtension({
@@ -144,18 +88,81 @@ const techDocsClient = createApiExtension({
},
});
+/** @alpha */
+export const TechDocsSearchResultListItemExtension =
+ createSearchResultListItemExtension({
+ id: 'techdocs',
+ configSchema: createSchemaFromZod(z =>
+ z.object({
+ // TODO: Define how the icon can be configurable
+ title: z.string().optional(),
+ lineClamp: z.number().default(5),
+ asLink: z.boolean().default(true),
+ asListItem: z.boolean().default(true),
+ noTrack: z.boolean().default(false),
+ }),
+ ),
+ predicate: result => result.type === 'techdocs',
+ component: async ({ config }) => {
+ const { TechDocsSearchResultListItem } = await import(
+ './search/components/TechDocsSearchResultListItem'
+ );
+ return props => ;
+ },
+ });
+
+/**
+ * Responsible for rendering the provided router element
+ *
+ * @alpha
+ */
+const TechDocsIndexPage = createPageExtension({
+ id: 'plugin.techdocs.indexPage',
+ defaultPath: '/docs',
+ routeRef: convertLegacyRouteRef(rootRouteRef),
+ loader: () =>
+ import('./home/components/TechDocsIndexPage').then(m => (
+
+ )),
+});
+
+/**
+ * Component responsible for composing a TechDocs reader page experience
+ *
+ * @alpha
+ */
+const TechDocsReaderPage = createPageExtension({
+ id: 'plugin.techdocs.readerPage',
+ defaultPath: '/docs/:namespace/:kind/:name',
+ routeRef: convertLegacyRouteRef(rootDocsRouteRef),
+ loader: () =>
+ import('./reader/components/TechDocsReaderPage').then(m => (
+
+ )),
+});
+
+/** @alpha */
+const TechDocsNavItem = createNavItemExtension({
+ id: 'plugin.techdocs.nav.index',
+ icon: LibraryBooks,
+ title: 'Docs',
+ routeRef: convertLegacyRouteRef(rootRouteRef),
+});
+
/** @alpha */
export default createPlugin({
id: 'techdocs',
extensions: [
- TechDocsIndexPage,
- TechDocsReaderPage,
techDocsClient,
techDocsStorage,
+ TechDocsNavItem,
+ TechDocsIndexPage,
+ TechDocsReaderPage,
TechDocsSearchResultListItemExtension,
],
routes: {
root: convertLegacyRouteRef(rootRouteRef),
docRoot: convertLegacyRouteRef(rootDocsRouteRef),
+ entityContent: convertLegacyRouteRef(rootCatalogDocsRouteRef),
},
});