handling tooltip words used

blocks/post-content-container/build/block.json

@@ -30,6 +30,10 @@
     },
     "anchor": {
       "type": "string"
+    },
+    "tooltipsWordsUsed": {
+      "type": "array",
+      "default": []
     }
   }
 }

blocks/post-content-container/build/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-html-entities', 'wp-i18n'), 'version' => '3034e2cd7814cf68cba4');
+<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-html-entities', 'wp-i18n'), 'version' => '548c237f02dcdec27f46');

blocks/post-content-container/build/index.js

@@ -176,7 +176,37 @@ function Edit({
     relatedPostId,
     postType
   } = attributes;
+  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;
+  }
   let currentRelatedPost = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => relatedPostId && postType ? select("core").getEntityRecord("postType", postType, relatedPostId) : null, [relatedPostId, postType]);
+  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_5__.useEffect)(() => {
+    if (currentRelatedPost) {
+      const currentBlockTooltips = parseBlockContentForTooltips(currentRelatedPost.content.rendered);
+      setAttributes({
+        tooltipsWordsUsed: currentBlockTooltips
+      });
+    }
+  }, [currentRelatedPost]);
   return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_OptionsSelectControl__WEBPACK_IMPORTED_MODULE_7__["default"], {
     relatedPostId: relatedPostId,
     postType: postType,
@@ -203,15 +233,17 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./style.scss */ "./src/style.scss");
 /* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./edit */ "./src/edit.js");
-/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
+/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./save */ "./src/save.js");
-/* harmony import */ var _transforms__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./transforms */ "./src/transforms.js");
+/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
+/* harmony import */ var _transforms__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./transforms */ "./src/transforms.js");
 
 
 
 
 
 
-(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_4__.name, {
+
+(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_5__.name, {
   icon: {
     src: (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
       xmlns: "http://www.w3.org/2000/svg",
@@ -228,11 +260,40 @@ __webpack_require__.r(__webpack_exports__);
     foreground: "#DF1E1E"
   },
   edit: _edit__WEBPACK_IMPORTED_MODULE_3__["default"],
-  transforms: _transforms__WEBPACK_IMPORTED_MODULE_5__["default"]
+  save: _save__WEBPACK_IMPORTED_MODULE_4__["default"],
+  transforms: _transforms__WEBPACK_IMPORTED_MODULE_6__["default"]
 });
 
 /***/ }),
 
+/***/ "./src/save.js":
+/*!*********************!*\
+  !*** ./src/save.js ***!
+  \*********************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ save)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
+/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
+/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
+
+
+
+function save({
+  attributes,
+  setAttributes
+}) {
+  return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dignissimos reiciendis officiis molestias nostrum necessitatibus, explicabo culpa assumenda quod sit facere. Ullam vitae dignissimos quasi ea amet nisi rerum omnis saepe!"));
+}
+
+/***/ }),
+
 /***/ "./src/transforms.js":
 /*!***************************!*\
   !*** ./src/transforms.js ***!
@@ -383,7 +444,7 @@ module.exports = window["wp"]["i18n"];
   \************************/
 /***/ ((module) => {
 
-module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/post-content-container","version":"0.1.0","title":"Post Container","category":"homegrade-blocks","icon":{"background":"#fff","foreground":"#DF1E1E","src":"feedback"},"description":"Pour intégrer le contenu d\'une page ou d\'un post type","supports":{"anchor":true,"html":false},"textdomain":"homegrade-theme__bloks-texte-fonctionnel","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","render":"file:./render.php","attributes":{"relatedPostId":{"type":"number"},"postType":{"type":"string","default":"questions"},"anchor":{"type":"string"}}}');
+module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/post-content-container","version":"0.1.0","title":"Post Container","category":"homegrade-blocks","icon":{"background":"#fff","foreground":"#DF1E1E","src":"feedback"},"description":"Pour intégrer le contenu d\'une page ou d\'un post type","supports":{"anchor":true,"html":false},"textdomain":"homegrade-theme__bloks-texte-fonctionnel","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","render":"file:./render.php","attributes":{"relatedPostId":{"type":"number"},"postType":{"type":"string","default":"questions"},"anchor":{"type":"string"},"tooltipsWordsUsed":{"type":"array","default":[]}}}');
 
 /***/ })
 

blocks/post-content-container/build/render.php

@@ -9,21 +9,22 @@ $anchor = isset($attributes['anchor']) && !empty($attributes['anchor']) ? esc_ht
 $anchor = isset($attributes['anchor']) && !empty($attributes['anchor']) ? esc_html($attributes['anchor']) : ($relatedPostId ? "post-content-container-" . $relatedPostId : '');
 $content = get_the_content(null, null, $relatedPost);
 
