diff --git a/assets/js/src/form_editor/blocks/add_custom_field/edit.jsx b/assets/js/src/form_editor/blocks/add_custom_field/edit.jsx index e7b6d322a2..8fcaeabe0a 100644 --- a/assets/js/src/form_editor/blocks/add_custom_field/edit.jsx +++ b/assets/js/src/form_editor/blocks/add_custom_field/edit.jsx @@ -5,6 +5,7 @@ import { Button, SelectControl, TextControl, + Spinner, } from '@wordpress/components'; import { BlockIcon } from '@wordpress/block-editor'; import { useSelect, useDispatch } from '@wordpress/data'; @@ -58,6 +59,11 @@ const AddCustomField = ({ clientId }) => { [] ); + const isCreating = useSelect( + (sel) => sel('mailpoet-form-editor').getIsCustomFieldCrating(), + [] + ); + const defaultType = dateSettings.dateTypes[0].value; const defaultFormat = dateSettings.dateFormats[defaultType][0]; @@ -111,39 +117,43 @@ const AddCustomField = ({ clientId }) => { icon={} label="New Custom Field" > -

Create a new custom field for your subscribers.

-
-
- { - setFieldSettings(null); - setFieldType(value); - }} - /> - -
- {renderSettingsForType()} - -
+ {!isCreating ? ( + <> +

Create a new custom field for your subscribers.

+
+
+ { + setFieldSettings(null); + setFieldType(value); + }} + /> + +
+ {renderSettingsForType()} + +
+ + ) : ()} ); }; diff --git a/assets/js/src/form_editor/store/selectors.jsx b/assets/js/src/form_editor/store/selectors.jsx index 58320dab03..661aed5fc4 100644 --- a/assets/js/src/form_editor/store/selectors.jsx +++ b/assets/js/src/form_editor/store/selectors.jsx @@ -59,4 +59,7 @@ export default { getDateSettingsData(state) { return state.dateSettingData; }, + getIsCustomFieldCrating(state) { + return state.isCustomFieldCreating; + }, }; diff --git a/assets/js/src/form_editor/store/store.jsx b/assets/js/src/form_editor/store/store.jsx index 2bbe956d84..249d3279ba 100644 --- a/assets/js/src/form_editor/store/store.jsx +++ b/assets/js/src/form_editor/store/store.jsx @@ -32,6 +32,7 @@ export default () => { customFields: window.mailpoet_custom_fields, isFormSaving: false, isCustomFieldSaving: false, + isCustomFieldCreating: false, notices: [], sidebar: { activeTab: 'form',