41 lines
1.0 KiB
JavaScript
41 lines
1.0 KiB
JavaScript
import { __ } from "@wordpress/i18n";
|
|
import { useBlockProps, InnerBlocks } from "@wordpress/block-editor";
|
|
import "./editor.scss";
|
|
import { useSelect } from "@wordpress/data";
|
|
|
|
export default function Edit({ attributes, setAttributes, ...props }) {
|
|
const years = useSelect(
|
|
(select) => {
|
|
const { getBlocks } = select("core/block-editor");
|
|
const childBlocks = getBlocks(props.clientId) || [];
|
|
return childBlocks
|
|
.filter((b) => b.name === "carhop-blocks/highlight-timeline-step")
|
|
.map((b) => b.attributes?.year)
|
|
.filter((y) => y !== undefined && y !== null && y !== "");
|
|
},
|
|
[props.clientId]
|
|
);
|
|
|
|
return (
|
|
<div
|
|
{...useBlockProps({
|
|
className: "highlight-timeline",
|
|
})}
|
|
>
|
|
<div className="highlight-timeline__innerblocks">
|
|
<InnerBlocks
|
|
allowedBlocks={["carhop-blocks/highlight-timeline-step"]}
|
|
/>
|
|
</div>
|
|
|
|
<ul className="highlight-timeline__years">
|
|
{years.map((y, idx) => (
|
|
<li key={idx} className="story-timeline__year">
|
|
{y}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
);
|
|
}
|