diff --git a/.changeset/brown-cycles-beg.md b/.changeset/brown-cycles-beg.md
index 78e6e3e73f..98df27a00f 100644
--- a/.changeset/brown-cycles-beg.md
+++ b/.changeset/brown-cycles-beg.md
@@ -2,4 +2,4 @@
'@backstage/plugin-scaffolder-react': patch
---
-Adds an option to hide text output buttons
+Hide text output button if only one is present
diff --git a/plugins/scaffolder-backend/sample-templates/notifications-demo/template.yaml b/plugins/scaffolder-backend/sample-templates/notifications-demo/template.yaml
index a85f53b12f..9d5224ccb4 100644
--- a/plugins/scaffolder-backend/sample-templates/notifications-demo/template.yaml
+++ b/plugins/scaffolder-backend/sample-templates/notifications-demo/template.yaml
@@ -67,3 +67,12 @@ spec:
link: ${{ parameters.link }}
severity: ${{ parameters.severity }}
scope: ${{ parameters.scope }}
+
+ output:
+ text:
+ - title: Your next steps
+ showButton: false
+ content: >
+ # Success!
+
+ Text
diff --git a/plugins/scaffolder-react/src/api/types.ts b/plugins/scaffolder-react/src/api/types.ts
index 6284e8dcaa..8e4d989a55 100644
--- a/plugins/scaffolder-react/src/api/types.ts
+++ b/plugins/scaffolder-react/src/api/types.ts
@@ -89,7 +89,6 @@ export type ScaffolderOutputText = {
title?: string;
icon?: string;
content?: string;
- showButton?: boolean;
default?: boolean;
};
diff --git a/plugins/scaffolder-react/src/next/components/TemplateOutputs/DefaultTemplateOutputs.test.tsx b/plugins/scaffolder-react/src/next/components/TemplateOutputs/DefaultTemplateOutputs.test.tsx
index d0849f6027..cea00b15b2 100644
--- a/plugins/scaffolder-react/src/next/components/TemplateOutputs/DefaultTemplateOutputs.test.tsx
+++ b/plugins/scaffolder-react/src/next/components/TemplateOutputs/DefaultTemplateOutputs.test.tsx
@@ -78,11 +78,11 @@ describe('', () => {
expect(queryByTestId('output-box')).toBeNull();
expect(queryByTestId('text-output-box')).toBeNull();
});
- it('should not render the link output box when output only contains text with showButton set to false', async () => {
+ it('should not render anything when only a single text output is defined', async () => {
+ // This is the default case when no output field is present in the template
const output = {
text: [
{ title: 'Text 1', content: 'Hello, **world**!', showButton: false },
- { title: 'Text 2', content: 'Hello, **mars**!', showButton: false },
],
};
const { queryByTestId } = await renderInTestApp(
@@ -94,6 +94,25 @@ describe('', () => {
},
);
+ // Ensure that nothing renders from this component
expect(queryByTestId('output-box')).toBeNull();
});
+ it('should not render text output buttons if there is only one output', async () => {
+ const output = {
+ links: [{ title: 'Link 1', url: 'https://backstage.io/' }],
+ text: [
+ { title: 'Text 1', content: 'Hello, **world**!', showButton: false },
+ ],
+ };
+ const { queryByTestId } = await renderInTestApp(
+ ,
+ {
+ mountedRoutes: {
+ '/catalog/:namespace/:kind/:name': entityRouteRef,
+ },
+ },
+ );
+
+ expect(queryByTestId('text-outputs')).toBeNull();
+ });
});
diff --git a/plugins/scaffolder-react/src/next/components/TemplateOutputs/DefaultTemplateOutputs.tsx b/plugins/scaffolder-react/src/next/components/TemplateOutputs/DefaultTemplateOutputs.tsx
index 9788d194ae..40abad376b 100644
--- a/plugins/scaffolder-react/src/next/components/TemplateOutputs/DefaultTemplateOutputs.tsx
+++ b/plugins/scaffolder-react/src/next/components/TemplateOutputs/DefaultTemplateOutputs.tsx
@@ -56,9 +56,8 @@ export const DefaultTemplateOutputs = (props: {
return null;
}
- const emptyOutput =
- (output.links || []).length === 0 &&
- Object.values(output.text || {}).filter(o => o.showButton).length === 0;
+ const displayTextButtons = (output.text || []).length > 1;
+ const emptyOutput = (output.links || []).length === 0 && !displayTextButtons;
return (
<>
@@ -72,11 +71,14 @@ export const DefaultTemplateOutputs = (props: {
gridGap={16}
flexWrap="wrap"
>
-
+ {displayTextButtons && (
+
+ )}
diff --git a/plugins/scaffolder-react/src/next/components/TemplateOutputs/TextOutputs.tsx b/plugins/scaffolder-react/src/next/components/TemplateOutputs/TextOutputs.tsx
index 373db4d632..5da1dab476 100644
--- a/plugins/scaffolder-react/src/next/components/TemplateOutputs/TextOutputs.tsx
+++ b/plugins/scaffolder-react/src/next/components/TemplateOutputs/TextOutputs.tsx
@@ -39,25 +39,23 @@ export const TextOutputs = (props: {
<>
{text
.filter(({ content }) => content !== undefined)
- .map(({ title, icon, showButton = true }, i) => {
+ .map(({ title, icon }, i) => {
const Icon = iconResolver(icon);
return (
- showButton && (
- }
- component="div"
- color="primary"
- onClick={() => {
- if (index !== i) {
- setIndex?.(i);
- }
- }}
- variant={index === i ? 'outlined' : undefined}
- >
- {title}
-
- )
+ }
+ component="div"
+ color="primary"
+ onClick={() => {
+ if (index !== i) {
+ setIndex?.(i);
+ }
+ }}
+ variant={index === i ? 'outlined' : undefined}
+ >
+ {title}
+
);
})}
>