diff --git a/.changeset/pretty-needles-peel.md b/.changeset/pretty-needles-peel.md new file mode 100644 index 0000000000..4e77ef7cd3 --- /dev/null +++ b/.changeset/pretty-needles-peel.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-explore': patch +--- + +Using displayName as default value when loading Groups Diagram diff --git a/plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.test.tsx b/plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.test.tsx index 5044b09f83..3b9b523b02 100644 --- a/plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.test.tsx +++ b/plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.test.tsx @@ -46,6 +46,9 @@ describe('', () => { namespace: 'my-namespace', }, spec: { + profile: { + displayName: 'Group A', + }, type: 'organization', }, }, @@ -64,6 +67,6 @@ describe('', () => { }, ); - expect(getByText('my-namespace/group-a')).toBeInTheDocument(); + expect(getByText('Group A')).toBeInTheDocument(); }); }); diff --git a/plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.tsx b/plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.tsx index 53e55b96bf..ce09f0d268 100644 --- a/plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.tsx +++ b/plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.tsx @@ -18,6 +18,7 @@ import { RELATION_CHILD_OF, stringifyEntityRef, parseEntityRef, + GroupEntity, } from '@backstage/catalog-model'; import { catalogApiRef, @@ -107,7 +108,11 @@ function RenderNode(props: DependencyGraphTypes.RenderNodeProps) { * Dynamically generates a diagram of groups registered in the catalog. */ export function GroupsDiagram() { - const nodes = new Array<{ id: string; kind: string; name: string }>(); + const nodes = new Array<{ + id: string; + kind: string; + name: string; + }>(); const edges = new Array<{ from: string; to: string; label: string }>(); const configApi = useApi(configApiRef); @@ -141,7 +146,9 @@ export function GroupsDiagram() { nodes.push({ id: stringifyEntityRef(catalogItem), kind: catalogItem.kind, - name: formatEntityRefTitle(catalogItem, { defaultKind: 'Group' }), + name: + (catalogItem as GroupEntity).spec?.profile?.displayName || + formatEntityRefTitle(catalogItem, { defaultKind: 'Group' }), }); // Edge to parent