extending features with custom title integration

blocks/content-page-header/build/block.json

@@ -16,6 +16,13 @@
   "style": "file:./style-index.css",
   "render": "file:./render.php",
   "attributes": {
+    "hasCustomTitle": {
+      "type": "boolean",
+      "default": false
+    },
+    "blockCustomTitle": {
+      "type": "string"
+    },
     "pageHeaderTitle": {
       "type": "string"
     },

blocks/content-page-header/build/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => 'c36bb5ed25b531e20cc1');
+<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => '22ddb6977be933e11cd9');

blocks/content-page-header/build/index.js

@@ -29,11 +29,14 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 function Edit({
   attributes,
   setAttributes
 }) {
   const {
+    blockCustomTitle,
+    hasCustomTitle,
     pageHeaderTitle,
     pageHeaderDescription,
     hasCta,
@@ -52,13 +55,27 @@ function Edit({
       return cover;
     }
   });
+  function onChangeBlockCustomTitle(blockCustomTitle) {
+    setAttributes({
+      blockCustomTitle
+    });
+  }
   function onChangeTitle(newTitle) {
     setAttributes({
       pageHeaderTitle: newTitle
     });
   }
+  function onChangeHasCustomTitle(newHasAutoTitle) {
+    setAttributes({
+      hasCustomTitle: !hasCustomTitle
+    });
+    if (newHasAutoTitle) {
+      setAttributes({
+        blockCustomTitle: undefined
+      });
+    }
+  }
   function onChangeHasCta(newHasCta) {
-    console.log("newHasCta", newHasCta);
     setAttributes({
       hasCta: !hasCta
     });
@@ -92,9 +109,17 @@ function Edit({
       }
     });
   }
+  console.log(blockCustomTitle);
   return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
     className: "homegrade-blocks-content-page-header__panel-cta",
-    title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Call to action", "homegrade-blocks__texte-fonctionnel")
+    title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Titre du bloc", "homegrade-blocks__texte-backoffice")
+  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
+    label: "Titre automatique",
+    checked: !hasCustomTitle,
+    onChange: onChangeHasCustomTitle
+  }), !hasCustomTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tip, null, "Le titre est automatiquement g\xE9n\xE9r\xE9 \xE0 partir du titre de la page")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
+    className: "homegrade-blocks-content-page-header__panel-cta",
+    title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Call to action", "homegrade-blocks__texte-backoffice")
   }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
     label: "Afficher un call to action",
     checked: hasCta,
@@ -105,7 +130,7 @@ function Edit({
     onChange: onChangeTextControl
   }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.__experimentalLinkControl, {
     label: "Lien du cta",
-    title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Call to action", "homegrade-blocks__texte-fonctionnel"),
+    title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Call to action", "homegrade-blocks__texte-backoffice"),
     value: cta,
     onChange: onChangeCTA
   })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
@@ -114,7 +139,12 @@ function Edit({
     })
   }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
     class: "block-content-page-header__content"
-  }, pageTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("h1", null, pageTitle), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.RichText, {
+  }, !hasCustomTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("h1", null, pageTitle), hasCustomTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.RichText, {
+    tagName: "h1",
+    placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter ici le Titre du Bloc Header", "homegrade"),
+    value: blockCustomTitle,
+    onChange: onChangeBlockCustomTitle
+  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.RichText, {
     tagName: "h2",
     placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter ici le Titre du Bloc Header", "homegrade"),
     value: pageHeaderTitle,
@@ -267,7 +297,7 @@ module.exports = window["wp"]["i18n"];
   \************************/
 /***/ ((module) => {
 
-module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/content-page-header","version":"0.1.0","title":"Content page header","category":"homegrade-blocks","icon":"smiley","description":"Bloc bannière/header de contenu de premier niveau pour les pages de contenu","supports":{"html":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","render":"file:./render.php","attributes":{"pageHeaderTitle":{"type":"string"},"pageHeaderDescription":{"type":"string"},"hasCta":{"type":"boolean","default":false},"cta":{"type":"object"}}}');
+module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/content-page-header","version":"0.1.0","title":"Content page header","category":"homegrade-blocks","icon":"smiley","description":"Bloc bannière/header de contenu de premier niveau pour les pages de contenu","supports":{"html":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","render":"file:./render.php","attributes":{"hasCustomTitle":{"type":"boolean","default":false},"blockCustomTitle":{"type":"string"},"pageHeaderTitle":{"type":"string"},"pageHeaderDescription":{"type":"string"},"hasCta":{"type":"boolean","default":false},"cta":{"type":"object"}}}');
 
 /***/ })
 

blocks/content-page-header/build/render.php

