Merge branch 'main' into block

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

@@ -0,0 +1,53 @@
+const { InspectorControls } = wp.blockEditor
+const { PanelBody } = wp.components
+const { __ } = wp.i18n
+
+export default ({ attributes, setAttributes }) => {
+  function updateEventsCount(event) {
+    let newValue = Number(event.target.value)
+    if (newValue < 1) newValue = 1
+    setAttributes({ eventsCount: newValue })
+  }
+  function updateGroupName(event) {
+    setAttributes({ groupName: event.target.value })
+  }
+  return [
+    <InspectorControls>
+      <PanelBody title={__('Events List Settings', '<wordpress-name>')}>
+        <label
+          className="components-base-control__label"
+          htmlFor="<wordpress-name>_events-count"
+        >
+          {__('Number of events to show', '<wordpress-name>')}
+        </label>
+        <input
+          className="components-text-control__input"
+          type="number"
+          value={attributes.eventsCount}
+          onChange={updateEventsCount}
+          id="<wordpress-name>_events-count"
+        />
+        <label
+          className="components-base-control__label"
+          htmlFor="<wordpress-name>_group-name"
+        >
+          {__('Group name (optional)', '<wordpress-name>')}
+        </label>
+        <input
+          className="components-text-control__input"
+          type="text"
+          value={attributes.groupName}
+          onChange={updateGroupName}
+          id="<wordpress-name>_group-name"
+        />
+      </PanelBody>
+    </InspectorControls>,
+    <ul>
+      {[...Array(attributes.eventsCount)].map((_, i) => (
+        <li className="busterCards" key={i}>
+          {__('Event', '<wordpress-name>')} {i}
+        </li>
+      ))}
+    </ul>,
+  ]
+}

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

@@ -0,0 +1,31 @@
+import edit from './edit'
+import save from './save'
+
+const { registerBlockType } = wp.blocks
+const { __ } = wp.i18n
+
+const NAME = '<wordpress-name>'
+
+registerBlockType(NAME + '/events-list', {
+  title: __('Events List', '<wordpress-name>'),
+  description: __(
+    'A list of the upcoming events of the connected Mobilizon instance.',
+    '<wordpress-name>'
+  ),
+  icon: 'list-view',
+  category: 'widgets',
+  attributes: {
+    eventsCount: {
+      type: 'number',
+      default: 3,
+    },
+    groupName: {
+      type: 'string',
+    },
+  },
+  supports: {
+    html: false,
+  },
+  edit,
+  save,
+})

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

@@ -0,0 +1,25 @@
+const { __ } = wp.i18n
+
+const NAME = '<wordpress-name>'
+
+const URL = 'https://mobilizon.fr' // TODO
+const LOCALE = 'en-GB' // TODO
+const TIMEZONE = 'Europe/Rome' // TODO
+const isShortOffsetNameShown = true // eslint-disable-line no-unused-vars
+
+export default ({ attributes }) => {
+  return (
+    <ul
+      className={NAME + '_events-list'}
+      data-url={URL}
+      data-locale={LOCALE}
+      data-maximum={attributes.eventsCount}
+      data-group-name={attributes.groupName}
+      data-time-zone={TIMEZONE}
+    >
+      <li style="display: none;">
+        {__('The events could not be loaded!', '<wordpress-name>')}
+      </li>
+    </ul>
+  )
+}