diff --git a/.changeset/green-ducks-tan.md b/.changeset/green-ducks-tan.md new file mode 100644 index 0000000000..e096bfeb36 --- /dev/null +++ b/.changeset/green-ducks-tan.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-scaffolder': patch +--- + +Added UI Schema support for array items for example, support EntityPicker within an array field diff --git a/plugins/scaffolder/src/components/MultistepJsonForm/schema.test.ts b/plugins/scaffolder/src/components/MultistepJsonForm/schema.test.ts index b51d01f719..ef6b582021 100644 --- a/plugins/scaffolder/src/components/MultistepJsonForm/schema.test.ts +++ b/plugins/scaffolder/src/components/MultistepJsonForm/schema.test.ts @@ -346,4 +346,68 @@ describe('transformSchemaToProps', () => { uiSchema: expectedUiSchema, }); }); + + it('transforms schema with array items', () => { + const inputSchema = { + type: 'object', + properties: { + person: { + type: 'array', + items: { + type: 'object', + properties: { + name: { + type: 'string', + }, + address: { + type: 'string', + 'ui:widget': 'textarea', + }, + }, + }, + }, + accountNumber: { + type: 'number', + }, + }, + }; + const expectedSchema = { + type: 'object', + properties: { + person: { + type: 'array', + items: { + type: 'object', + properties: { + name: { + type: 'string', + }, + address: { + type: 'string', + }, + }, + }, + }, + accountNumber: { + type: 'number', + }, + }, + }; + const expectedUiSchema = { + accountNumber: {}, + person: { + items: { + name: {}, + address: { + 'ui:widget': 'textarea', + }, + }, + }, + }; + + expect(transformSchemaToProps(inputSchema)).toEqual({ + schema: expectedSchema, + uiSchema: expectedUiSchema, + }); + }); }); diff --git a/plugins/scaffolder/src/components/MultistepJsonForm/schema.ts b/plugins/scaffolder/src/components/MultistepJsonForm/schema.ts index 2dc2ad7069..dd86784275 100644 --- a/plugins/scaffolder/src/components/MultistepJsonForm/schema.ts +++ b/plugins/scaffolder/src/components/MultistepJsonForm/schema.ts @@ -26,7 +26,7 @@ function extractUiSchema(schema: JsonObject, uiSchema: JsonObject) { return; } - const { properties, anyOf, oneOf, allOf, dependencies } = schema; + const { properties, items, anyOf, oneOf, allOf, dependencies } = schema; for (const propName in schema) { if (!schema.hasOwnProperty(propName)) { @@ -55,6 +55,12 @@ function extractUiSchema(schema: JsonObject, uiSchema: JsonObject) { } } + if (isObject(items)) { + const innerUiSchema = {}; + uiSchema.items = innerUiSchema; + extractUiSchema(items, innerUiSchema); + } + if (Array.isArray(anyOf)) { for (const schemaNode of anyOf) { if (!isObject(schemaNode)) {