@@ -11,7 +11,9 @@ $pageIcon = get_field('page_icon');
 
 <section <?php echo get_block_wrapper_attributes(['class' => 'block-content-page-header']) ?>>
 	<div class="block-content-page-header__content">
+		<?php if (!$attributes['hasCustomTitle']) : ?>
 			<h1><?php echo get_the_title() ?></h1>
+		<?php endif; ?>
 		<h2><?php echo $pageHeaderTitle ?> </h2>
 		<p><?php echo $pageHeaderDescription  ?> </p>
 		<?php if ($cta && $cta['title'] && $cta['url']) : ?>

blocks/content-page-header/src/block.json

@@ -16,6 +16,13 @@
 	"style": "file:./style-index.css",
 	"render": "file:./render.php",
 	"attributes": {
+		"hasCustomTitle": {
+			"type": "boolean",
+			"default": false
+		},
+		"blockCustomTitle": {
+			"type": "string"
+		},
 		"pageHeaderTitle": {
 			"type": "string"
 		},

blocks/content-page-header/src/edit.js

@@ -9,9 +9,16 @@ import {
 	__experimentalLinkControl as LinkControl,
 } from "@wordpress/block-editor";
 import { PanelBody, TextControl, ToggleControl } from "@wordpress/components";
-
+import { Tip } from "@wordpress/components";
 export default function Edit({ attributes, setAttributes }) {
-	const { pageHeaderTitle, pageHeaderDescription, hasCta, cta } = attributes;
+	const {
+		blockCustomTitle,
+		hasCustomTitle,
+		pageHeaderTitle,
+		pageHeaderDescription,
+		hasCta,
+		cta,
+	} = attributes;
 
 	const pageTitle = useSelect((select) => {
 		const { getEditedPostAttribute } = select("core/editor");
@@ -26,11 +33,19 @@ export default function Edit({ attributes, setAttributes }) {
 		}
 	});
 
+	function onChangeBlockCustomTitle(blockCustomTitle) {
+		setAttributes({ blockCustomTitle });
+	}
 	function onChangeTitle(newTitle) {
 		setAttributes({ pageHeaderTitle: newTitle });
 	}
+	function onChangeHasCustomTitle(newHasAutoTitle) {
+		setAttributes({ hasCustomTitle: !hasCustomTitle });
+		if (newHasAutoTitle) {
+			setAttributes({ blockCustomTitle: undefined });
+		}
+	}
 	function onChangeHasCta(newHasCta) {
-		console.log("newHasCta", newHasCta);
 		setAttributes({ hasCta: !hasCta });
 		if (!newHasCta) {
 			setAttributes({ cta: undefined });
@@ -59,9 +74,25 @@ export default function Edit({ attributes, setAttributes }) {
 		});
 	}
 
+	console.log(blockCustomTitle);
 	return (
 		<>
 			<InspectorControls>
+				<PanelBody
+					className="homegrade-blocks-content-page-header__panel-cta"
+					title={__("Titre du bloc", "homegrade-blocks__texte-backoffice")}
+				>
+					<ToggleControl
+						label="Titre automatique"
+						checked={!hasCustomTitle}
+						onChange={onChangeHasCustomTitle}
+					/>
+					{!hasCustomTitle && (
+						<Tip>
+							Le titre est automatiquement généré à partir du titre de la page
+						</Tip>
+					)}
+				</PanelBody>
 				<PanelBody
 					className="homegrade-blocks-content-page-header__panel-cta"
 					title={__("Call to action", "homegrade-blocks__texte-backoffice")}
@@ -98,7 +129,18 @@ export default function Edit({ attributes, setAttributes }) {
 				})}
 			>
 				<div class="block-content-page-header__content">
-					{pageTitle && <h1>{pageTitle}</h1>}
+					{!hasCustomTitle && <h1>{pageTitle}</h1>}
+					{hasCustomTitle && (
+						<RichText
+							tagName="h1"
+							placeholder={__(
+								"Ajouter ici le Titre du Bloc Header",
+								"homegrade"
+							)}
+							value={blockCustomTitle}
+							onChange={onChangeBlockCustomTitle}
+						/>
+					)}
 
 					<RichText
 						tagName="h2"

blocks/content-page-header/src/render.php

@@ -11,7 +11,9 @@ $pageIcon = get_field('page_icon');
 
 <section <?php echo get_block_wrapper_attributes(['class' => 'block-content-page-header']) ?>>
 	<div class="block-content-page-header__content">
+		<?php if (!$attributes['hasCustomTitle']) : ?>
 			<h1><?php echo get_the_title() ?></h1>
+		<?php endif; ?>
 		<h2><?php echo $pageHeaderTitle ?> </h2>
 		<p><?php echo $pageHeaderDescription  ?> </p>
 		<?php if ($cta && $cta['title'] && $cta['url']) : ?>