mirror of
https://github.com/dwaxweiler/connector-mobilizon
synced 2025-06-05 21:59:25 +02:00
only reload current block's events
This commit is contained in:
@ -63,6 +63,7 @@ final class Mobilizon_Connector {
|
|||||||
'wp-i18n'
|
'wp-i18n'
|
||||||
]);
|
]);
|
||||||
register_block_type(MobilizonConnector\NAME . '/events-list', [
|
register_block_type(MobilizonConnector\NAME . '/events-list', [
|
||||||
|
'api_version' => 2,
|
||||||
'editor_script' => $name
|
'editor_script' => $name
|
||||||
]);
|
]);
|
||||||
$this->load_settings_globally_before_script($name);
|
$this->load_settings_globally_before_script($name);
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
/* eslint-disable @wordpress/i18n-ellipsis */
|
/* eslint-disable @wordpress/i18n-ellipsis */
|
||||||
import { loadEventLists } from '../../events-loader.js'
|
import { loadEventList } from '../../events-loader.js'
|
||||||
|
|
||||||
const { InspectorControls } = wp.blockEditor
|
const { InspectorControls, useBlockProps } = wp.blockEditor
|
||||||
const { useEffect } = wp.element
|
const { useEffect } = wp.element
|
||||||
const { PanelBody } = wp.components
|
const { PanelBody } = wp.components
|
||||||
const { __ } = wp.i18n
|
const { __ } = wp.i18n
|
||||||
@ -9,11 +9,15 @@ const { __ } = wp.i18n
|
|||||||
const NAME = '<wordpress-name>'
|
const NAME = '<wordpress-name>'
|
||||||
|
|
||||||
export default ({ attributes, setAttributes }) => {
|
export default ({ attributes, setAttributes }) => {
|
||||||
|
const blockProps = useBlockProps()
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
reloadEventLists()
|
reloadEventLists()
|
||||||
}, [])
|
}, [])
|
||||||
function reloadEventLists() {
|
function reloadEventLists() {
|
||||||
loadEventLists()
|
const container = document.getElementById(blockProps.id)
|
||||||
|
if (container) {
|
||||||
|
loadEventList(container)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
function updateEventsCount(event) {
|
function updateEventsCount(event) {
|
||||||
let newValue = Number(event.target.value)
|
let newValue = Number(event.target.value)
|
||||||
@ -60,6 +64,7 @@ export default ({ attributes, setAttributes }) => {
|
|||||||
className={NAME + '_events-list'}
|
className={NAME + '_events-list'}
|
||||||
data-maximum={attributes.eventsCount}
|
data-maximum={attributes.eventsCount}
|
||||||
data-group-name={attributes.groupName}
|
data-group-name={attributes.groupName}
|
||||||
|
{...blockProps}
|
||||||
>
|
>
|
||||||
<div style={{ display: 'none' }}>
|
<div style={{ display: 'none' }}>
|
||||||
{__('The events could not be loaded!', '<wordpress-name>')}
|
{__('The events could not be loaded!', '<wordpress-name>')}
|
||||||
|
@ -7,6 +7,7 @@ const { __ } = wp.i18n
|
|||||||
const NAME = '<wordpress-name>'
|
const NAME = '<wordpress-name>'
|
||||||
|
|
||||||
registerBlockType(NAME + '/events-list', {
|
registerBlockType(NAME + '/events-list', {
|
||||||
|
apiVersion: 2,
|
||||||
title: __('Events List', '<wordpress-name>'),
|
title: __('Events List', '<wordpress-name>'),
|
||||||
description: __(
|
description: __(
|
||||||
'A list of the upcoming events of the connected Mobilizon instance.',
|
'A list of the upcoming events of the connected Mobilizon instance.',
|
||||||
|
@ -1,19 +1,22 @@
|
|||||||
/* eslint-disable @wordpress/i18n-ellipsis */
|
/* eslint-disable @wordpress/i18n-ellipsis */
|
||||||
|
const { useBlockProps } = wp.blockEditor
|
||||||
const { __ } = wp.i18n
|
const { __ } = wp.i18n
|
||||||
|
|
||||||
const NAME = '<wordpress-name>'
|
const NAME = '<wordpress-name>'
|
||||||
|
|
||||||
export default ({ attributes }) => {
|
export default ({ attributes }) => {
|
||||||
|
const blockProps = useBlockProps.save()
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={NAME + '_events-list'}
|
className={NAME + '_events-list'}
|
||||||
data-maximum={attributes.eventsCount}
|
data-maximum={attributes.eventsCount}
|
||||||
data-group-name={attributes.groupName}
|
data-group-name={attributes.groupName}
|
||||||
|
{...blockProps}
|
||||||
>
|
>
|
||||||
<div style="display: none;">
|
<div style={{ display: 'none' }}>
|
||||||
{__('The events could not be loaded!', '<wordpress-name>')}
|
{__('The events could not be loaded!', '<wordpress-name>')}
|
||||||
</div>
|
</div>
|
||||||
<div style="display: none;">
|
<div style={{ display: 'none' }}>
|
||||||
{__('The group could not be found!', '<wordpress-name>')}
|
{__('The group could not be found!', '<wordpress-name>')}
|
||||||
</div>
|
</div>
|
||||||
<ul>
|
<ul>
|
||||||
|
@ -6,14 +6,14 @@ const URL_SUFFIX = '/api'
|
|||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', loadEventLists)
|
document.addEventListener('DOMContentLoaded', loadEventLists)
|
||||||
|
|
||||||
export function loadEventLists() {
|
function loadEventLists() {
|
||||||
const eventLists = document.getElementsByClassName(NAME + '_events-list')
|
const eventLists = document.getElementsByClassName(NAME + '_events-list')
|
||||||
for (const list of eventLists) {
|
for (const list of eventLists) {
|
||||||
loadEventList(list)
|
loadEventList(list)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function loadEventList(container) {
|
export function loadEventList(container) {
|
||||||
const url = SETTINGS.url + URL_SUFFIX
|
const url = SETTINGS.url + URL_SUFFIX
|
||||||
const limit = parseInt(container.getAttribute('data-maximum'))
|
const limit = parseInt(container.getAttribute('data-maximum'))
|
||||||
const groupName = container.getAttribute('data-group-name')
|
const groupName = container.getAttribute('data-group-name')
|
||||||
|
Reference in New Issue
Block a user