From 075a9a067bfbd4296dc9a7bfd16845d6c6b6d583 Mon Sep 17 00:00:00 2001
From: Eric Peterson <ericpeterson@spotify.com>
Date: Mon, 25 Apr 2022 15:10:00 +0200
Subject: [PATCH] Clean up createTechDocsAddonExtension return type

Signed-off-by: Eric Peterson <ericpeterson@spotify.com>
---
 .changeset/techdocs-touch-screen-wipes.md            | 5 +++++
 plugins/techdocs-module-addons-contrib/api-report.md | 3 +--
 plugins/techdocs-react/api-report.md                 | 2 +-
 plugins/techdocs-react/src/addons.tsx                | 4 ++--
 4 files changed, 9 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/techdocs-touch-screen-wipes.md

diff --git a/.changeset/techdocs-touch-screen-wipes.md b/.changeset/techdocs-touch-screen-wipes.md
new file mode 100644
index 0000000000..0165e6c9bc
--- /dev/null
+++ b/.changeset/techdocs-touch-screen-wipes.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-techdocs-react': patch
+---
+
+Updated the return type of `createTechDocsAddonExtension` to better reflect the fact that passing children to Addon components is not a valid use-case.
diff --git a/plugins/techdocs-module-addons-contrib/api-report.md b/plugins/techdocs-module-addons-contrib/api-report.md
index 264f12970b..076b05957c 100644
--- a/plugins/techdocs-module-addons-contrib/api-report.md
+++ b/plugins/techdocs-module-addons-contrib/api-report.md
@@ -6,10 +6,9 @@
 /// <reference types="react" />
 
 import { BackstagePlugin } from '@backstage/core-plugin-api';
-import { ComponentType } from 'react';
 
 // @public
-export const ReportIssue: ComponentType<ReportIssueProps>;
+export const ReportIssue: (props: ReportIssueProps) => JSX.Element | null;
 
 // @public (undocumented)
 export type ReportIssueProps = {
diff --git a/plugins/techdocs-react/api-report.md b/plugins/techdocs-react/api-report.md
index 29bbf7234b..264d59146e 100644
--- a/plugins/techdocs-react/api-report.md
+++ b/plugins/techdocs-react/api-report.md
@@ -17,7 +17,7 @@ import { SetStateAction } from 'react';
 // @alpha
 export function createTechDocsAddonExtension<TComponentProps>(
   options: TechDocsAddonOptions<TComponentProps>,
-): Extension<ComponentType<TComponentProps>>;
+): Extension<(props: TComponentProps) => JSX.Element | null>;
 
 // @alpha (undocumented)
 export const defaultTechDocsReaderPageValue: TechDocsReaderPageValue;
diff --git a/plugins/techdocs-react/src/addons.tsx b/plugins/techdocs-react/src/addons.tsx
index 54d4f92e2f..39d110bee3 100644
--- a/plugins/techdocs-react/src/addons.tsx
+++ b/plugins/techdocs-react/src/addons.tsx
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { ComponentType, useCallback } from 'react';
+import React, { useCallback } from 'react';
 import { useOutlet } from 'react-router-dom';
 
 import {
@@ -53,7 +53,7 @@ const getDataKeyByName = (name: string) => {
  */
 export function createTechDocsAddonExtension<TComponentProps>(
   options: TechDocsAddonOptions<TComponentProps>,
-): Extension<ComponentType<TComponentProps>> {
+): Extension<(props: TComponentProps) => JSX.Element | null> {
   const { name, component: TechDocsAddon } = options;
   return createReactExtension({
     name,