129 lines
3.6 KiB
JavaScript
129 lines
3.6 KiB
JavaScript
import { __ } from "@wordpress/i18n";
|
|
import { useBlockProps } from "@wordpress/block-editor";
|
|
|
|
import { useSelect } from "@wordpress/data"; // pour les querry
|
|
import "./editor.scss";
|
|
import { RawHTML } from "@wordpress/element";
|
|
import { useEffect } from "@wordpress/element";
|
|
import { decodeEntities } from "@wordpress/html-entities";
|
|
import OptionsSelectControl from "./OptionsSelectControl";
|
|
|
|
export default function Edit({ attributes, setAttributes }) {
|
|
const { relatedPostId, postType, relatedPostPreviewGhostContent } =
|
|
attributes;
|
|
let currentRelatedPost = useSelect(
|
|
(select) =>
|
|
relatedPostId && postType
|
|
? select("core").getEntityRecord("postType", postType, relatedPostId)
|
|
: null,
|
|
[relatedPostId, postType],
|
|
);
|
|
|
|
// console.log("relatedPostPreviewGhostContent", relatedPostPreviewGhostContent);
|
|
|
|
// useEffect(() => {
|
|
// if (currentRelatedPost?.content?.rendered) {
|
|
// setAttributes({
|
|
// relatedPostPreviewGhostContent: currentRelatedPost.content.rendered,
|
|
// });
|
|
// } else {
|
|
// setAttributes({
|
|
// relatedPostPreviewGhostContent: null,
|
|
// });
|
|
// }
|
|
// }, [currentRelatedPost]);
|
|
|
|
function parseBlockContentForTooltips(editorContent) {
|
|
const parser = new DOMParser();
|
|
const doc = parser.parseFromString(editorContent, "text/html");
|
|
const domTooltipWords = doc.querySelectorAll(".tooltip-word");
|
|
|
|
const filteredTooltipWords = [];
|
|
|
|
// Looping over tooltip words and filtering duplicates
|
|
Array.from(domTooltipWords).forEach((tooltipWord) => {
|
|
const tooltipID = tooltipWord.getAttribute("data-definition-id");
|
|
const tooltipText = tooltipWord.getAttribute("data-tooltip-word");
|
|
const tooltipDefinition = tooltipWord.getAttribute(
|
|
"data-tooltip-definition",
|
|
);
|
|
|
|
const existingTooltip = filteredTooltipWords.find(
|
|
(item) => item.tooltipID === tooltipID,
|
|
);
|
|
|
|
if (!existingTooltip) {
|
|
filteredTooltipWords.push({
|
|
tooltipID,
|
|
tooltipText,
|
|
tooltipDefinition,
|
|
});
|
|
}
|
|
});
|
|
return filteredTooltipWords;
|
|
}
|
|
|
|
useEffect(() => {
|
|
if (currentRelatedPost) {
|
|
const currentBlockTooltips = parseBlockContentForTooltips(
|
|
currentRelatedPost.content.rendered,
|
|
);
|
|
setAttributes({ tooltipsWordsUsed: currentBlockTooltips });
|
|
}
|
|
}, [currentRelatedPost]);
|
|
|
|
// const editedContent = wp.data.select("core/editor").getEditedPostContent();
|
|
// function getContent() {
|
|
// // Récupérer et retourner le contenu personnalisé ici
|
|
// return 'Votre contenu personnalisé';
|
|
// }
|
|
// useEffect(() => {
|
|
// if (!rankMathEditor) return;
|
|
// console.log("rankMathEditor", rankMathEditor);
|
|
// console.log("wp.hooks", wp.hooks);
|
|
// console.log(`editedContent`, editedContent);
|
|
|
|
// wp.hooks.addFilter("rank_math_content", "rank-math", updateContent);
|
|
// function updateContent() {
|
|
// return editedContent;
|
|
// }
|
|
// rankMathEditor.refresh("content");
|
|
// }, [rankMathEditor]);
|
|
|
|
return (
|
|
<>
|
|
<OptionsSelectControl
|
|
relatedPostId={relatedPostId}
|
|
postType={postType}
|
|
setAttributes={setAttributes}
|
|
/>
|
|
|
|
<section
|
|
{...useBlockProps({
|
|
className: `post-content-container`,
|
|
})}
|
|
>
|
|
{!relatedPostId && (
|
|
<>
|
|
<p>
|
|
{__(
|
|
"Ce bloc n'est relié à aucune question. Rattachez-le à une fiche question dans la barre latérale.",
|
|
"homegrade-blocks__texte-backoffice",
|
|
)}
|
|
</p>
|
|
</>
|
|
)}
|
|
|
|
{currentRelatedPost &&
|
|
currentRelatedPost.content &&
|
|
currentRelatedPost.title && (
|
|
<>
|
|
<h3>{decodeEntities(currentRelatedPost.title.rendered)}</h3>
|
|
<RawHTML>{currentRelatedPost.content.rendered}</RawHTML>
|
|
</>
|
|
)}
|
|
</section>
|
|
</>
|
|
);
|
|
}
|