Compare commits
4 Commits
183c7bdd35
...
f1c4232493
Author | SHA1 | Date |
---|---|---|
Daniel Waxweiler | f1c4232493 | |
Daniel Waxweiler | 55c1ead17d | |
Daniel Waxweiler | d546157c93 | |
Daniel Waxweiler | 4f0752b0ac |
|
@ -2,10 +2,11 @@
|
||||||
#### Added
|
#### Added
|
||||||
- Display name of group when it cannot be found
|
- Display name of group when it cannot be found
|
||||||
#### Changed
|
#### Changed
|
||||||
- Let backend do requests to API for viewing all forms, except for in-editor block preview
|
- Let backend do requests to API of Mobilizon instance for increased privacy
|
||||||
#### Deprecated
|
#### Deprecated
|
||||||
#### Removed
|
#### Removed
|
||||||
#### Fixed
|
#### Fixed
|
||||||
|
- Fix displaying more than one block in the editor
|
||||||
#### Security
|
#### Security
|
||||||
|
|
||||||
### [0.11.5]
|
### [0.11.5]
|
||||||
|
|
|
@ -8,24 +8,22 @@ 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
|
||||||
|
|
||||||
const NAME = '<wordpress-name>'
|
const NAME = '<wordpress-name>'
|
||||||
|
|
||||||
let timer
|
|
||||||
|
|
||||||
export default ({ attributes, setAttributes }) => {
|
export default ({ attributes, setAttributes }) => {
|
||||||
const { eventsCount, groupName } = attributes
|
let timer
|
||||||
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)
|
||||||
}
|
}
|
||||||
timer = setTimeout(() => {
|
timer = setTimeout(async () => {
|
||||||
const container = document.getElementById(blockProps.id)
|
const container = document.getElementById(blockProps.id)
|
||||||
if (container) {
|
if (container) {
|
||||||
hideErrorMessages(container)
|
hideErrorMessages(container)
|
||||||
|
@ -35,13 +33,8 @@ export default ({ attributes, setAttributes }) => {
|
||||||
if (groupName) {
|
if (groupName) {
|
||||||
url += `&groupName=${groupName}`
|
url += `&groupName=${groupName}`
|
||||||
}
|
}
|
||||||
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({
|
||||||
|
@ -58,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' }}>
|
||||||
|
|
|
@ -80,7 +80,7 @@ export function showLoadingIndicator(container) {
|
||||||
indicator.style.display = 'block'
|
indicator.style.display = 'block'
|
||||||
}
|
}
|
||||||
|
|
||||||
export function hideLoadingIndicator(container) {
|
function hideLoadingIndicator(container) {
|
||||||
const indicator = container.querySelector('.loading-indicator')
|
const indicator = container.querySelector('.loading-indicator')
|
||||||
indicator.style.display = 'none'
|
indicator.style.display = 'none'
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue