Merge pull request #25050 from jvanalstyne-mdsol/feat/component-card-columns

feat(api-docs): Columns override on ComponentsCards

plugins/api-docs/api-report.md

@@ -9,6 +9,7 @@ import { ApiEntity } from '@backstage/catalog-model';
 import { ApiRef } from '@backstage/core-plugin-api';
 import { BackstagePlugin } from '@backstage/core-plugin-api';
 import { CatalogTableRow } from '@backstage/plugin-catalog';
+import { ComponentEntity } from '@backstage/catalog-model';
 import { EntityOwnerPickerProps } from '@backstage/plugin-catalog-react';
 import { ExternalRouteRef } from '@backstage/core-plugin-api';
 import { InfoCardVariants } from '@backstage/core-components';
@@ -97,6 +98,7 @@ export const ConsumedApisCard: (props: {
 // @public (undocumented)
 export const ConsumingComponentsCard: (props: {
   variant?: InfoCardVariants;
+  columns?: TableColumn<ComponentEntity>[];
 }) => React_2.JSX.Element;
 
 // @public
@@ -129,6 +131,7 @@ export const EntityConsumedApisCard: (props: {
 // @public (undocumented)
 export const EntityConsumingComponentsCard: (props: {
   variant?: InfoCardVariants | undefined;
+  columns?: TableColumn<ComponentEntity>[] | undefined;
 }) => JSX_2.Element;
 
 // @public (undocumented)
@@ -150,6 +153,7 @@ export const EntityProvidedApisCard: (props: {
 // @public (undocumented)
 export const EntityProvidingComponentsCard: (props: {
   variant?: InfoCardVariants | undefined;
+  columns?: TableColumn<ComponentEntity>[] | undefined;
 }) => JSX_2.Element;
 
 // @public (undocumented)
@@ -204,6 +208,7 @@ export const ProvidedApisCard: (props: {
 // @public (undocumented)
 export const ProvidingComponentsCard: (props: {
   variant?: InfoCardVariants;
+  columns?: TableColumn<ComponentEntity>[];
 }) => React_2.JSX.Element;
 
 // @public (undocumented)

plugins/api-docs/src/components/ComponentsCards/ConsumingComponentsCard.tsx

@@ -31,6 +31,7 @@ import {
   InfoCardVariants,
   Link,
   Progress,
+  TableColumn,
   WarningPanel,
 } from '@backstage/core-components';
 
@@ -39,8 +40,10 @@ import {
  */
 export const ConsumingComponentsCard = (props: {
   variant?: InfoCardVariants;
+  columns?: TableColumn<ComponentEntity>[];
 }) => {
-  const { variant = 'gridItem' } = props;
+  const { variant = 'gridItem', columns = EntityTable.componentEntityColumns } =
+    props;
   const { entity } = useEntity();
   const { entities, loading, error } = useRelatedEntities(entity, {
     type: RELATION_API_CONSUMED_BY,
@@ -82,7 +85,7 @@ export const ConsumingComponentsCard = (props: {
           </Typography>
         </div>
       }
-      columns={EntityTable.componentEntityColumns}
+      columns={columns}
       entities={entities as ComponentEntity[]}
     />
   );

plugins/api-docs/src/components/ComponentsCards/ProvidingComponentsCard.tsx

@@ -31,14 +31,17 @@ import {
   InfoCardVariants,
   Link,
   Progress,
+  TableColumn,
   WarningPanel,
 } from '@backstage/core-components';
 
 /** @public */
 export const ProvidingComponentsCard = (props: {
   variant?: InfoCardVariants;
+  columns?: TableColumn<ComponentEntity>[];
 }) => {
-  const { variant = 'gridItem' } = props;
+  const { variant = 'gridItem', columns = EntityTable.componentEntityColumns } =
+    props;
   const { entity } = useEntity();
   const { entities, loading, error } = useRelatedEntities(entity, {
     type: RELATION_API_PROVIDED_BY,
@@ -80,7 +83,7 @@ export const ProvidingComponentsCard = (props: {
           </Typography>
         </div>
       }
-      columns={EntityTable.componentEntityColumns}
+      columns={columns}
       entities={entities as ComponentEntity[]}
     />
   );