diff --git a/assets/js/src/form_editor/blocks/custom_checkbox/custom_checkbox.jsx b/assets/js/src/form_editor/blocks/custom_checkbox/custom_checkbox.jsx index 9448b7e318..5fdab7b929 100644 --- a/assets/js/src/form_editor/blocks/custom_checkbox/custom_checkbox.jsx +++ b/assets/js/src/form_editor/blocks/custom_checkbox/custom_checkbox.jsx @@ -24,7 +24,7 @@ export function getSettings(customField) { }, mandatory: { type: 'boolean', - default: false, + default: customField.params.required ? !!customField.params.required : false, }, customFieldId: { type: 'string', diff --git a/assets/js/src/form_editor/blocks/custom_date/custom_date.jsx b/assets/js/src/form_editor/blocks/custom_date/custom_date.jsx index d308305a66..2890de6826 100644 --- a/assets/js/src/form_editor/blocks/custom_date/custom_date.jsx +++ b/assets/js/src/form_editor/blocks/custom_date/custom_date.jsx @@ -16,7 +16,7 @@ export function getSettings(customField) { }, mandatory: { type: 'boolean', - default: false, + default: customField.params.required ? !!customField.params.required : false, }, defaultToday: { type: 'boolean', diff --git a/assets/js/src/form_editor/blocks/custom_radio/custom_radio.jsx b/assets/js/src/form_editor/blocks/custom_radio/custom_radio.jsx index 8e6c7f95f2..2c08dcbf37 100644 --- a/assets/js/src/form_editor/blocks/custom_radio/custom_radio.jsx +++ b/assets/js/src/form_editor/blocks/custom_radio/custom_radio.jsx @@ -1,5 +1,6 @@ import Icon from '../custom_text/icon.jsx'; import Edit from './edit.jsx'; +import { customFieldValuesToBlockValues } from '../../store/form_body_to_blocks.jsx'; export const name = 'mailpoet-form/custom-radio'; @@ -20,11 +21,12 @@ export function getSettings(customField) { }, mandatory: { type: 'boolean', - default: false, + default: customField.params.required ? !!customField.params.required : false, }, values: { type: 'array', - default: [], + default: customField.params.values + ? customFieldValuesToBlockValues(customField.params.values) : [], }, customFieldId: { type: 'string', diff --git a/assets/js/src/form_editor/blocks/custom_select/custom_select.jsx b/assets/js/src/form_editor/blocks/custom_select/custom_select.jsx index 7e9a666982..3a4d584507 100644 --- a/assets/js/src/form_editor/blocks/custom_select/custom_select.jsx +++ b/assets/js/src/form_editor/blocks/custom_select/custom_select.jsx @@ -1,5 +1,6 @@ import Icon from '../custom_text/icon.jsx'; import Edit from './edit.jsx'; +import { customFieldValuesToBlockValues } from '../../store/form_body_to_blocks.jsx'; export const name = 'mailpoet-form/custom-select'; @@ -20,11 +21,12 @@ export function getSettings(customField) { }, mandatory: { type: 'boolean', - default: false, + default: customField.params.required ? !!customField.params.required : false, }, values: { type: 'array', - default: [], + default: customField.params.values + ? customFieldValuesToBlockValues(customField.params.values) : [], }, customFieldId: { type: 'string', diff --git a/assets/js/src/form_editor/blocks/custom_text/custom_text.jsx b/assets/js/src/form_editor/blocks/custom_text/custom_text.jsx index a0fd591073..e81f2da386 100644 --- a/assets/js/src/form_editor/blocks/custom_text/custom_text.jsx +++ b/assets/js/src/form_editor/blocks/custom_text/custom_text.jsx @@ -20,11 +20,11 @@ export function getSettings(customField) { }, mandatory: { type: 'boolean', - default: false, + default: customField.params.required ? !!customField.params.required : false, }, validate: { type: 'string', - default: '', + default: customField.params.validate ? customField.params.validate : '', }, customFieldId: { type: 'string', diff --git a/assets/js/src/form_editor/blocks/custom_textarea/custom_textarea.jsx b/assets/js/src/form_editor/blocks/custom_textarea/custom_textarea.jsx index 172db33568..0218185dc9 100644 --- a/assets/js/src/form_editor/blocks/custom_textarea/custom_textarea.jsx +++ b/assets/js/src/form_editor/blocks/custom_textarea/custom_textarea.jsx @@ -20,11 +20,11 @@ export function getSettings(customField) { }, mandatory: { type: 'boolean', - default: false, + default: customField.params.required ? !!customField.params.required : false, }, validate: { type: 'string', - default: '', + default: customField.params.validate ? customField.params.validate : '', }, lines: { type: 'string', diff --git a/assets/js/src/form_editor/store/form_body_to_blocks.jsx b/assets/js/src/form_editor/store/form_body_to_blocks.jsx index 318200f5a2..68f0026a48 100644 --- a/assets/js/src/form_editor/store/form_body_to_blocks.jsx +++ b/assets/js/src/form_editor/store/form_body_to_blocks.jsx @@ -1,6 +1,17 @@ import { has } from 'lodash'; import formatCustomFieldBlockName from '../blocks/format_custom_field_block_name.jsx'; +export const customFieldValuesToBlockValues = (values) => values.map((value) => { + const mappedValue = { + name: value.value, + id: `${Math.random().toString()}-${Date.now()}`, + }; + if (has(value, 'is_checked') && value.is_checked) { + mappedValue.isChecked = true; + } + return mappedValue; +}); + const mapCustomField = (item, customFields, mappedCommonProperties) => { const customField = customFields.find((cf) => cf.id === parseInt(item.id, 10)); if (!customField) return null; @@ -38,16 +49,7 @@ const mapCustomField = (item, customFields, mappedCommonProperties) => { mapped.attributes.defaultToday = !!item.params.is_default_today; } if (has(item.params, 'values') && Array.isArray(item.params.values)) { - mapped.attributes.values = item.params.values.map((value) => { - const mappedValue = { - name: value.value, - id: `${Math.random().toString()}-${Date.now()}`, - }; - if (has(value, 'is_checked') && value.is_checked) { - mappedValue.isChecked = true; - } - return mappedValue; - }); + mapped.attributes.values = customFieldValuesToBlockValues(item.params.values); } } return mapped; @@ -58,7 +60,7 @@ const mapCustomField = (item, customFields, mappedCommonProperties) => { * @param {array} data - from form.body property * @param {array} customFields - list of all custom fields */ -export default (data, customFields = []) => { +export const formBodyToBlocks = (data, customFields = []) => { if (!Array.isArray(data)) { throw new Error('Mapper expects form body to be an array.'); } diff --git a/assets/js/src/form_editor/store/store.jsx b/assets/js/src/form_editor/store/store.jsx index 249d3279ba..20daf4346b 100644 --- a/assets/js/src/form_editor/store/store.jsx +++ b/assets/js/src/form_editor/store/store.jsx @@ -8,7 +8,7 @@ import createReducer from './reducer.jsx'; import selectors from './selectors.jsx'; import controls from './controls.jsx'; import validateForm from './form_validator.jsx'; -import formBodyToBlocks from './form_body_to_blocks.jsx'; +import { formBodyToBlocks } from './form_body_to_blocks.jsx'; export default () => { const formData = { ...window.mailpoet_form_data }; diff --git a/tests/javascript/form_editor/store/form_body_to_blocks.spec.js b/tests/javascript/form_editor/store/form_body_to_blocks.spec.js index 3d5b909b37..2e0c3a0971 100644 --- a/tests/javascript/form_editor/store/form_body_to_blocks.spec.js +++ b/tests/javascript/form_editor/store/form_body_to_blocks.spec.js @@ -1,5 +1,5 @@ import { expect } from 'chai'; -import formBodyToBlocks from '../../../../assets/js/src/form_editor/store/form_body_to_blocks.jsx'; +import { formBodyToBlocks } from '../../../../assets/js/src/form_editor/store/form_body_to_blocks.jsx'; const emailInput = { type: 'text',