Add custom field form data mapper
[MAILPOET-2463]
This commit is contained in:
committed by
Pavel Dohnal
parent
5ff8036972
commit
aa4e4510c0
@@ -11,6 +11,7 @@ import { useSelect } from '@wordpress/data';
|
||||
import MailPoet from 'mailpoet';
|
||||
|
||||
import icon from './icon.jsx';
|
||||
import mapCustomFieldFormData from '../map_custom_field_form_data.jsx';
|
||||
import TextFieldSettings from '../custom_text/custom_field_settings.jsx';
|
||||
import CheckboxFieldSettings from '../custom_checkbox/custom_field_settings.jsx';
|
||||
import DateFieldSettings from '../custom_date/custom_field_settings.jsx';
|
||||
@@ -131,11 +132,14 @@ const AddCustomField = ({ clientId }) => {
|
||||
disabled={!canSubmit()}
|
||||
onClick={() => {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(fieldType);
|
||||
console.log('Custom field data to store');
|
||||
const data = {
|
||||
name: fieldName,
|
||||
type: fieldType,
|
||||
params: mapCustomFieldFormData(fieldType, fieldSettings),
|
||||
};
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(fieldName);
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(fieldSettings);
|
||||
console.log(data);
|
||||
}}
|
||||
>
|
||||
{'Create'}
|
||||
|
@@ -11,6 +11,7 @@ import MailPoet from 'mailpoet';
|
||||
import { useDispatch, useSelect } from '@wordpress/data';
|
||||
|
||||
import CustomFieldSettings from './custom_field_settings.jsx';
|
||||
import mapCustomFieldFormData from '../map_custom_field_form_data.jsx';
|
||||
|
||||
const CustomCheckboxEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
const isSaving = useSelect(
|
||||
@@ -59,13 +60,7 @@ const CustomCheckboxEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
onSave={(params) => saveCustomField({
|
||||
customFieldId: attributes.customFieldId,
|
||||
data: {
|
||||
params: {
|
||||
required: params.mandatory ? '1' : undefined,
|
||||
values: [{
|
||||
is_checked: params.isChecked ? '1' : undefined,
|
||||
value: params.checkboxLabel,
|
||||
}],
|
||||
},
|
||||
params: mapCustomFieldFormData('checkbox', params),
|
||||
},
|
||||
onFinish: () => setAttributes({
|
||||
mandatory: params.mandatory,
|
||||
|
@@ -13,6 +13,7 @@ import { useDispatch, useSelect } from '@wordpress/data';
|
||||
import CustomFieldSettings from './custom_field_settings.jsx';
|
||||
import FormFieldDate from '../../../form/fields/date.jsx';
|
||||
import formatLabel from '../label_formatter.jsx';
|
||||
import mapCustomFieldFormData from '../map_custom_field_form_data.jsx';
|
||||
|
||||
const CustomDateEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
const isSaving = useSelect(
|
||||
@@ -46,12 +47,7 @@ const CustomDateEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
onSave={(params) => saveCustomField({
|
||||
customFieldId: attributes.customFieldId,
|
||||
data: {
|
||||
params: {
|
||||
required: params.mandatory ? '1' : undefined,
|
||||
date_type: params.dateType,
|
||||
date_format: params.dateFormat,
|
||||
is_default_today: params.defaultToday ? '1' : undefined,
|
||||
},
|
||||
params: mapCustomFieldFormData('date', params),
|
||||
},
|
||||
onFinish: () => setAttributes({
|
||||
mandatory: params.mandatory,
|
||||
|
@@ -12,6 +12,7 @@ import { useDispatch, useSelect } from '@wordpress/data';
|
||||
|
||||
import CustomFieldSettings from './custom_field_settings.jsx';
|
||||
import formatLabel from '../label_formatter.jsx';
|
||||
import mapCustomFieldFormData from '../map_custom_field_form_data.jsx';
|
||||
|
||||
const CustomRadioEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
const isSaving = useSelect(
|
||||
@@ -38,10 +39,7 @@ const CustomRadioEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
onSave={(params) => saveCustomField({
|
||||
customFieldId: attributes.customFieldId,
|
||||
data: {
|
||||
params: {
|
||||
required: params.mandatory ? '1' : undefined,
|
||||
values: params.values.map((value) => ({ value: value.name })),
|
||||
},
|
||||
params: mapCustomFieldFormData('radio', params),
|
||||
},
|
||||
onFinish: () => setAttributes({
|
||||
mandatory: params.mandatory,
|
||||
|
@@ -12,6 +12,7 @@ import { useDispatch, useSelect } from '@wordpress/data';
|
||||
import formatLabel from '../label_formatter.jsx';
|
||||
|
||||
import CustomFieldSettings from '../custom_radio/custom_field_settings.jsx';
|
||||
import mapCustomFieldFormData from '../map_custom_field_form_data.jsx';
|
||||
|
||||
const CustomSelectEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
const isSaving = useSelect(
|
||||
@@ -38,13 +39,7 @@ const CustomSelectEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
onSave={(params) => saveCustomField({
|
||||
customFieldId: attributes.customFieldId,
|
||||
data: {
|
||||
params: {
|
||||
required: params.mandatory ? '1' : undefined,
|
||||
values: params.values.map((value) => ({
|
||||
value: value.name,
|
||||
is_checked: value.isChecked ? '1' : undefined,
|
||||
})),
|
||||
},
|
||||
params: mapCustomFieldFormData('select', params),
|
||||
},
|
||||
onFinish: () => setAttributes({
|
||||
mandatory: params.mandatory,
|
||||
|
@@ -12,6 +12,7 @@ import { useDispatch, useSelect } from '@wordpress/data';
|
||||
|
||||
import CustomFieldSettings from './custom_field_settings.jsx';
|
||||
import formatLabel from '../label_formatter.jsx';
|
||||
import mapCustomFieldFormData from '../map_custom_field_form_data.jsx';
|
||||
|
||||
const CustomTextEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
const isSaving = useSelect(
|
||||
@@ -42,10 +43,7 @@ const CustomTextEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
saveCustomField({
|
||||
customFieldId: attributes.customFieldId,
|
||||
data: {
|
||||
params: {
|
||||
required: params.mandatory ? '1' : undefined,
|
||||
validate: params.validate,
|
||||
},
|
||||
params: mapCustomFieldFormData('text', params),
|
||||
},
|
||||
onFinish: () => setAttributes({
|
||||
mandatory: params.mandatory,
|
||||
|
@@ -12,6 +12,7 @@ import { useDispatch, useSelect } from '@wordpress/data';
|
||||
|
||||
import CustomFieldSettings from '../custom_text/custom_field_settings.jsx';
|
||||
import formatLabel from '../label_formatter.jsx';
|
||||
import mapCustomFieldFormData from '../map_custom_field_form_data.jsx';
|
||||
|
||||
const CustomTextAreaEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
const isSaving = useSelect(
|
||||
@@ -37,11 +38,7 @@ const CustomTextAreaEdit = ({ attributes, setAttributes, clientId }) => {
|
||||
onSave={(params) => saveCustomField({
|
||||
customFieldId: attributes.customFieldId,
|
||||
data: {
|
||||
params: {
|
||||
required: params.mandatory ? '1' : undefined,
|
||||
validate: params.validate,
|
||||
lines: params.lines,
|
||||
},
|
||||
params: mapCustomFieldFormData('textarea', params),
|
||||
},
|
||||
onFinish: () => setAttributes({
|
||||
mandatory: params.mandatory,
|
||||
|
@@ -0,0 +1,40 @@
|
||||
function mapFormDataToParams(fieldType, data) {
|
||||
switch (fieldType) {
|
||||
case 'checkbox':
|
||||
return {
|
||||
required: data.mandatory ? '1' : undefined,
|
||||
values: [{
|
||||
is_checked: data.isChecked ? '1' : undefined,
|
||||
value: data.checkboxLabel,
|
||||
}],
|
||||
};
|
||||
case 'date':
|
||||
return {
|
||||
required: data.mandatory ? '1' : undefined,
|
||||
date_type: data.dateType,
|
||||
date_format: data.dateFormat,
|
||||
is_default_today: data.defaultToday ? '1' : undefined,
|
||||
};
|
||||
case 'radio':
|
||||
case 'select':
|
||||
return {
|
||||
required: data.mandatory ? '1' : undefined,
|
||||
values: data.values.map((value) => ({ value: value.name })),
|
||||
};
|
||||
case 'text':
|
||||
return {
|
||||
required: data.mandatory ? '1' : undefined,
|
||||
validate: data.validate,
|
||||
};
|
||||
case 'textarea':
|
||||
return {
|
||||
required: data.mandatory ? '1' : undefined,
|
||||
validate: data.validate,
|
||||
lines: data.lines ? data.lines : '1',
|
||||
};
|
||||
default:
|
||||
throw new Error(`Invalid custom field type ${fieldType}!`);
|
||||
}
|
||||
}
|
||||
|
||||
export default mapFormDataToParams;
|
Reference in New Issue
Block a user