Merge pull request #16614 from backstage/freben/unpack-props

🧹 unpack props inside component bodies

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

@@ -55,13 +55,11 @@ const allEntitiesGroup: DocsGroupConfig = {
   filterPredicate: () => true,
 };
 
-const EntityListDocsGridGroup = ({
-  entities,
-  group,
-}: {
+const EntityListDocsGridGroup = (props: {
   group: DocsGroupConfig;
   entities: Entity[];
 }) => {
+  const { entities, group } = props;
   const { loading: loadingOwnership, isOwnedEntity } = useEntityOwnership();
 
   const shownEntities = entities.filter(entity => {
@@ -103,7 +101,7 @@ const EntityListDocsGridGroup = ({
  *
  * @public
  */
-export const EntityListDocsGrid = ({ groups }: EntityListDocsGridPageProps) => {
+export const EntityListDocsGrid = (props: EntityListDocsGridPageProps) => {
   const { loading, error, entities } = useEntityList();
 
   if (error) {
@@ -143,7 +141,7 @@ export const EntityListDocsGrid = ({ groups }: EntityListDocsGridPageProps) => {
 
   return (
     <Content>
-      {(groups || [allEntitiesGroup]).map((group, index: number) => (
+      {(props.groups || [allEntitiesGroup]).map((group, index: number) => (
         <EntityListDocsGridGroup
           entities={entities}
           group={group}

plugins/techdocs/src/home/components/Tables/actions.tsx

@@ -47,7 +47,8 @@ export const actionFactories = {
     isStarredEntity: Function,
     toggleStarredEntity: Function,
   ) {
-    return ({ entity }: DocsTableRow) => {
+    return (row: DocsTableRow) => {
+      const entity = row.entity;
       const isStarred = isStarredEntity(entity);
       return {
         cellStyle: { paddingLeft: '1em' },

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

@@ -132,10 +132,8 @@ export type TechDocsReaderLayoutProps = {
  * Default TechDocs reader page structure composed with a header and content
  * @public
  */
-export const TechDocsReaderLayout = ({
-  withSearch,
-  withHeader = true,
-}: TechDocsReaderLayoutProps) => {
+export const TechDocsReaderLayout = (props: TechDocsReaderLayoutProps) => {
+  const { withSearch, withHeader = true } = props;
   return (
     <Page themeId="documentation">
       {withHeader && <TechDocsReaderPageHeader />}

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

@@ -48,9 +48,9 @@ export type TechDocsReaderProviderProps = {
  *
  * @public
  */
-export const TechDocsReaderProvider = ({
-  children,
-}: TechDocsReaderProviderProps) => {
+export const TechDocsReaderProvider = (props: TechDocsReaderProviderProps) => {
+  const { children } = props;
+
   const { '*': path = '' } = useParams();
   const { entityRef } = useTechDocsReaderPage();
   const { kind, namespace, name } = entityRef;