65 lines
2.2 KiB
JavaScript
65 lines
2.2 KiB
JavaScript
( function ( wp ) {
|
|
let __ = wp.i18n.__,
|
|
el = wp.element.createElement,
|
|
registerBlockType = wp.blocks.registerBlockType,
|
|
ServerSideRender = wp.serverSideRender,
|
|
useBlockProps = wp.blockEditor.useBlockProps,
|
|
InspectorControls = wp.blockEditor.InspectorControls,
|
|
PanelBody = wp.components.PanelBody,
|
|
Placeholder = wp.components.Placeholder;
|
|
|
|
const esForms = window.es_forms;
|
|
registerBlockType( 'email-subscribers/subscription-form-block', {
|
|
apiVersion: 2,
|
|
title: 'Icegram Express Form',
|
|
icon: 'feedback',
|
|
category: 'common',
|
|
attributes: { // The data this block will be storing
|
|
formID: { type: 'number' }
|
|
},
|
|
edit: function ( props ) {
|
|
var blockProps = useBlockProps();
|
|
return el(
|
|
'div',
|
|
blockProps,
|
|
el(
|
|
InspectorControls,
|
|
{},
|
|
el(
|
|
PanelBody,
|
|
{
|
|
title: __( 'Subscription Form', 'email-subscribers' )
|
|
},
|
|
displaySelectFormDropdown(props)
|
|
),
|
|
),
|
|
props.attributes.formID ? el( ServerSideRender, {
|
|
block: 'email-subscribers/subscription-form-block',
|
|
attributes: props.attributes,
|
|
} ) : el('div', {}, el( Placeholder, {}, displaySelectFormDropdown( props ) ) )
|
|
);
|
|
}
|
|
});
|
|
|
|
const displaySelectFormDropdown = props => {
|
|
return el(
|
|
'select',
|
|
{
|
|
value: props.attributes.formID ? props.attributes.formID : '',
|
|
onChange: event => props.setAttributes( { formID: parseInt(event.target.value) } )
|
|
},
|
|
el( 'option',
|
|
{
|
|
value: ''
|
|
},
|
|
__( 'Select a form', 'email-subscribers' )
|
|
),
|
|
...esForms.map( form => {
|
|
return el( 'option', { value: form.id }, form.name )
|
|
})
|
|
);
|
|
}
|
|
} )(
|
|
window.wp
|
|
);
|