82 lines
2.1 KiB
JavaScript
82 lines
2.1 KiB
JavaScript
import { __ } from "@wordpress/i18n";
|
|
import { useSelect } from "@wordpress/data";
|
|
import {
|
|
useBlockProps,
|
|
RichText,
|
|
InspectorControls,
|
|
__experimentalLinkControl as LinkControl,
|
|
} from "@wordpress/block-editor";
|
|
import arrow from "../img/arrow-right-circle.svg";
|
|
import "./editor.scss";
|
|
|
|
import { PanelBody } from "@wordpress/components";
|
|
|
|
export default function Edit({ attributes, setAttributes, ...props }) {
|
|
let { chapterLinkTitle, chapterLinkDescription, chapterLinkRelatedPost } =
|
|
attributes;
|
|
|
|
function onChangeChapterLinkTitle(chapterLinkTitle) {
|
|
setAttributes({ chapterLinkTitle });
|
|
}
|
|
function onChangeChapterLinkDescription(chapterLinkDescription) {
|
|
setAttributes({ chapterLinkDescription });
|
|
}
|
|
|
|
function onRelatedPostChange(chapterLinkRelatedPost) {
|
|
setAttributes({ chapterLinkRelatedPost });
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<InspectorControls>
|
|
<PanelBody
|
|
className="related-conseil-panel-body"
|
|
title={__(
|
|
"Page de lien de ce Chapitre ",
|
|
"homegrade-blocks__texte-fonctionnel"
|
|
)}
|
|
>
|
|
<LinkControl
|
|
value={chapterLinkRelatedPost}
|
|
onChange={onRelatedPostChange}
|
|
/>
|
|
</PanelBody>
|
|
</InspectorControls>
|
|
<div
|
|
{...useBlockProps({
|
|
className: `homegrade-blocks-lien-chapitre`,
|
|
})}
|
|
>
|
|
<RichText
|
|
tagName="h4"
|
|
className="homegrade-blocks-lien-chapitre__title"
|
|
placeholder={__(
|
|
"Titre du chapitre",
|
|
"homegrade-blocks__texte-fonctionnel"
|
|
)}
|
|
value={chapterLinkTitle}
|
|
onChange={onChangeChapterLinkTitle}
|
|
/>
|
|
<RichText
|
|
tagName="p"
|
|
className="homegrade-blocks-lien-chapitre__description"
|
|
placeholder={__(
|
|
"Descriptif du chapitre",
|
|
"homegrade-blocks__texte-fonctionnel"
|
|
)}
|
|
value={chapterLinkDescription}
|
|
onChange={onChangeChapterLinkDescription}
|
|
/>
|
|
{chapterLinkRelatedPost && chapterLinkRelatedPost.url && (
|
|
<a className="homegrade-blocks-lien-chapitre__cta">
|
|
{__("En savoir plus", "homegrade-blocks__texte-fonctionnel")}
|
|
<div class="cta_arrow_button">
|
|
<img src={arrow} alt="" />
|
|
</div>
|
|
</a>
|
|
)}
|
|
</div>
|
|
</>
|
|
);
|
|
}
|