paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 15 Packages Projects Releases Wiki Activity

Optionally hide OwnershipCard relation toggle

Browse Source 
Signed-off-by: Andre Wanlin <awanlin@rapidrtc.com>
This commit is contained in:
Andre Wanlin
2022-04-03 15:27:38 -05:00
parent 8b93d6d92c
commit cb592bfce7
4 changed files with 116 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/grumpy-parents-prove.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-org': patch
---
Provides the ability to hide the relations toggle as well as setting a default relation type
plugins/org/api-report.md
+4
View File
@@ -25,6 +25,8 @@ export const EntityMembersListCard: (props: {
export const EntityOwnershipCard: (props: {
variant?: InfoCardVariants | undefined;
entityFilterKind?: string[] | undefined;
hideRelationsToggle?: boolean | undefined;
relationsType?: string | undefined;
}) => JSX.Element;
// @public (undocumented)
@@ -64,6 +66,8 @@ export { orgPlugin as plugin };
export const OwnershipCard: (props: {
variant?: InfoCardVariants;
entityFilterKind?: string[];
hideRelationsToggle?: boolean;
relationsType?: string;
}) => JSX.Element;
// @public (undocumented)
plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.test.tsx
+70
View File
@@ -291,4 +291,74 @@ describe('OwnershipCard', () => {
'/create/?filters%5Bkind%5D=API&filters%5Btype%5D=openapi&filters%5Bowners%5D%5B0%5D=the-user&filters%5Bowners%5D%5B1%5D=my-team&filters%5Buser%5D=all',
);
});
describe('OwnershipCard relations', () => {
it('shows relations toggle', async () => {
const catalogApi: jest.Mocked<CatalogApi> = {
getEntities: jest.fn(),
} as any;
catalogApi.getEntities.mockImplementation(getEntitiesMock);
const { getByTitle } = await renderInTestApp(
<TestApiProvider apis={[[catalogApiRef, catalogApi]]}>
<EntityProvider entity={groupEntity}>
<OwnershipCard />
</EntityProvider>
</TestApiProvider>,
{
mountedRoutes: {
'/create': catalogIndexRouteRef,
},
},
);
expect(getByTitle('Direct Relations')).toBeInTheDocument();
});
it('hides relations toggle', async () => {
const catalogApi: jest.Mocked<CatalogApi> = {
getEntities: jest.fn(),
} as any;
catalogApi.getEntities.mockImplementation(getEntitiesMock);
const rendered = await renderInTestApp(
<TestApiProvider apis={[[catalogApiRef, catalogApi]]}>
<EntityProvider entity={groupEntity}>
<OwnershipCard hideRelationsToggle />
</EntityProvider>
</TestApiProvider>,
{
mountedRoutes: {
'/create': catalogIndexRouteRef,
},
},
);
expect(rendered.queryByText('Direct Relations')).toBeNull();
});
it('overrides relation type', async () => {
const catalogApi: jest.Mocked<CatalogApi> = {
getEntities: jest.fn(),
} as any;
catalogApi.getEntities.mockImplementation(getEntitiesMock);
const { getByTitle } = await renderInTestApp(
<TestApiProvider apis={[[catalogApiRef, catalogApi]]}>
<EntityProvider entity={groupEntity}>
<OwnershipCard relationsType="aggregated" />
</EntityProvider>
</TestApiProvider>,
{
mountedRoutes: {
'/create': catalogIndexRouteRef,
},
},
);
expect(getByTitle('Aggregated Relations')).toBeInTheDocument();
});
});
});
plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
+37 -27
View File
@@ -55,48 +55,58 @@ const useStyles = makeStyles(theme => ({
export const OwnershipCard = (props: {
variant?: InfoCardVariants;
entityFilterKind?: string[];
hideRelationsToggle?: boolean;
relationsType?: string;
}) => {
const { variant, entityFilterKind } = props;
const { variant, entityFilterKind, hideRelationsToggle, relationsType } =
props;
const relationsToggle =
hideRelationsToggle === undefined ? false : hideRelationsToggle;
const classes = useStyles();
const { entity } = useEntity();
const isGroup = entity.kind === 'Group';
const [relationsType, setRelationsType] = useState('direct');
const [getRelationsType, setRelationsType] = useState(
relationsType || 'direct',
);
return (
<InfoCard title="Ownership" variant={variant}>
<List dense>
<ListItem className={classes.list}>
<ListItemText className={classes.listItemText} />
<ListItemSecondaryAction className={classes.listItemSecondaryAction}>
Direct Relations
<Tooltip
placement="top"
arrow
title={`${
relationsType === 'direct' ? 'Direct' : 'Aggregated'
} Relations`}
{!relationsToggle && (
<ListItemSecondaryAction
className={classes.listItemSecondaryAction}
>
<Switch
color="primary"
checked={relationsType !== 'direct'}
onChange={() =>
relationsType === 'direct'
? setRelationsType('aggregated')
: setRelationsType('direct')
}
name="pin"
inputProps={{ 'aria-label': 'Ownership Type Switch' }}
disabled={!isGroup}
/>
</Tooltip>
Aggregated Relations
</ListItemSecondaryAction>
Direct Relations
<Tooltip
placement="top"
arrow
title={`${
getRelationsType === 'direct' ? 'Direct' : 'Aggregated'
} Relations`}
>
<Switch
color="primary"
checked={getRelationsType !== 'direct'}
onChange={() =>
getRelationsType === 'direct'
? setRelationsType('aggregated')
: setRelationsType('direct')
}
name="pin"
inputProps={{ 'aria-label': 'Ownership Type Switch' }}
disabled={!isGroup}
/>
</Tooltip>
Aggregated Relations
</ListItemSecondaryAction>
)}
</ListItem>
</List>
<ComponentsGrid
entity={entity}
relationsType={relationsType}
relationsType={getRelationsType}
isGroup={isGroup}
entityFilterKind={entityFilterKind}
/>