update after review

Signed-off-by: Andreas Berger <andreas@berger-ecommerce.com>

plugins/catalog-react/report-alpha.api.md

@@ -339,6 +339,15 @@ export const EntityContentBlueprint: ExtensionBlueprint<{
   };
 }>;
 
+// @alpha (undocumented)
+export type EntityContentGroupDefinitions = Record<
+  string,
+  {
+    title: string;
+    icon?: string | ReactElement;
+  }
+>;
+
 // @alpha (undocumented)
 export const EntityContentLayoutBlueprint: ExtensionBlueprint<{
   kind: 'entity-content-layout';
@@ -622,15 +631,6 @@ export type EntityTableColumnTitleProps = {
     | 'domain';
 };
 
-// @alpha (undocumented)
-export type GroupDefinitions = Record<
-  string,
-  {
-    title: string;
-    icon?: string | ReactElement;
-  }
->;
-
 // @alpha
 export function isOwnerOf(owner: Entity, entity: Entity): boolean;
 

plugins/catalog-react/src/alpha/blueprints/extensionData.tsx

@@ -42,7 +42,7 @@ export const entityFilterExpressionDataRef =
   });
 
 /** @alpha */
-export type GroupDefinitions = Record<
+export type EntityContentGroupDefinitions = Record<
   string,
   {
     title: string;
@@ -73,7 +73,7 @@ export const defaultEntityContentGroupDefinitions = {
   observability: {
     title: 'Observability',
   },
-} satisfies GroupDefinitions;
+} satisfies EntityContentGroupDefinitions;
 
 /**
  * @alpha

plugins/catalog-react/src/alpha/blueprints/index.ts

@@ -24,7 +24,7 @@ export { EntityHeaderBlueprint } from './EntityHeaderBlueprint';
 export {
   defaultEntityContentGroups,
   defaultEntityContentGroupDefinitions,
-  type GroupDefinitions,
+  type EntityContentGroupDefinitions,
 } from './extensionData';
 export type { EntityCardType } from './extensionData';
 export {

plugins/catalog/src/alpha/components/EntityLayout/EntityLayout.tsx

@@ -40,7 +40,7 @@ import {
 import { catalogTranslationRef } from '../../translation';
 import { EntityHeader } from '../EntityHeader';
 import { EntityTabs } from '../EntityTabs';
-import { GroupDefinitions } from '@backstage/plugin-catalog-react/alpha';
+import { EntityContentGroupDefinitions } from '@backstage/plugin-catalog-react/alpha';
 
 export type EntityLayoutRouteProps = {
   path: string;
@@ -79,7 +79,7 @@ export interface EntityLayoutProps {
    * It adds breadcrumbs in the Entity page to enhance user navigation and context awareness.
    */
   parentEntityRelations?: string[];
-  groupDefinitions: GroupDefinitions;
+  groupDefinitions: EntityContentGroupDefinitions;
   showIcons?: boolean;
 }
 

plugins/catalog/src/alpha/components/EntityTabs/EntityTabs.tsx

@@ -18,7 +18,7 @@ import { Helmet } from 'react-helmet';
 import { matchRoutes, useParams, useRoutes, Outlet } from 'react-router-dom';
 import { EntityTabsPanel } from './EntityTabsPanel';
 import { EntityTabsList } from './EntityTabsList';
-import { GroupDefinitions } from '@backstage/plugin-catalog-react/alpha';
+import { EntityContentGroupDefinitions } from '@backstage/plugin-catalog-react/alpha';
 
 type SubRoute = {
   group?: string;
@@ -79,7 +79,7 @@ export function useSelectedSubRoute(subRoutes: SubRoute[]): {
 
 type EntityTabsProps = {
   routes: SubRoute[];
-  groupDefinitions: GroupDefinitions;
+  groupDefinitions: EntityContentGroupDefinitions;
   showIcons?: boolean;
 };
 

plugins/catalog/src/alpha/components/EntityTabs/EntityTabsGroup.tsx

@@ -164,14 +164,14 @@ function resolveIcon(
   if (!showIcons) {
     return undefined;
   }
-  const itemIcon = icon;
-  if (typeof itemIcon === 'string') {
-    const Icon = iconsApi.getIcon(itemIcon);
+  if (typeof icon === 'string') {
+    const Icon = iconsApi.getIcon(icon);
     if (Icon) {
       return <Icon />;
     }
+    return undefined;
   }
-  return itemIcon;
+  return icon;
 }
 
 const Tab = forwardRef(function Tab(props: EntityTabsGroupProps, ref: any) {

plugins/catalog/src/alpha/components/EntityTabs/EntityTabsList.tsx

@@ -19,7 +19,7 @@ import Box from '@material-ui/core/Box';
 import Tabs from '@material-ui/core/Tabs';
 import { makeStyles } from '@material-ui/core/styles';
 import { EntityTabsGroup } from './EntityTabsGroup';
-import { GroupDefinitions } from '@backstage/plugin-catalog-react/alpha';
+import { EntityContentGroupDefinitions } from '@backstage/plugin-catalog-react/alpha';
 
 /** @public */
 export type HeaderTabsClassKey =
@@ -74,7 +74,7 @@ type TabGroup = {
 
 type EntityTabsListProps = {
   tabs: Tab[];
-  groupDefinitions: GroupDefinitions;
+  groupDefinitions: EntityContentGroupDefinitions;
   showIcons?: boolean;
   selectedIndex?: number;
 };

plugins/catalog/src/alpha/pages.tsx

@@ -29,7 +29,7 @@ import {
   EntityContentBlueprint,
   EntityContextMenuItemBlueprint,
   EntityHeaderBlueprint,
-  GroupDefinitions,
+  EntityContentGroupDefinitions,
 } from '@backstage/plugin-catalog-react/alpha';
 import { rootRouteRef } from '../routes';
 import { useEntityFromUrl } from '../components/CatalogEntityPage/useEntityFromUrl';
@@ -150,7 +150,7 @@ export const catalogEntityPage = PageBlueprint.makeWithOverrides({
         const groupDefinitions =
           config.groups?.reduce(
             (rest, group) => ({ ...rest, ...group }),
-            {} as GroupDefinitions,
+            {} as EntityContentGroupDefinitions,
           ) ?? defaultEntityContentGroupDefinitions;
 
         const Component = () => {