From d329505d37586a616a1020015806a823640dd64f Mon Sep 17 00:00:00 2001
From: Michael Haley <mike.f.haley@gmail.com>
Date: Tue, 10 May 2022 11:08:13 -0400
Subject: [PATCH] Allow tableOptions to be passed to relatedEntity components

Signed-off-by: Michael Haley <mike.f.haley@gmail.com>
---
 .../src/components/EntityTable/EntityTable.tsx   | 16 +++++++++++-----
 .../DependencyOfComponentsCard.tsx               | 15 ++++++++++++---
 .../DependsOnComponentsCard.tsx                  | 12 +++++++++---
 .../DependsOnResourcesCard.tsx                   |  8 +++++---
 .../HasComponentsCard/HasComponentsCard.tsx      |  8 +++++---
 .../HasResourcesCard/HasResourcesCard.tsx        |  8 +++++---
 .../HasSubcomponentsCard.tsx                     |  8 +++++---
 .../components/HasSystemsCard/HasSystemsCard.tsx |  5 +++--
 .../RelatedEntitiesCard/RelatedEntitiesCard.tsx  |  4 ++++
 9 files changed, 59 insertions(+), 25 deletions(-)

diff --git a/plugins/catalog-react/src/components/EntityTable/EntityTable.tsx b/plugins/catalog-react/src/components/EntityTable/EntityTable.tsx
index 3aa6857120..aced5b63e1 100644
--- a/plugins/catalog-react/src/components/EntityTable/EntityTable.tsx
+++ b/plugins/catalog-react/src/components/EntityTable/EntityTable.tsx
@@ -23,6 +23,7 @@ import {
   InfoCardVariants,
   Table,
   TableColumn,
+  TableProps,
 } from '@backstage/core-components';
 
 /**
@@ -36,6 +37,7 @@ export interface EntityTableProps<T extends Entity> {
   entities: T[];
   emptyContent?: ReactNode;
   columns: TableColumn<T>[];
+  tableOptions?: TableProps<T>['options'];
 }
 
 const useStyles = makeStyles(theme => ({
@@ -59,6 +61,7 @@ export const EntityTable = <T extends Entity>(props: EntityTableProps<T>) => {
     emptyContent,
     variant = 'gridItem',
     columns,
+    tableOptions,
   } = props;
 
   const classes = useStyles();
@@ -80,11 +83,14 @@ export const EntityTable = <T extends Entity>(props: EntityTableProps<T>) => {
         emptyContent && <div className={classes.empty}>{emptyContent}</div>
       }
       options={{
-        // TODO: Toolbar padding if off compared to other cards, should be: padding: 16px 24px;
-        search: false,
-        paging: false,
-        actionsColumnIndex: -1,
-        padding: 'dense',
+        ...{
+          // TODO: Toolbar padding if off compared to other cards, should be: padding: 16px 24px;
+          search: false,
+          paging: false,
+          actionsColumnIndex: -1,
+          padding: 'dense',
+        },
+        ...tableOptions,
       }}
       data={entities}
     />
diff --git a/plugins/catalog/src/components/DependencyOfComponentsCard/DependencyOfComponentsCard.tsx b/plugins/catalog/src/components/DependencyOfComponentsCard/DependencyOfComponentsCard.tsx
index d87b558048..3b22ea2aa0 100644
--- a/plugins/catalog/src/components/DependencyOfComponentsCard/DependencyOfComponentsCard.tsx
+++ b/plugins/catalog/src/components/DependencyOfComponentsCard/DependencyOfComponentsCard.tsx
@@ -14,8 +14,11 @@
  * limitations under the License.
  */
 
