diff --git a/assets/css/src/components/_postEditorBlock.scss b/assets/css/src/components/_postEditorBlock.scss new file mode 100644 index 0000000000..23c02d3e5e --- /dev/null +++ b/assets/css/src/components/_postEditorBlock.scss @@ -0,0 +1,6 @@ +.mailpoet-block-div { + background: #cfc; + border: 2px solid #9c9; + color: green; + padding: 20px; +} diff --git a/assets/css/src/post-editor-block.scss b/assets/css/src/post-editor-block.scss new file mode 100644 index 0000000000..e6692e113c --- /dev/null +++ b/assets/css/src/post-editor-block.scss @@ -0,0 +1 @@ +@import './components/postEditorBlock'; diff --git a/assets/js/src/post_editor_block/blocks.jsx b/assets/js/src/post_editor_block/blocks.jsx new file mode 100644 index 0000000000..b43abc6938 --- /dev/null +++ b/assets/js/src/post_editor_block/blocks.jsx @@ -0,0 +1 @@ +import './form_block.jsx'; diff --git a/assets/js/src/post_editor_block/form_block.jsx b/assets/js/src/post_editor_block/form_block.jsx new file mode 100644 index 0000000000..74a6215a44 --- /dev/null +++ b/assets/js/src/post_editor_block/form_block.jsx @@ -0,0 +1,19 @@ +import React from 'react'; + +const wp = window.wp; +const { registerBlockType } = wp.blocks; + +registerBlockType('mailpoet/form-block', { + title: 'Example: Basic (esnext)', + icon: 'universal-access-alt', + category: 'widgets', + example: {}, + edit() { + return ( +
Hello World, step 1 (from the editor).
+ ); + }, + save() { + return null; + }, +}); diff --git a/lib/Config/Initializer.php b/lib/Config/Initializer.php index 6ef0224a7f..9c3e1eba9d 100644 --- a/lib/Config/Initializer.php +++ b/lib/Config/Initializer.php @@ -68,6 +68,9 @@ class Initializer { /** @var WooCommerceHelper */ private $wcHelper; + /** @var PostEditorBlock */ + private $postEditorBlock; + const INITIALIZED = 'MAILPOET_INITIALIZED'; public function __construct( @@ -85,6 +88,7 @@ class Initializer { Shortcodes $shortcodes, DatabaseInitializer $databaseInitializer, WCTransactionalEmails $wcTransactionalEmails, + PostEditorBlock $postEditorBlock, WooCommerceHelper $wcHelper ) { $this->rendererFactory = $rendererFactory; @@ -102,6 +106,7 @@ class Initializer { $this->databaseInitializer = $databaseInitializer; $this->wcTransactionalEmails = $wcTransactionalEmails; $this->wcHelper = $wcHelper; + $this->postEditorBlock = $postEditorBlock; } public function init() { @@ -203,6 +208,7 @@ class Initializer { $this->setupPermanentNotices(); $this->setupDeactivationSurvey(); $this->setupAutomaticEmails(); + $this->postEditorBlock->init(); WPFunctions::get()->doAction('mailpoet_initialized', MAILPOET_VERSION); } catch (\Exception $e) { diff --git a/lib/Config/PostEditorBlock.php b/lib/Config/PostEditorBlock.php new file mode 100644 index 0000000000..9fbdf7a84a --- /dev/null +++ b/lib/Config/PostEditorBlock.php @@ -0,0 +1,44 @@ +renderer = $renderer; + $this->wp = $wp; + } + + public function init() { + // this has to be here until we drop support for WordPress < 5.0 + if (!function_exists('register_block_type')) return; + + $this->wp->wpEnqueueScript( + 'mailpoet-block-form-block-js', + Env::$assetsUrl . '/dist/js/' . $this->renderer->getJsAsset('post_editor_block.js'), + ['wp-blocks'], + Env::$version, + true + ); + + $this->wp->wpEnqueueStyle( + 'mailpoetblock-form-block-css', + Env::$assetsUrl . '/dist/css/' . $this->renderer->getCssAsset('post-editor-block.css'), + ['wp-edit-blocks'], + Env::$version + ); + + register_block_type( 'mailpoet/form-block', [ + 'style' => 'mailpoetblock-form-block-css', + 'editor_script' => 'mailpoet/form-block', + ]); + } + +} diff --git a/lib/DI/ContainerConfigurator.php b/lib/DI/ContainerConfigurator.php index a9dbeb314d..65bae3b8c8 100644 --- a/lib/DI/ContainerConfigurator.php +++ b/lib/DI/ContainerConfigurator.php @@ -101,6 +101,7 @@ class ContainerConfigurator implements IContainerConfigurator { $container->autowire(\MailPoet\Config\MP2Migrator::class); $container->autowire(\MailPoet\Config\RendererFactory::class)->setPublic(true); $container->autowire(\MailPoet\Config\ServicesChecker::class); + $container->autowire(\MailPoet\Config\PostEditorBlock::class); $container->autowire(\MailPoet\Config\Shortcodes::class) ->setShared(false); // Get a new instance each time $container->get() is called, needed for tests $container->register(\MailPoet\Config\Renderer::class) diff --git a/webpack.config.js b/webpack.config.js index e0b091328b..750e3707d5 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -370,7 +370,15 @@ const formEditorConfig = { }, }; -module.exports = [adminConfig, publicConfig, migratorConfig, formEditorConfig, testConfig].map((config) => { +// Block config +const postEditorBlock = { + name: 'post_editor_block', + entry: { + post_editor_block: 'post_editor_block/blocks.jsx', + }, +}; + +module.exports = [adminConfig, publicConfig, migratorConfig, formEditorConfig, testConfig, postEditorBlock].map((config) => { if (config.name !== 'test') { config.plugins = config.plugins || []; config.plugins.push(