unpack props inside fn

Signed-off-by: Emma Indal <emma.indahl@gmail.com>

plugins/techdocs/api-report.md

@@ -5,7 +5,6 @@
 ```ts
 /// <reference types="react" />
 
-import { Action } from '@material-table/core';
 import { ApiRef } from '@backstage/core-plugin-api';
 import { BackstagePlugin } from '@backstage/core-plugin-api';
 import { Config } from '@backstage/config';
@@ -23,31 +22,24 @@ import { TableProps } from '@backstage/core-components';
 import { UserListFilterKind } from '@backstage/plugin-catalog-react';
 
 // @public
-export const DefaultTechDocsHome: ({
-  initialFilter,
-  columns,
-  actions,
-}: {
-  initialFilter?: UserListFilterKind | undefined;
-  columns?: TableColumn<DocsTableRow>[] | undefined;
-  actions?:
-    | (
-        | Action<DocsTableRow>
-        | {
-            action: (rowData: DocsTableRow) => Action<DocsTableRow>;
-            position: string;
-          }
-        | ((rowData: DocsTableRow) => Action<DocsTableRow>)
-      )[]
-    | undefined;
-}) => JSX.Element;
+export const DefaultTechDocsHome: (
+  props: DefaultTechDocsHomeProps,
+) => JSX.Element;
 
 // @public
-export const DocsCardGrid: ({
-  entities,
-}: {
+export type DefaultTechDocsHomeProps = {
+  initialFilter?: UserListFilterKind;
+  columns?: TableColumn<DocsTableRow>[];
+  actions?: TableProps<DocsTableRow>['actions'];
+};
+
+// @public
+export const DocsCardGrid: (props: DocsCardGridProps) => JSX.Element | null;
+
+// @public
+export type DocsCardGridProps = {
   entities: Entity[] | undefined;
-}) => JSX.Element | null;
+};
 
 // @public @deprecated (undocumented)
 export const DocsResultListItem: (
@@ -196,11 +188,14 @@ export class TechDocsClient implements TechDocsApi {
 }
 
 // @public
-export const TechDocsCustomHome: ({
-  tabsConfig,
-}: {
+export const TechDocsCustomHome: (
+  props: TechDocsCustomHomeProps,
+) => JSX.Element;
+
+// @public
+export type TechDocsCustomHomeProps = {
   tabsConfig: TabsConfig;
-}) => JSX.Element;
+};
 
 // @public
 export type TechDocsEntityMetadata = Entity & {
@@ -223,12 +218,9 @@ export const TechDocsPage: (props: TechDocsReaderPageProps) => JSX.Element;
 export const TechdocsPage: () => JSX.Element;
 
 // @public @deprecated (undocumented)
-export const TechDocsPageHeader: ({
-  entityRef,
-  entityMetadata,
-  techDocsMetadata,
-  children,
-}: TechDocsReaderPageHeaderProps) => JSX.Element;
+export const TechDocsPageHeader: (
+  props: TechDocsReaderPageHeaderProps,
+) => JSX.Element;
 
 // @public @deprecated (undocumented)
 export type TechDocsPageHeaderProps = TechDocsReaderPageHeaderProps;
@@ -271,12 +263,9 @@ export const TechDocsReaderPage: (
 ) => JSX.Element;
 
 // @public
-export const TechDocsReaderPageHeader: ({
-  entityRef,
-  entityMetadata,
-  techDocsMetadata,
-  children,
-}: TechDocsReaderPageHeaderProps) => JSX.Element;
+export const TechDocsReaderPageHeader: (
+  props: TechDocsReaderPageHeaderProps,
+) => JSX.Element;
 
 // @public
 export type TechDocsReaderPageHeaderProps = PropsWithChildren<{

plugins/techdocs/src/home/components/DefaultTechDocsHome.tsx

@@ -38,15 +38,19 @@ import { TechDocsPageWrapper } from './TechDocsPageWrapper';
 import { TechDocsPicker } from './TechDocsPicker';
 import { DocsTableRow, EntityListDocsTable } from './Tables';
 
-export const DefaultTechDocsHome = ({
-  initialFilter = 'all',
-  columns,
-  actions,
-}: {
+/**
+ * Props for {@link DefaultTechDocsHome}
+ *
+ * @public
+ */
+export type DefaultTechDocsHomeProps = {
   initialFilter?: UserListFilterKind;
   columns?: TableColumn<DocsTableRow>[];
   actions?: TableProps<DocsTableRow>['actions'];
-}) => {
+};
+
+export const DefaultTechDocsHome = (props: DefaultTechDocsHomeProps) => {
+  const { initialFilter = 'all', columns, actions } = props;
   return (
     <TechDocsPageWrapper>
       <Content>

plugins/techdocs/src/home/components/Grids/DocsCardGrid.tsx

@@ -26,16 +26,22 @@ import {
 import { Card, CardActions, CardContent, CardMedia } from '@material-ui/core';
 import React from 'react';
 
+/**
+ * Props for {@link DocsCardGrid}
+ *
+ * @public
+ */
+export type DocsCardGridProps = {
+  entities: Entity[] | undefined;
+};
+
 /**
  * Component which accepts a list of entities and renders a item card for each entity
  *
  * @public
  */
-export const DocsCardGrid = ({
-  entities,
-}: {
-  entities: Entity[] | undefined;
-}) => {
+export const DocsCardGrid = (props: DocsCardGridProps) => {
+  const { entities } = props;
   const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);
   const config = useApi(configApiRef);
   if (!entities) return null;

plugins/techdocs/src/home/components/TechDocsCustomHome.tsx

@@ -138,11 +138,17 @@ const CustomPanel = ({
   );
 };
 
-export const TechDocsCustomHome = ({
-  tabsConfig,
-}: {
+/**
+ * Props for {@link TechDocsCustomHome}
+ *
+ * @public
+ */
+export type TechDocsCustomHomeProps = {
   tabsConfig: TabsConfig;
-}) => {
+};
+
+export const TechDocsCustomHome = (props: TechDocsCustomHomeProps) => {
+  const { tabsConfig } = props;
   const [selectedTab, setSelectedTab] = useState<number>(0);
   const catalogApi: CatalogApi = useApi(catalogApiRef);
 

plugins/techdocs/src/home/components/index.ts

@@ -22,6 +22,7 @@ export type {
   PanelConfig,
   TabConfig,
   TabsConfig,
+  TechDocsCustomHomeProps,
 } from './TechDocsCustomHome';
 export * from './TechDocsPageWrapper';
 export * from './TechDocsPicker';

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

@@ -45,12 +45,10 @@ export type TechDocsReaderPageHeaderProps = PropsWithChildren<{
  *
  * @public
  */
-export const TechDocsReaderPageHeader = ({
-  entityRef,
-  entityMetadata,
-  techDocsMetadata,
-  children,
-}: TechDocsReaderPageHeaderProps) => {
+export const TechDocsReaderPageHeader = (
+  props: TechDocsReaderPageHeaderProps,
+) => {
+  const { entityRef, entityMetadata, techDocsMetadata, children } = props;
   const { name } = entityRef;
 
   const { site_name: siteName, site_description: siteDescription } =