convert to dynamic block

source/connector-mobilizon.php

@@ -12,6 +12,7 @@
 
 require_once __DIR__ . '/includes/constants.php';
 require_once __DIR__ . '/includes/settings.php';
+require_once __DIR__ . '/includes/events-list-block.php';
 require_once __DIR__ . '/includes/events-list-shortcut.php';
 require_once __DIR__ . '/includes/events-list-widget.php';
 
@@ -64,7 +65,8 @@ final class Mobilizon_Connector {
       ]);
     register_block_type(MobilizonConnector\NAME . '/events-list', [
       'api_version' => 2,
-      'editor_script' => $name
+      'editor_script' => $name,
+      'render_callback' => 'MobilizonConnector\EventsListBlock::render',
     ]);
     $this->load_settings_globally_before_script($name);
   }

source/front/blocks/events-list/index.js

@@ -1,5 +1,4 @@
 import edit from './edit.js'
-import save from './save.js'
 
 const { registerBlockType } = wp.blocks
 const { __ } = wp.i18n
@@ -28,5 +27,4 @@ registerBlockType(NAME + '/events-list', {
     html: false,
   },
   edit,
-  save,
 })

source/front/blocks/events-list/save.js

@@ -1,27 +0,0 @@
-/* eslint-disable @wordpress/i18n-ellipsis */
-const { useBlockProps } = wp.blockEditor
-const { __ } = wp.i18n
-
-const NAME = '<wordpress-name>'
-
-export default ({ attributes }) => {
-  const blockProps = useBlockProps.save({
-    className: NAME + '_events-list',
-    'data-maximum': attributes.eventsCount,
-    'data-group-name': attributes.groupName,
-  })
-  return (
-    <div {...blockProps}>
-      <div className="general-error" style={{ display: 'none' }}>
-        {__('The events could not be loaded!', '<wordpress-name>')}
-      </div>
-      <div className="group-not-found" style={{ display: 'none' }}>
-        {__('The group could not be found!', '<wordpress-name>')}
-      </div>
-      <div className="loading-indicator" style={{ display: 'none' }}>
-        {__('Loading...', '<wordpress-name>')}
-      </div>
-      <ul style={{ 'list-style-type': 'none', 'padding-left': 0 }}></ul>
-    </div>
-  )
-}

source/includes/events-list-block.php

@@ -0,0 +1,21 @@
+<?php
+namespace MobilizonConnector;
+
+// Exit if this file is called directly.
+if (!defined('ABSPATH')) {
+  exit;
+}
+
+class EventsListBlock {
+
+  public static function render($block_attributes, $content) {
+    $classNamePrefix = NAME;
+    $eventsCount = $block_attributes['eventsCount'];
+    $groupName = isset($block_attributes['groupName']) ? $block_attributes['groupName'] : '';
+
+    ob_start();
+    require dirname(__DIR__) . '/view/events-list.php';
+    $output = ob_get_clean();
+    return $output;
+  }
+}