Mobilizon
/
connector-wordpress
mirror of https://github.com/dwaxweiler/connector-mobilizon
1
0
Fork 0
Code Issues Releases Wiki Activity

fix using changed attribute, use Panel element

This commit is contained in:
Daniel Waxweiler 2024-04-05 23:17:53 +02:00
parent d546157c93
commit 55c1ead17d
1 changed files with 38 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
source/front/blocks/events-list/edit.js
View File

@ -8,7 +8,7 @@ import {
} from '../../events-displayer.js' } from '../../events-displayer.js'
const { InspectorControls, useBlockProps } = wp.blockEditor const { InspectorControls, useBlockProps } = wp.blockEditor
const { PanelBody } = wp.components const { Panel, PanelBody } = wp.components
const { useEffect } = wp.element const { useEffect } = wp.element
const { __ } = wp.i18n const { __ } = wp.i18n
@ -16,11 +16,10 @@ const NAME = '<wordpress-name>'
export default ({ attributes, setAttributes }) => { export default ({ attributes, setAttributes }) => {
let timer let timer
const { eventsCount, groupName } = attributes
const blockProps = useBlockProps({ const blockProps = useBlockProps({
className: NAME + '_events-list', className: NAME + '_events-list',
}) })
function reloadEventList() { function reloadEventList(eventsCount, groupName) {
if (timer) { if (timer) {
clearTimeout(timer) clearTimeout(timer)
} }
@ -35,12 +34,7 @@ export default ({ attributes, setAttributes }) => {
url += `&groupName=${groupName}` url += `&groupName=${groupName}`
} }
await fetch(url) await fetch(url)
.then((response) => { .then((response) => response.text())
if (!response.ok) {
return Promise.reject('Network response was not OK.')
}
return response.text()
})
.then((data) => { .then((data) => {
const events = JSON.parse(data) const events = JSON.parse(data)
displayEvents({ displayEvents({
@ -57,51 +51,51 @@ export default ({ attributes, setAttributes }) => {
}, 500) }, 500)
} }
useEffect(() => { useEffect(() => {
reloadEventList() reloadEventList(attributes.eventsCount, attributes.groupName)
}, []) }, [])
function updateEventsCount(event) { function updateEventsCount(event) {
// console.log('new value: ', event.target.value) // TODO
let newValue = Number(event.target.value) let newValue = Number(event.target.value)
if (newValue < 1) newValue = 1 if (newValue < 1) newValue = 1
setAttributes({ eventsCount: newValue }) setAttributes({ eventsCount: newValue })
reloadEventList() reloadEventList(newValue, attributes.groupName)
} }
function updateGroupName(event) { function updateGroupName(event) {
// console.log('new value: ', event.target.value) // TODO const newValue = event.target.value
// TODO not triggered on pasting only setAttributes({ groupName: newValue })
setAttributes({ groupName: event.target.value }) reloadEventList(attributes.eventsCount, newValue)
reloadEventList()
} }
return [ return [
<InspectorControls> <InspectorControls>
<PanelBody title={__('Events List Settings', '<wordpress-name>')}> <Panel>
<label <PanelBody title={__('Events List Settings', '<wordpress-name>')}>
className="components-base-control__label" <label
htmlFor={NAME + '_events-count'} className="components-base-control__label"
> htmlFor={NAME + '_events-count'}
{__('Number of events to show', '<wordpress-name>')} >
</label> {__('Number of events to show', '<wordpress-name>')}
<input </label>
className="components-text-control__input" <input
type="number" className="components-text-control__input"
value={eventsCount} type="number"
onChange={updateEventsCount} value={attributes.eventsCount}
id={NAME + '_events-count'} onChange={updateEventsCount}
/> id={NAME + '_events-count'}
<label />
className="components-base-control__label" <label
htmlFor={NAME + '_group-name'} className="components-base-control__label"
> htmlFor={NAME + '_group-name'}
{__('Group name (optional)', '<wordpress-name>')} >
</label> {__('Group name (optional)', '<wordpress-name>')}
<input </label>
className="components-text-control__input" <input
type="text" className="components-text-control__input"
value={groupName} type="text"
onChange={updateGroupName} value={attributes.groupName}
id={NAME + '_group-name'} onChange={updateGroupName}
/> id={NAME + '_group-name'}
</PanelBody> />
</PanelBody>
</Panel>
</InspectorControls>, </InspectorControls>,
<div {...blockProps}> <div {...blockProps}>
<div className="general-error" style={{ display: 'none' }}> <div className="general-error" style={{ display: 'none' }}>