-if ($relatedPost) {
+// if ($relatedPost) {
-	// Temporarily set up the global post variable so the_content works as expected
+// 	// Temporarily set up the global post variable so the_content works as expected
-	global $post;
+// 	global $post;
-	$post = $relatedPost;
+// 	$post = $relatedPost;
-	setup_postdata($post);
+// 	setup_postdata($post);
 
-	ob_start();
+// 	ob_start();
-	the_content();
+// 	the_content();
-	$content = ob_get_clean();
+// 	$content = ob_get_clean();
-	wp_reset_postdata();
+// 	wp_reset_postdata();
-}
+// }
 ?>
 
 
 <section id="<?php echo $anchor  ?>" class="post-content-container <?php echo $anchor ? "has-custom-anchor" : "" ?>">
 	<h2 class="post-content-container__title"><?php echo $relatedPost->post_title ?></h2>
-	<?php echo $content; ?>
+	<!-- <?php echo $content; ?> -->
+	<?php echo $relatedPost->post_content ?>
 </section>

blocks/post-content-container/src/block.json

@@ -30,6 +30,10 @@
 		},
 		"anchor": {
 			"type": "string"
+		},
+		"tooltipsWordsUsed": {
+			"type": "array",
+			"default": []
 		}
 	}
 }

blocks/post-content-container/src/edit.js

@@ -11,6 +11,36 @@ import OptionsSelectControl from "./OptionsSelectControl";
 export default function Edit({ attributes, setAttributes }) {
 	const { relatedPostId, postType } = attributes;
 
+	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;
+	}
+
 	let currentRelatedPost = useSelect(
 		(select) =>
 			relatedPostId && postType
@@ -19,6 +49,15 @@ export default function Edit({ attributes, setAttributes }) {
 		[relatedPostId, postType],
 	);
 
+	useEffect(() => {
+		if (currentRelatedPost) {
+			const currentBlockTooltips = parseBlockContentForTooltips(
+				currentRelatedPost.content.rendered,
+			);
+			setAttributes({ tooltipsWordsUsed: currentBlockTooltips });
+		}
+	}, [currentRelatedPost]);
+
 	return (
 		<>
 			<OptionsSelectControl

blocks/post-content-container/src/index.js

@@ -3,6 +3,7 @@ import { registerBlockType } from "@wordpress/blocks";
 import "./style.scss";
 
 import Edit from "./edit";
+import save from "./save";
 import metadata from "./block.json";
 import transforms from "./transforms";
 
@@ -27,5 +28,6 @@ registerBlockType(metadata.name, {
 	},
 
 	edit: Edit,
+	save,
 	transforms: transforms,
 });

blocks/post-content-container/src/render.php

@@ -9,21 +9,22 @@ $anchor = isset($attributes['anchor']) && !empty($attributes['anchor']) ? esc_ht
 $anchor = isset($attributes['anchor']) && !empty($attributes['anchor']) ? esc_html($attributes['anchor']) : ($relatedPostId ? "post-content-container-" . $relatedPostId : '');
 $content = get_the_content(null, null, $relatedPost);
 
-if ($relatedPost) {
+// if ($relatedPost) {
-	// Temporarily set up the global post variable so the_content works as expected
+// 	// Temporarily set up the global post variable so the_content works as expected
-	global $post;
+// 	global $post;
-	$post = $relatedPost;
+// 	$post = $relatedPost;
-	setup_postdata($post);
+// 	setup_postdata($post);
 
-	ob_start();
+// 	ob_start();
-	the_content();
+// 	the_content();
-	$content = ob_get_clean();
+// 	$content = ob_get_clean();
-	wp_reset_postdata();
+// 	wp_reset_postdata();
-}
+// }
 ?>
 
 
 <section id="<?php echo $anchor  ?>" class="post-content-container <?php echo $anchor ? "has-custom-anchor" : "" ?>">
 	<h2 class="post-content-container__title"><?php echo $relatedPost->post_title ?></h2>
-	<?php echo $content; ?>
+	<!-- <?php echo $content; ?> -->
+	<?php echo $relatedPost->post_content ?>
 </section>

blocks/post-content-container/src/save.js

@@ -0,0 +1,15 @@
+import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
+import { __ } from "@wordpress/i18n";
+
+export default function save({ attributes, setAttributes }) {
+	return (
+		<>
+			<p>
+				Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dignissimos
+				reiciendis officiis molestias nostrum necessitatibus, explicabo culpa
+				assumenda quod sit facere. Ullam vitae dignissimos quasi ea amet nisi
+				rerum omnis saepe!
+			</p>
+		</>
+	);
+}