Merge pull request #9244 from jonathan-ash/techdocs-reader-custom-error-page

Added the option to supply a custom error page to TechDocsPage

plugins/techdocs/src/reader/components/TechDocsPage.tsx

@@ -19,11 +19,10 @@ import { useOutlet } from 'react-router';
 import { useParams } from 'react-router-dom';
 import useAsync from 'react-use/lib/useAsync';
 import { techdocsApiRef } from '../../api';
-import { TechDocsNotFound } from './TechDocsNotFound';
 import { LegacyTechDocsPage } from './LegacyTechDocsPage';
 import { TechDocsEntityMetadata, TechDocsMetadata } from '../../types';
 import { EntityName } from '@backstage/catalog-model';
-import { useApi } from '@backstage/core-plugin-api';
+import { useApi, useApp } from '@backstage/core-plugin-api';
 import { Page } from '@backstage/core-components';
 
 export type TechDocsPageRenderFunction = ({
@@ -42,6 +41,7 @@ export type TechDocsPageProps = {
 };
 
 export const TechDocsPage = ({ children }: TechDocsPageProps) => {
+  const { NotFoundErrorPage } = useApp().getComponents();
   const outlet = useOutlet();
 
   const [documentReady, setDocumentReady] = useState<boolean>(false);
@@ -66,9 +66,7 @@ export const TechDocsPage = ({ children }: TechDocsPageProps) => {
     setDocumentReady(true);
   }, [setDocumentReady]);
 
-  if (entityMetadataError) {
-    return <TechDocsNotFound errorMessage={entityMetadataError.message} />;
-  }
+  if (entityMetadataError) return <NotFoundErrorPage />;
 
   if (!children) return outlet || <LegacyTechDocsPage />;