Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Refactor add custom field component to use shorter conditions

Browse Source 
[MAILPOET-2463]
This commit is contained in:
Rostislav Wolny
2020-01-16 13:12:34 +01:00
committed by Pavel Dohnal
parent 374e146fb2
commit 50b4c1ffd6
1 changed files with 15 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
assets/js/src/form_editor/blocks/add_custom_field/add_custom_field_form.jsx
View File

@@ -7,6 +7,7 @@ import {
} from '@wordpress/components'; } from '@wordpress/components';
import MailPoet from 'mailpoet'; import MailPoet from 'mailpoet';
import { isEmpty } from 'lodash';
import mapCustomFieldFormData from '../map_custom_field_form_data.jsx'; import mapCustomFieldFormData from '../map_custom_field_form_data.jsx';
import TextFieldSettings from '../custom_text/custom_field_settings.jsx'; import TextFieldSettings from '../custom_text/custom_field_settings.jsx';
@@ -44,9 +45,9 @@ export const customFieldTypes = [
const AddCustomFieldForm = ({ dateSettings, onSubmit }) => { const AddCustomFieldForm = ({ dateSettings, onSubmit }) => {
const [fieldType, setFieldType] = useState('text'); const [fieldType, setFieldType] = useState('text');
const [fieldName, setFieldName] = useState(null); const [fieldName, setFieldName] = useState(null);
const [fieldSettings, setFieldSettings] = useState(null); const [fieldSettings, setFieldSettings] = useState({});
const canSubmit = () => fieldName && fieldSettings; const canSubmit = () => fieldName && !isEmpty(fieldSettings);
const defaultType = dateSettings.dateTypes[0].value; const defaultType = dateSettings.dateTypes[0].value;
const defaultFormat = dateSettings.dateFormats[defaultType][0]; const defaultFormat = dateSettings.dateFormats[defaultType][0];
@@ -55,9 +56,9 @@ const AddCustomFieldForm = ({ dateSettings, onSubmit }) => {
case 'checkbox': case 'checkbox':
return ( return (
<CheckboxFieldSettings <CheckboxFieldSettings
mandatory={fieldSettings && fieldSettings.mandatory ? fieldSettings.mandatory : false} mandatory={fieldSettings.mandatory ? fieldSettings.mandatory : false}
isChecked={fieldSettings && fieldSettings.isChecked ? fieldSettings.isChecked : false} isChecked={fieldSettings.isChecked ? fieldSettings.isChecked : false}
checkboxLabel={fieldSettings && fieldSettings.checkboxLabel ? fieldSettings.checkboxLabel : ''} checkboxLabel={fieldSettings.checkboxLabel ? fieldSettings.checkboxLabel : ''}
onChange={setFieldSettings} onChange={setFieldSettings}
/> />
); );
@@ -65,13 +66,10 @@ const AddCustomFieldForm = ({ dateSettings, onSubmit }) => {
return ( return (
<DateFieldSettings <DateFieldSettings
dateSettings={dateSettings} dateSettings={dateSettings}
mandatory={fieldSettings && fieldSettings.mandatory ? fieldSettings.mandatory : false} mandatory={fieldSettings.mandatory ? fieldSettings.mandatory : false}
dateFormat={fieldSettings && fieldSettings.dateFormat dateFormat={fieldSettings.dateFormat ? fieldSettings.dateFormat : defaultFormat}
? fieldSettings.dateFormat : defaultFormat} dateType={fieldSettings.dateType ? fieldSettings.dateType : defaultType}
dateType={fieldSettings && fieldSettings.dateType defaultToday={fieldSettings.defaultToday ? fieldSettings.defaultToday : false}
? fieldSettings.dateType : defaultType}
defaultToday={fieldSettings && fieldSettings.defaultToday
? fieldSettings.defaultToday : false}
onChange={setFieldSettings} onChange={setFieldSettings}
/> />
); );
@@ -79,8 +77,8 @@ const AddCustomFieldForm = ({ dateSettings, onSubmit }) => {
case 'select': case 'select':
return ( return (
<RadioAndSelectFieldSettings <RadioAndSelectFieldSettings
mandatory={fieldSettings && fieldSettings.mandatory ? fieldSettings.mandatory : false} mandatory={fieldSettings.mandatory ? fieldSettings.mandatory : false}
values={fieldSettings && fieldSettings.values ? fieldSettings.values : [{ name: '', id: Math.random().toString() }]} values={fieldSettings.values ? fieldSettings.values : [{ name: '', id: Math.random().toString() }]}
onChange={setFieldSettings} onChange={setFieldSettings}
useDragAndDrop={false} useDragAndDrop={false}
/> />
@@ -88,8 +86,8 @@ const AddCustomFieldForm = ({ dateSettings, onSubmit }) => {
default: default:
return ( return (
<TextFieldSettings <TextFieldSettings
mandatory={fieldSettings && fieldSettings.mandatory ? fieldSettings.mandatory : false} mandatory={fieldSettings.mandatory ? fieldSettings.mandatory : false}
validate={fieldSettings && fieldSettings.validate ? fieldSettings.validate : ''} validate={fieldSettings.validate ? fieldSettings.validate : ''}
onChange={setFieldSettings} onChange={setFieldSettings}
/> />
); );
@@ -104,7 +102,7 @@ const AddCustomFieldForm = ({ dateSettings, onSubmit }) => {
options={customFieldTypes} options={customFieldTypes}
data-automation-id="create_custom_field_type_select" data-automation-id="create_custom_field_type_select"
onChange={(value) => { onChange={(value) => {
setFieldSettings(null); setFieldSettings({});
setFieldType(value); setFieldType(value);
}} }}
/> />