diff --git a/plugins/scaffolder-react/src/next/components/ReviewState/ReviewState.test.tsx b/plugins/scaffolder-react/src/next/components/ReviewState/ReviewState.test.tsx
index b5f2afc74d..8c4cdcf6e7 100644
--- a/plugins/scaffolder-react/src/next/components/ReviewState/ReviewState.test.tsx
+++ b/plugins/scaffolder-react/src/next/components/ReviewState/ReviewState.test.tsx
@@ -466,6 +466,7 @@ describe('ReviewState', () => {
it('should allow custom review name', async () => {
const formState = {
foo: 'test',
+ providedAPIs: 'api1,api2',
};
const schemas: ParsedTemplateSchema[] = [
@@ -477,7 +478,15 @@ describe('ReviewState', () => {
type: 'string',
'ui:backstage': {
review: {
- name: 'bar',
+ name: 'Bar',
+ },
+ },
+ },
+ providedAPIs: {
+ type: 'string',
+ 'ui:backstage': {
+ review: {
+ name: 'Provided APIs',
},
},
},
@@ -495,6 +504,9 @@ describe('ReviewState', () => {
expect(queryByRole('row', { name: 'Bar test' })).toBeInTheDocument();
expect(queryByRole('row', { name: 'Foo test' })).not.toBeInTheDocument();
+ expect(
+ queryByRole('row', { name: 'Provided APIs api1,api2' }),
+ ).toBeInTheDocument();
});
it('should handle options in multiple schemas', async () => {
diff --git a/plugins/scaffolder-react/src/next/components/ReviewState/ReviewState.tsx b/plugins/scaffolder-react/src/next/components/ReviewState/ReviewState.tsx
index b5b72dcc98..2588d25cab 100644
--- a/plugins/scaffolder-react/src/next/components/ReviewState/ReviewState.tsx
+++ b/plugins/scaffolder-react/src/next/components/ReviewState/ReviewState.tsx
@@ -43,7 +43,7 @@ function processSchema(
const name =
definitionInSchema?.['ui:backstage']?.review?.name ??
definitionInSchema?.title ??
- key;
+ formatKey(key);
if (definitionInSchema) {
const backstageReviewOptions = definitionInSchema['ui:backstage']?.review;
@@ -96,12 +96,14 @@ export const ReviewState = (props: ReviewStateProps) => {
const schema = findSchemaForKey(key, props.schemas, props.formState);
return schema
? processSchema(key, value, schema, props.formState)
- : [[key, value]];
+ : [[formatKey(key), value]];
})
.filter(prop => prop.length > 0),
);
- const options = {
- titleFormat: formatKey,
- };
- return ;
+ return (
+ key }}
+ />
+ );
};