From 941d45784c78865c9533695fe40381ab05300792 Mon Sep 17 00:00:00 2001 From: Sandrina Pereira Date: Tue, 20 Jun 2023 16:14:53 +0100 Subject: [PATCH 1/3] chore: Remove JSONSchemaBuilder in radio examples --- src/tests/helpers.js | 41 +++++++++++++++++++++-------------------- 1 file changed, 21 insertions(+), 20 deletions(-) diff --git a/src/tests/helpers.js b/src/tests/helpers.js index 46002ba44..5d5793ac0 100644 --- a/src/tests/helpers.js +++ b/src/tests/helpers.js @@ -871,34 +871,35 @@ export const schemaInputDeprecated = JSONSchemaBuilder() .build(); /** @deprecated */ -export const schemaInputTypeRadioDeprecated = JSONSchemaBuilder() - .addInput({ +export const schemaInputTypeRadioDeprecated = { + properties: { has_siblings: mockRadioInputDeprecated, - }) - .setRequiredFields(['has_siblings']) - .build(); -export const schemaInputTypeRadio = JSONSchemaBuilder() - .addInput({ + }, + required: ['has_siblings'], +}; + +export const schemaInputTypeRadio = { + properties: { has_siblings: mockRadioInput, - }) - .setRequiredFields(['has_siblings']) - .build(); + }, + required: ['has_siblings'], +}; -export const schemaInputTypeRadioRequiredAndOptional = JSONSchemaBuilder() - .addInput({ +export const schemaInputTypeRadioRequiredAndOptional = { + properties: { has_siblings: mockRadioInput, has_car: mockRadioInputOptional, - }) - .setRequiredFields(['has_siblings']) - .build(); + }, + required: ['has_siblings'], +}; -export const schemaInputTypeRadioCard = JSONSchemaBuilder() - .addInput({ +export const schemaInputTypeRadioCard = { + properties: { experience_level: mockRadioCardExpandableInput, payment_method: mockRadioCardInput, - }) - .setRequiredFields(['experience_level']) - .build(); + }, + required: ['experience_level'], +}; /** @deprecated */ export const schemaInputTypeSelectSoloDeprecated = JSONSchemaBuilder() From 52145189095ca9e62e72406aa387f110a45b5f11 Mon Sep 17 00:00:00 2001 From: Sandrina Pereira Date: Tue, 20 Jun 2023 16:19:20 +0100 Subject: [PATCH 2/3] feat(Radio/Select): Spread x-jsf-presentation value to option root --- src/helpers.js | 17 ++++++++++- src/tests/createHeadlessForm.test.js | 38 +++++++++++++++++++++++ src/tests/helpers.js | 45 ++++++++++++++++++++++++++++ 3 files changed, 99 insertions(+), 1 deletion(-) diff --git a/src/helpers.js b/src/helpers.js index e37b7e9dd..1af398ac9 100644 --- a/src/helpers.js +++ b/src/helpers.js @@ -406,12 +406,27 @@ export function updateFieldsProperties(fields, formValues, jsonSchema) { const notNullOption = (opt) => opt.const !== null; +function flatPresentation(item) { + return Object.entries(item).reduce((newItem, [key, value]) => { + if (key === 'x-jsf-presentation') { + return { + ...newItem, + ...value, + }; + } + return { + ...newItem, + [key]: value, + }; + }, {}); +} + function getFieldOptions(node, presentation) { function convertToOptions(nodeOptions) { return nodeOptions.filter(notNullOption).map(({ title, const: cons, ...item }) => ({ label: title, value: cons, - ...item, + ...flatPresentation(item), })); } diff --git a/src/tests/createHeadlessForm.test.js b/src/tests/createHeadlessForm.test.js index 3dbcb015b..f42a9cca1 100644 --- a/src/tests/createHeadlessForm.test.js +++ b/src/tests/createHeadlessForm.test.js @@ -10,6 +10,7 @@ import { schemaInputTypeRadioDeprecated, schemaInputTypeRadio, schemaInputTypeRadioRequiredAndOptional, + schemaInputTypeRadioOptionsWithDetails, schemaInputTypeSelectSoloDeprecated, schemaInputTypeSelectSolo, schemaInputTypeSelectMultipleDeprecated, @@ -753,6 +754,43 @@ describe('createHeadlessForm', () => { expect(() => fieldValidator.validateSync('')).toThrowError('Required field'); }); + it('support "radio" field type with extra info inside each option', () => { + const result = createHeadlessForm(schemaInputTypeRadioOptionsWithDetails); + + expect(result.fields).toHaveLength(1); + + const fieldOptions = result.fields[0].options; + + // The x-jsf-presentation value was spread to the root: + expect(fieldOptions[0]).not.toHaveProperty('x-jsf-presentation'); + expect(fieldOptions).toEqual([ + { + label: 'Basic', + value: 'basic', + carrierName: 'Segure Inc', + displayCost: '$30.00/mo', + urlDetails: 'www.example-bsc.com', + // Other x-* keywords are kept as it is. + 'x-another': 'extra-thing', + }, + { + label: 'Standard', + value: 'standard', + carrierName: 'Vanilla Lda', + displayCost: '$50.00/mo', + urlDetails: 'www.example-std.com', + }, + { + label: 'Pro', + value: 'pro', + tierName: 'Pro', + carrierName: 'Satefy xtra', + displayCost: '$100.00/mo + variable costs', + urlDetails: 'www.example-pro.com', + }, + ]); + }); + it('support "number" field type', () => { const result = createHeadlessForm(schemaInputTypeNumber); expect(result).toMatchObject({ diff --git a/src/tests/helpers.js b/src/tests/helpers.js index 5d5793ac0..19c5ece08 100644 --- a/src/tests/helpers.js +++ b/src/tests/helpers.js @@ -901,6 +901,51 @@ export const schemaInputTypeRadioCard = { required: ['experience_level'], }; +export const schemaInputTypeRadioOptionsWithDetails = { + properties: { + health_perks: { + title: 'Health perks', + description: + 'This example contains options with more custom details, under the x-jsf-presentation key', + oneOf: [ + { + const: 'basic', + title: 'Basic', + 'x-jsf-presentation': { + carrierName: 'Segure Inc', + displayCost: '$30.00/mo', + urlDetails: 'www.example-bsc.com', + }, + 'x-another': 'extra-thing', + }, + { + const: 'standard', + title: 'Standard', + 'x-jsf-presentation': { + carrierName: 'Vanilla Lda', + displayCost: '$50.00/mo', + urlDetails: 'www.example-std.com', + }, + }, + { + const: 'pro', + title: 'Pro', + 'x-jsf-presentation': { + tierName: 'Pro', + carrierName: 'Satefy xtra', + displayCost: '$100.00/mo + variable costs', + urlDetails: 'www.example-pro.com', + }, + }, + ], + 'x-jsf-presentation': { + inputType: 'radio', + }, + type: 'string', + }, + }, +}; + /** @deprecated */ export const schemaInputTypeSelectSoloDeprecated = JSONSchemaBuilder() .addInput({ From 07bf3490410fae6d0aef92d482e9d43fe3aaa19d Mon Sep 17 00:00:00 2001 From: Sandrina Pereira Date: Thu, 22 Jun 2023 10:38:40 +0100 Subject: [PATCH 3/3] Update tests to be similar to internal usage --- src/tests/createHeadlessForm.test.js | 22 +++++++--------------- src/tests/helpers.js | 22 ++++++---------------- 2 files changed, 13 insertions(+), 31 deletions(-) diff --git a/src/tests/createHeadlessForm.test.js b/src/tests/createHeadlessForm.test.js index f42a9cca1..88a8bcb8b 100644 --- a/src/tests/createHeadlessForm.test.js +++ b/src/tests/createHeadlessForm.test.js @@ -761,32 +761,24 @@ describe('createHeadlessForm', () => { const fieldOptions = result.fields[0].options; - // The x-jsf-presentation value was spread to the root: + // The x-jsf-presentation content was spread to the root: expect(fieldOptions[0]).not.toHaveProperty('x-jsf-presentation'); expect(fieldOptions).toEqual([ { label: 'Basic', value: 'basic', - carrierName: 'Segure Inc', - displayCost: '$30.00/mo', - urlDetails: 'www.example-bsc.com', + meta: { + displayCost: '$30.00/mo', + }, // Other x-* keywords are kept as it is. 'x-another': 'extra-thing', }, { label: 'Standard', value: 'standard', - carrierName: 'Vanilla Lda', - displayCost: '$50.00/mo', - urlDetails: 'www.example-std.com', - }, - { - label: 'Pro', - value: 'pro', - tierName: 'Pro', - carrierName: 'Satefy xtra', - displayCost: '$100.00/mo + variable costs', - urlDetails: 'www.example-pro.com', + meta: { + displayCost: '$50.00/mo', + }, }, ]); }); diff --git a/src/tests/helpers.js b/src/tests/helpers.js index 19c5ece08..e41129188 100644 --- a/src/tests/helpers.js +++ b/src/tests/helpers.js @@ -912,9 +912,9 @@ export const schemaInputTypeRadioOptionsWithDetails = { const: 'basic', title: 'Basic', 'x-jsf-presentation': { - carrierName: 'Segure Inc', - displayCost: '$30.00/mo', - urlDetails: 'www.example-bsc.com', + meta: { + displayCost: '$30.00/mo', + }, }, 'x-another': 'extra-thing', }, @@ -922,19 +922,9 @@ export const schemaInputTypeRadioOptionsWithDetails = { const: 'standard', title: 'Standard', 'x-jsf-presentation': { - carrierName: 'Vanilla Lda', - displayCost: '$50.00/mo', - urlDetails: 'www.example-std.com', - }, - }, - { - const: 'pro', - title: 'Pro', - 'x-jsf-presentation': { - tierName: 'Pro', - carrierName: 'Satefy xtra', - displayCost: '$100.00/mo + variable costs', - urlDetails: 'www.example-pro.com', + meta: { + displayCost: '$50.00/mo', + }, }, }, ],