From a7b4327ee382d5f812f388994efae94af649dc01 Mon Sep 17 00:00:00 2001
From: Antoine M <antoine.martinon@deligraph.com>
Date: Tue, 3 Oct 2023 10:38:12 +0200
Subject: [PATCH] fixing focus problem on chapterindex

---
 css/app.css                                  |  5 ++++-
 js/app.js                                    | 17 ++---------------
 resources/css/blocks/vocabulaire-summary.css |  4 ++--
 resources/js/single-conseil.js               | 19 ++-----------------
 single-conseils.php                          |  8 +++++++-
 5 files changed, 17 insertions(+), 36 deletions(-)

diff --git a/css/app.css b/css/app.css
index dd19554..a2bc101 100644
--- a/css/app.css
+++ b/css/app.css
@@ -4641,10 +4641,13 @@ article > *:not(.entry-content, .chapter-header-block),
 }
 
 .homegrade-blocks-vocabulaire-summary__title, 
-  .homegrade-blocks-vocabulaire-summary h3 {
+  .homegrade-blocks-vocabulaire-summary h2 {
+  margin-top: 0px;
+  margin-bottom: 0px;
   padding-bottom: 1.5rem;
   font-size: 1.875rem;
   line-height: 2.25rem;
+  font-weight: 700;
   --tw-text-opacity: 1 !important;
   color: rgb(0 0 0 / var(--tw-text-opacity)) !important;
   /* color: red !important; */
diff --git a/js/app.js b/js/app.js
index 245a299..07a2616 100644
--- a/js/app.js
+++ b/js/app.js
@@ -247,28 +247,15 @@
       return;
     let chapterIndex = document.querySelector(".chapter_index");
     let questionBlocks = document.querySelectorAll(".questions-container-block");
-    function handleLinksBehavior() {
-      let chapterLinks2 = document.querySelectorAll(".chapter_index__link");
-      chapterLinks2.forEach((link) => {
-        link.addEventListener("click", (e) => {
-          e.preventDefault();
-          let target = e.target.getAttribute("href");
-          let targetBlock = document.querySelector(target);
-          targetBlock.scrollIntoView({
-            behavior: "smooth"
-          });
-          targetBlock.focus();
-        });
-      });
-    }
     function handleLinkScrollToTarget(e) {
       e.preventDefault();
       let target = e.target.getAttribute("href");
       let targetBlock = document.querySelector(target);
+      targetBlock.setAttribute("tabindex", "0");
       targetBlock.scrollIntoView({
         behavior: "smooth"
       });
-      targetBlock.focus();
+      targetBlock.focus({ preventScroll: true });
     }
     function handleChapterIndicatorPosition(targetPosition) {
       let chapterIndicator = document.querySelector(".chapter_index__position-indicator");
diff --git a/resources/css/blocks/vocabulaire-summary.css b/resources/css/blocks/vocabulaire-summary.css
index 56f166b..8baa024 100644
--- a/resources/css/blocks/vocabulaire-summary.css
+++ b/resources/css/blocks/vocabulaire-summary.css
@@ -5,8 +5,8 @@
   }
 
   &__title,
-  h3 {
-    @apply text-3xl !text-black pb-6;
+  h2 {
+    @apply text-3xl !text-black pb-6 font-bold my-0;
     /* color: red !important; */
   }
   &__content {
diff --git a/resources/js/single-conseil.js b/resources/js/single-conseil.js
index a593bb4..a372575 100644
--- a/resources/js/single-conseil.js
+++ b/resources/js/single-conseil.js
@@ -5,31 +5,16 @@ export default function singleConseil() {
   let chapterIndex = document.querySelector('.chapter_index');
   let questionBlocks = document.querySelectorAll('.questions-container-block');
 
-  function handleLinksBehavior() {
-    let chapterLinks = document.querySelectorAll('.chapter_index__link');
-
-    chapterLinks.forEach((link) => {
-      link.addEventListener('click', (e) => {
-        e.preventDefault();
-        let target = e.target.getAttribute('href');
-        let targetBlock = document.querySelector(target);
-
-        targetBlock.scrollIntoView({
-          behavior: 'smooth',
-        });
-        targetBlock.focus();
-      });
-    });
-  }
   function handleLinkScrollToTarget(e) {
     e.preventDefault();
     let target = e.target.getAttribute('href');
     let targetBlock = document.querySelector(target);
 
+    targetBlock.setAttribute('tabindex', '0');
     targetBlock.scrollIntoView({
       behavior: 'smooth',
     });
-    targetBlock.focus();
+    targetBlock.focus({ preventScroll: true });
   }
   function handleChapterIndicatorPosition(targetPosition) {
     let chapterIndicator = document.querySelector('.chapter_index__position-indicator');
diff --git a/single-conseils.php b/single-conseils.php
index 373881f..36aa20b 100644
--- a/single-conseils.php
+++ b/single-conseils.php
@@ -5,7 +5,6 @@ function build_chapter_index($blocks)
 	$chapterBlockIndex  = [];
 	foreach ($blocks as $key => $block) {
 		if ($block['blockName'] == 'homegrade-content-blocks/questions-container') {
-			// array_push($chapterBlockIndex, $block['attrs']['relatedPostId']);
 			array_push($chapterBlockIndex, [
 				'block-type' =>  $block['blockName'],
 				'anchor' => '#questions-container-' . $block['attrs']['relatedPostId'],
@@ -19,6 +18,13 @@ function build_chapter_index($blocks)
 				'title' => "Vocabulaire" . " " . get_the_terms(get_the_ID(), "thematiques")[0]->name,
 			]);
 		}
+		if ($block['blockName'] == 'homegrade-content-blocks/plus-loin') {
+			array_push($chapterBlockIndex, [
+				'block-type' =>  $block['blockName'],
+				'anchor' => "#aller-plus-loin",
+				'title' => __("Pour aller plus loin", "homegrade-blocks__texte-fonctionnel"),
+			]);
+		}
 	}
 	return $chapterBlockIndex;
 }