feat: make columns configurable in has subdomains card

Signed-off-by: Jano González <info@janogonzalez.com>

plugins/catalog/src/components/HasSubdomainsCard/HasSubdomainsCard.tsx

@@ -14,12 +14,17 @@
  * limitations under the License.
  */
 
-import { RELATION_HAS_PART } from '@backstage/catalog-model';
-import { InfoCardVariants, TableOptions } from '@backstage/core-components';
+import { DomainEntity, RELATION_HAS_PART } from '@backstage/catalog-model';
+import {
+  InfoCardVariants,
+  TableColumn,
+  TableOptions,
+} from '@backstage/core-components';
 import React from 'react';
 import {
-  asComponentEntities,
-  componentEntityColumns,
+  asDomainEntities,
+  domainEntityColumns,
+  domainEntityHelpLink,
   RelatedEntitiesCard,
 } from '../RelatedEntitiesCard';
 import { catalogTranslationRef } from '../../alpha/translation';
@@ -29,6 +34,7 @@ import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 export interface HasSubdomainsCardProps {
   variant?: InfoCardVariants;
   tableOptions?: TableOptions;
+  columns?: TableColumn<DomainEntity>[];
   title?: string;
 }
 
@@ -36,8 +42,9 @@ export function HasSubdomainsCard(props: HasSubdomainsCardProps) {
   const { t } = useTranslationRef(catalogTranslationRef);
   const {
     variant = 'gridItem',
-    tableOptions = {},
     title = t('hasSubdomainsCard.title'),
+    columns = domainEntityColumns,
+    tableOptions = {},
   } = props;
   return (
     <RelatedEntitiesCard
@@ -45,10 +52,10 @@ export function HasSubdomainsCard(props: HasSubdomainsCardProps) {
       title={title}
       entityKind="Domain"
       relationType={RELATION_HAS_PART}
-      columns={componentEntityColumns}
-      asRenderableEntities={asComponentEntities}
+      columns={columns}
+      asRenderableEntities={asDomainEntities}
       emptyMessage={t('hasSubdomainsCard.emptyMessage')}
-      emptyHelpLink="https://backstage.io/docs/features/software-catalog/descriptor-format/#specsubdomainof-optional"
+      emptyHelpLink={domainEntityHelpLink}
       tableOptions={tableOptions}
     />
   );

plugins/catalog/src/components/RelatedEntitiesCard/RelatedEntitiesCard.tsx

@@ -33,10 +33,13 @@ import {
 } from '@backstage/core-components';
 import {
   asComponentEntities,
+  asDomainEntities,
   asResourceEntities,
   asSystemEntities,
   componentEntityColumns,
   componentEntityHelpLink,
+  domainEntityColumns,
+  domainEntityHelpLink,
   resourceEntityColumns,
   resourceEntityHelpLink,
   systemEntityColumns,
@@ -137,3 +140,6 @@ RelatedEntitiesCard.asResourceEntities = asResourceEntities;
 RelatedEntitiesCard.systemEntityColumns = systemEntityColumns;
 RelatedEntitiesCard.systemEntityHelpLink = systemEntityHelpLink;
 RelatedEntitiesCard.asSystemEntities = asSystemEntities;
+RelatedEntitiesCard.domainEntityColums = domainEntityColumns;
+RelatedEntitiesCard.domainEntityHelpLink = domainEntityHelpLink;
+RelatedEntitiesCard.asDomainEntities = asDomainEntities;

plugins/catalog/src/components/RelatedEntitiesCard/presets.ts

@@ -15,6 +15,7 @@
  */
 import {
   ComponentEntity,
+  DomainEntity,
   Entity,
   ResourceEntity,
   SystemEntity,
@@ -55,3 +56,13 @@ export const systemEntityHelpLink: string =
   'https://backstage.io/docs/features/software-catalog/descriptor-format#kind-system';
 export const asSystemEntities = (entities: Entity[]): SystemEntity[] =>
   entities as SystemEntity[];
+
+export const domainEntityColumns: TableColumn<DomainEntity>[] = [
+  EntityTable.columns.createEntityRefColumn({ defaultKind: 'domain' }),
+  EntityTable.columns.createOwnerColumn(),
+  EntityTable.columns.createMetadataDescriptionColumn(),
+];
+export const domainEntityHelpLink: string =
+  'https://backstage.io/docs/features/software-catalog/descriptor-format#kind-domain';
+export const asDomainEntities = (entities: Entity[]): DomainEntity[] =>
+  entities as DomainEntity[];