diff --git a/.changeset/wild-ravens-laugh.md b/.changeset/wild-ravens-laugh.md
new file mode 100644
index 0000000000..88e7d18646
--- /dev/null
+++ b/.changeset/wild-ravens-laugh.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-org': patch
+---
+
+Added support for scrolling to OwnershipCard component
diff --git a/plugins/org/report.api.md b/plugins/org/report.api.md
index 7d58d96263..a52e4160d3 100644
--- a/plugins/org/report.api.md
+++ b/plugins/org/report.api.md
@@ -40,6 +40,7 @@ export const EntityOwnershipCard: (props: {
relationsType?: EntityRelationAggregation;
relationAggregation?: EntityRelationAggregation;
entityLimit?: number;
+ scrollHeight?: string;
}) => JSX_2.Element;
// @public (undocumented)
@@ -101,6 +102,7 @@ export const OwnershipCard: (props: {
relationsType?: EntityRelationAggregation;
relationAggregation?: EntityRelationAggregation;
entityLimit?: number;
+ scrollHeight?: string;
}) => JSX_2.Element;
// @public (undocumented)
diff --git a/plugins/org/src/components/Cards/OwnershipCard/ComponentsGrid.tsx b/plugins/org/src/components/Cards/OwnershipCard/ComponentsGrid.tsx
index 0c177f31a8..5ba91ab601 100644
--- a/plugins/org/src/components/Cards/OwnershipCard/ComponentsGrid.tsx
+++ b/plugins/org/src/components/Cards/OwnershipCard/ComponentsGrid.tsx
@@ -124,7 +124,7 @@ export const ComponentsGrid = ({
relationsType,
relationAggregation,
entityFilterKind,
- entityLimit = 6,
+ entityLimit,
}: {
className?: string;
entity: Entity;
diff --git a/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx b/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
index cf34800bf4..eac411a805 100644
--- a/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
+++ b/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
@@ -28,6 +28,7 @@ import { ComponentsGrid } from './ComponentsGrid';
import { EntityRelationAggregation } from '../types';
import { useTranslationRef } from '@backstage/frontend-plugin-api';
import { orgTranslationRef } from '../../../translation';
+import Box from '@material-ui/core/Box';
/** @public */
export type OwnershipCardClassKey =
@@ -73,6 +74,11 @@ const useStyles = makeStyles(
overflowY: 'auto',
marginTop: 0,
},
+ box: {
+ overflowY: 'auto',
+ padding: theme.spacing(0, 1, 1),
+ margin: theme.spacing(0, -1),
+ },
}),
{
name: 'PluginOrgOwnershipCard',
@@ -88,16 +94,20 @@ export const OwnershipCard = (props: {
relationsType?: EntityRelationAggregation;
relationAggregation?: EntityRelationAggregation;
entityLimit?: number;
+ scrollHeight?: string;
}) => {
const {
variant,
entityFilterKind,
hideRelationsToggle,
- entityLimit = 6,
+ entityLimit,
+ scrollHeight: propScrollHeight = '292px',
} = props;
const relationAggregation = props.relationAggregation ?? props.relationsType;
const relationsToggle =
hideRelationsToggle === undefined ? false : hideRelationsToggle;
+ const scrollHeight =
+ entityLimit || variant === 'fullHeight' ? 'none' : propScrollHeight;
const classes = useStyles();
const { entity } = useEntity();
const { t } = useTranslationRef(orgTranslationRef);
@@ -165,13 +175,15 @@ export const OwnershipCard = (props: {
)}
-
+
+
+
);
};
diff --git a/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.ts b/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.ts
index a5a5363192..98e319a4c3 100644
--- a/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.ts
+++ b/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.ts
@@ -184,7 +184,7 @@ export function useGetEntities(
entity: Entity,
relationAggregation: EntityRelationAggregation,
entityFilterKind?: string[],
- entityLimit = 6,
+ entityLimit?: number,
): {
componentsWithCounters:
| {