Add custom field form data mapper

[MAILPOET-2463]
This commit is contained in:
Rostislav Wolny
2020-01-13 15:38:00 +01:00
committed by Pavel Dohnal
parent 5ff8036972
commit aa4e4510c0
8 changed files with 60 additions and 37 deletions

View File

@@ -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'}

View File

@@ -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,

View File

@@ -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,

View File

@@ -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,

View File

@@ -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,

View File

@@ -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,

View File

@@ -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,

View File

@@ -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;