diff --git a/.changeset/lucky-adults-talk.md b/.changeset/lucky-adults-talk.md new file mode 100644 index 0000000000..66e30af2dc --- /dev/null +++ b/.changeset/lucky-adults-talk.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog': patch +--- + +Added Kind field to the About Card. Tags moved before Type and Lifecycle, Kind placed after them. A new `aboutCard.kindField.label` translation key was added. diff --git a/plugins/catalog/report-alpha.api.md b/plugins/catalog/report-alpha.api.md index d41cff916f..b535c9bd81 100644 --- a/plugins/catalog/report-alpha.api.md +++ b/plugins/catalog/report-alpha.api.md @@ -67,6 +67,7 @@ export const catalogTranslationRef: TranslationRef< readonly 'aboutCard.systemField.label': 'System'; readonly 'aboutCard.parentComponentField.value': 'No Parent Component'; readonly 'aboutCard.parentComponentField.label': 'Parent Component'; + readonly 'aboutCard.kindField.label': 'Kind'; readonly 'aboutCard.typeField.label': 'Type'; readonly 'aboutCard.lifecycleField.label': 'Lifecycle'; readonly 'aboutCard.tagsField.value': 'No Tags'; diff --git a/plugins/catalog/report.api.md b/plugins/catalog/report.api.md index 84d9a8bd91..3c88849706 100644 --- a/plugins/catalog/report.api.md +++ b/plugins/catalog/report.api.md @@ -251,6 +251,7 @@ export const catalogTranslationRef: TranslationRef< readonly 'aboutCard.systemField.label': 'System'; readonly 'aboutCard.parentComponentField.value': 'No Parent Component'; readonly 'aboutCard.parentComponentField.label': 'Parent Component'; + readonly 'aboutCard.kindField.label': 'Kind'; readonly 'aboutCard.typeField.label': 'Type'; readonly 'aboutCard.lifecycleField.label': 'Lifecycle'; readonly 'aboutCard.tagsField.value': 'No Tags'; diff --git a/plugins/catalog/src/alpha/translation.ts b/plugins/catalog/src/alpha/translation.ts index 19738844e4..ef35cece84 100644 --- a/plugins/catalog/src/alpha/translation.ts +++ b/plugins/catalog/src/alpha/translation.ts @@ -61,6 +61,9 @@ export const catalogTranslationRef = createTranslationRef({ label: 'Parent Component', value: 'No Parent Component', }, + kindField: { + label: 'Kind', + }, typeField: { label: 'Type', }, diff --git a/plugins/catalog/src/components/AboutCard/AboutContent.test.tsx b/plugins/catalog/src/components/AboutCard/AboutContent.test.tsx index d91d5e96d9..4f6d12cbc1 100644 --- a/plugins/catalog/src/components/AboutCard/AboutContent.test.tsx +++ b/plugins/catalog/src/components/AboutCard/AboutContent.test.tsx @@ -83,6 +83,8 @@ describe('', () => { expect(screen.getByText('Type').nextSibling).toHaveTextContent('t'); expect(screen.getByText('Lifecycle')).toBeInTheDocument(); expect(screen.getByText('Lifecycle').nextSibling).toHaveTextContent('l'); + expect(screen.getByText('Kind')).toBeInTheDocument(); + expect(screen.getByText('Kind').nextSibling).toHaveTextContent('Unknown'); expect(screen.getByText('Tags')).toBeInTheDocument(); expect(screen.getByText('Tags').nextSibling).toHaveTextContent('tag-1'); }); @@ -111,6 +113,7 @@ describe('', () => { expect(screen.queryByText('Parent Component')).not.toBeInTheDocument(); expect(screen.queryByText('Type')).not.toBeInTheDocument(); expect(screen.queryByText('Lifecycle')).not.toBeInTheDocument(); + expect(screen.getByText('Kind')).toBeInTheDocument(); }); }); @@ -362,7 +365,9 @@ describe('', () => { expect(screen.getByText('Owner').nextSibling).toHaveTextContent( 'user:guest', ); - expect(screen.queryByText('Domain')).not.toBeInTheDocument(); + expect( + screen.queryByRole('heading', { name: 'Domain' }), + ).not.toBeInTheDocument(); expect(screen.queryByText('System')).not.toBeInTheDocument(); expect(screen.queryByText('Parent Component')).not.toBeInTheDocument(); expect(screen.queryByText('Type')).not.toBeInTheDocument(); @@ -389,7 +394,9 @@ describe('', () => { expect(screen.getByText('Owner').nextSibling).toHaveTextContent( 'No Owner', ); - expect(screen.queryByText('Domain')).not.toBeInTheDocument(); + expect( + screen.queryByRole('heading', { name: 'Domain' }), + ).not.toBeInTheDocument(); expect(screen.queryByText('System')).not.toBeInTheDocument(); expect(screen.queryByText('Parent Component')).not.toBeInTheDocument(); expect(screen.queryByText('Type')).not.toBeInTheDocument(); @@ -617,7 +624,9 @@ describe('', () => { expect(screen.getByText('Domain').nextSibling).toHaveTextContent( 'domain', ); - expect(screen.queryByText('System')).not.toBeInTheDocument(); + expect( + screen.queryByRole('heading', { name: 'System' }), + ).not.toBeInTheDocument(); expect(screen.queryByText('Parent Component')).not.toBeInTheDocument(); expect(screen.queryByText('Type')).not.toBeInTheDocument(); expect(screen.queryByText('Lifecycle')).not.toBeInTheDocument(); @@ -648,7 +657,9 @@ describe('', () => { expect(screen.getByText('Domain').nextSibling).toHaveTextContent( 'No Domain', ); - expect(screen.queryByText('System')).not.toBeInTheDocument(); + expect( + screen.queryByRole('heading', { name: 'System' }), + ).not.toBeInTheDocument(); expect(screen.queryByText('Parent Component')).not.toBeInTheDocument(); expect(screen.queryByText('Type')).not.toBeInTheDocument(); expect(screen.queryByText('Lifecycle')).not.toBeInTheDocument(); diff --git a/plugins/catalog/src/components/AboutCard/AboutContent.tsx b/plugins/catalog/src/components/AboutCard/AboutContent.tsx index eff9ae7da3..18d17d06da 100644 --- a/plugins/catalog/src/components/AboutCard/AboutContent.tsx +++ b/plugins/catalog/src/components/AboutCard/AboutContent.tsx @@ -178,6 +178,15 @@ export function AboutContent(props: AboutContentProps) { /> )} + + {(entity?.metadata?.tags || []).map(tag => ( + + ))} + + {(isAPI || isComponent || isResource || @@ -198,14 +207,6 @@ export function AboutContent(props: AboutContentProps) { value={entity?.spec?.lifecycle as string} /> )} - - {(entity?.metadata?.tags || []).map(tag => ( - - ))} - {isLocation && (entity?.spec?.targets || entity?.spec?.target) && (