-import { RELATION_DEPENDENCY_OF } from '@backstage/catalog-model';
-import { InfoCardVariants } from '@backstage/core-components';
+import {
+  ComponentEntity,
+  RELATION_DEPENDENCY_OF,
+} from '@backstage/catalog-model';
+import { InfoCardVariants, TableProps } from '@backstage/core-components';
 import React from 'react';
 import {
   asComponentEntities,
@@ -28,12 +31,17 @@ import {
 export interface DependencyOfComponentsCardProps {
   variant?: InfoCardVariants;
   title?: string;
+  tableOptions?: TableProps<ComponentEntity>['options'];
 }
 
 export function DependencyOfComponentsCard(
   props: DependencyOfComponentsCardProps,
 ) {
-  const { variant = 'gridItem', title = 'Dependency of components' } = props;
+  const {
+    variant = 'gridItem',
+    title = 'Dependency of components',
+    tableOptions,
+  } = props;
   return (
     <RelatedEntitiesCard
       variant={variant}
@@ -44,6 +52,7 @@ export function DependencyOfComponentsCard(
       emptyMessage="No component depends on this component"
       emptyHelpLink={componentEntityHelpLink}
       asRenderableEntities={asComponentEntities}
+      tableOptions={tableOptions}
     />
   );
 }
diff --git a/plugins/catalog/src/components/DependsOnComponentsCard/DependsOnComponentsCard.tsx b/plugins/catalog/src/components/DependsOnComponentsCard/DependsOnComponentsCard.tsx
index 4f30c17a84..50e195e88a 100644
--- a/plugins/catalog/src/components/DependsOnComponentsCard/DependsOnComponentsCard.tsx
+++ b/plugins/catalog/src/components/DependsOnComponentsCard/DependsOnComponentsCard.tsx
@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 
-import { RELATION_DEPENDS_ON } from '@backstage/catalog-model';
-import { InfoCardVariants } from '@backstage/core-components';
+import { ComponentEntity, RELATION_DEPENDS_ON } from '@backstage/catalog-model';
+import { InfoCardVariants, TableProps } from '@backstage/core-components';
 import React from 'react';
 import {
   asComponentEntities,
@@ -28,10 +28,15 @@ import {
 export interface DependsOnComponentsCardProps {
   variant?: InfoCardVariants;
   title?: string;
+  tableOptions?: TableProps<ComponentEntity>['options'];
 }
 
 export function DependsOnComponentsCard(props: DependsOnComponentsCardProps) {
-  const { variant = 'gridItem', title = 'Depends on components' } = props;
+  const {
+    variant = 'gridItem',
+    title = 'Depends on components',
+    tableOptions,
+  } = props;
   return (
     <RelatedEntitiesCard
       variant={variant}
@@ -42,6 +47,7 @@ export function DependsOnComponentsCard(props: DependsOnComponentsCardProps) {
       emptyMessage="No component is a dependency of this component"
       emptyHelpLink={componentEntityHelpLink}
       asRenderableEntities={asComponentEntities}
+      tableOptions={tableOptions}
     />
   );
 }
diff --git a/plugins/catalog/src/components/DependsOnResourcesCard/DependsOnResourcesCard.tsx b/plugins/catalog/src/components/DependsOnResourcesCard/DependsOnResourcesCard.tsx
index a0f4d399f9..49c05d5eef 100644
--- a/plugins/catalog/src/components/DependsOnResourcesCard/DependsOnResourcesCard.tsx
+++ b/plugins/catalog/src/components/DependsOnResourcesCard/DependsOnResourcesCard.tsx
@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 
-import { RELATION_DEPENDS_ON } from '@backstage/catalog-model';
-import { InfoCardVariants } from '@backstage/core-components';
+import { RELATION_DEPENDS_ON, ResourceEntity } from '@backstage/catalog-model';
+import { InfoCardVariants, TableProps } from '@backstage/core-components';
 import React from 'react';
 import {
   asResourceEntities,
@@ -27,10 +27,11 @@ import {
 /** @public */
 export interface DependsOnResourcesCardProps {
   variant?: InfoCardVariants;
+  tableOptions?: TableProps<ResourceEntity>['options'];
 }
 
 export function DependsOnResourcesCard(props: DependsOnResourcesCardProps) {
-  const { variant = 'gridItem' } = props;
+  const { variant = 'gridItem', tableOptions } = props;
   return (
     <RelatedEntitiesCard
       variant={variant}
@@ -41,6 +42,7 @@ export function DependsOnResourcesCard(props: DependsOnResourcesCardProps) {
       emptyMessage="No resource is a dependency of this component"
       emptyHelpLink={componentEntityHelpLink}
       asRenderableEntities={asResourceEntities}
+      tableOptions={tableOptions}
     />
   );
 }
diff --git a/plugins/catalog/src/components/HasComponentsCard/HasComponentsCard.tsx b/plugins/catalog/src/components/HasComponentsCard/HasComponentsCard.tsx
index 9654152a5c..e0f01e932e 100644
--- a/plugins/catalog/src/components/HasComponentsCard/HasComponentsCard.tsx
+++ b/plugins/catalog/src/components/HasComponentsCard/HasComponentsCard.tsx
@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 
-import { RELATION_HAS_PART } from '@backstage/catalog-model';
-import { InfoCardVariants } from '@backstage/core-components';
+import { ComponentEntity, RELATION_HAS_PART } from '@backstage/catalog-model';
+import { InfoCardVariants, TableProps } from '@backstage/core-components';
 import React from 'react';
 import {
   asComponentEntities,
@@ -27,10 +27,11 @@ import {
 /** @public */
 export interface HasComponentsCardProps {
   variant?: InfoCardVariants;
+  tableOptions?: TableProps<ComponentEntity>['options'];
 }
 
 export function HasComponentsCard(props: HasComponentsCardProps) {
-  const { variant = 'gridItem' } = props;
+  const { variant = 'gridItem', tableOptions } = props;
   return (
     <RelatedEntitiesCard
       variant={variant}
@@ -41,6 +42,7 @@ export function HasComponentsCard(props: HasComponentsCardProps) {
       emptyMessage="No component is part of this system"
       emptyHelpLink={componentEntityHelpLink}
       asRenderableEntities={asComponentEntities}
+      tableOptions={tableOptions}
     />
   );
 }
diff --git a/plugins/catalog/src/components/HasResourcesCard/HasResourcesCard.tsx b/plugins/catalog/src/components/HasResourcesCard/HasResourcesCard.tsx
index 8476d77bda..fc32d056d5 100644
--- a/plugins/catalog/src/components/HasResourcesCard/HasResourcesCard.tsx
+++ b/plugins/catalog/src/components/HasResourcesCard/HasResourcesCard.tsx
@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 
-import { RELATION_HAS_PART } from '@backstage/catalog-model';
-import { InfoCardVariants } from '@backstage/core-components';
+import { RELATION_HAS_PART, ResourceEntity } from '@backstage/catalog-model';
+import { InfoCardVariants, TableProps } from '@backstage/core-components';
 import React from 'react';
 import {
   asResourceEntities,
@@ -27,10 +27,11 @@ import {
 /** @public */
 export interface HasResourcesCardProps {
   variant?: InfoCardVariants;
+  tableOptions?: TableProps<ResourceEntity>['options'];
 }
 
 export function HasResourcesCard(props: HasResourcesCardProps) {
-  const { variant = 'gridItem' } = props;
+  const { variant = 'gridItem', tableOptions } = props;
   return (
     <RelatedEntitiesCard
       variant={variant}
@@ -41,6 +42,7 @@ export function HasResourcesCard(props: HasResourcesCardProps) {
       asRenderableEntities={asResourceEntities}
       emptyMessage="No resource is part of this system"
       emptyHelpLink={resourceEntityHelpLink}
+      tableOptions={tableOptions}
     />
   );
 }
diff --git a/plugins/catalog/src/components/HasSubcomponentsCard/HasSubcomponentsCard.tsx b/plugins/catalog/src/components/HasSubcomponentsCard/HasSubcomponentsCard.tsx
index db95d31f9f..9702a70788 100644
--- a/plugins/catalog/src/components/HasSubcomponentsCard/HasSubcomponentsCard.tsx
+++ b/plugins/catalog/src/components/HasSubcomponentsCard/HasSubcomponentsCard.tsx
@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 
-import { RELATION_HAS_PART } from '@backstage/catalog-model';
-import { InfoCardVariants } from '@backstage/core-components';
+import { ComponentEntity, RELATION_HAS_PART } from '@backstage/catalog-model';
+import { InfoCardVariants, TableProps } from '@backstage/core-components';
 import React from 'react';
 import {
   asComponentEntities,
@@ -26,10 +26,11 @@ import {
 /** @public */
 export interface HasSubcomponentsCardProps {
   variant?: InfoCardVariants;
+  tableOptions?: TableProps<ComponentEntity>['options'];
 }
 
 export function HasSubcomponentsCard(props: HasSubcomponentsCardProps) {
-  const { variant = 'gridItem' } = props;
+  const { variant = 'gridItem', tableOptions } = props;
   return (
     <RelatedEntitiesCard
       variant={variant}
@@ -40,6 +41,7 @@ export function HasSubcomponentsCard(props: HasSubcomponentsCardProps) {
       asRenderableEntities={asComponentEntities}
       emptyMessage="No subcomponent is part of this component"
       emptyHelpLink="https://backstage.io/docs/features/software-catalog/descriptor-format#specsubcomponentof-optional"
+      tableOptions={tableOptions}
     />
   );
 }
diff --git a/plugins/catalog/src/components/HasSystemsCard/HasSystemsCard.tsx b/plugins/catalog/src/components/HasSystemsCard/HasSystemsCard.tsx
index 5d6fa170f5..6eb29c721b 100644
--- a/plugins/catalog/src/components/HasSystemsCard/HasSystemsCard.tsx
+++ b/plugins/catalog/src/components/HasSystemsCard/HasSystemsCard.tsx
@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 
-import { RELATION_HAS_PART } from '@backstage/catalog-model';
-import { InfoCardVariants } from '@backstage/core-components';
+import { RELATION_HAS_PART, SystemEntity } from '@backstage/catalog-model';
+import { InfoCardVariants, TableProps } from '@backstage/core-components';
 import React from 'react';
 import {
   asSystemEntities,
@@ -27,6 +27,7 @@ import {
 /** @public */
 export interface HasSystemsCardProps {
   variant?: InfoCardVariants;
+  tableOptions?: TableProps<SystemEntity>['options'];
 }
 
 export function HasSystemsCard(props: HasSystemsCardProps) {
diff --git a/plugins/catalog/src/components/RelatedEntitiesCard/RelatedEntitiesCard.tsx b/plugins/catalog/src/components/RelatedEntitiesCard/RelatedEntitiesCard.tsx
index e802b0b583..80785a071d 100644
--- a/plugins/catalog/src/components/RelatedEntitiesCard/RelatedEntitiesCard.tsx
+++ b/plugins/catalog/src/components/RelatedEntitiesCard/RelatedEntitiesCard.tsx
@@ -29,6 +29,7 @@ import {
   Progress,
   ResponseErrorPanel,
   TableColumn,
+  TableProps,
 } from '@backstage/core-components';
 
 /** @public */
@@ -40,6 +41,7 @@ export type RelatedEntitiesCardProps<T extends Entity> = {
   relationType: string;
   emptyMessage: string;
   emptyHelpLink: string;
+  tableOptions?: TableProps<T>['options'];
   asRenderableEntities: (entities: Entity[]) => T[];
 };
 
@@ -66,6 +68,7 @@ export function RelatedEntitiesCard<T extends Entity>(
     relationType,
     emptyMessage,
     emptyHelpLink,
+    tableOptions,
     asRenderableEntities,
   } = props;
 
@@ -105,6 +108,7 @@ export function RelatedEntitiesCard<T extends Entity>(
       }
       columns={columns}
       entities={asRenderableEntities(entities || [])}
+      tableOptions={tableOptions}
     />
   );
 }