fixing open/close accordions

resources/js/accordeon.js

@@ -20,6 +20,16 @@ function closeAccordion(detailTag) {
     detailTag.removeAttribute('open');
   }, 300);
 }
+function openAllAccordions(detailTags) {
+  Array.from(detailTags).forEach((detailTag) => {
+    openAccordion(detailTag);
+  });
+}
+function closeAllAccordions(detailTags) {
+  Array.from(detailTags).forEach((detailTag) => {
+    closeAccordion(detailTag);
+  });
+}
 
 function handleAccordeonClick(detailTag) {
   let isOpen = detailTag.getAttribute('open');
@@ -46,3 +56,11 @@ export default function accordeonInit() {
     });
   });
 }
+
+export {
+  openAccordion,
+  closeAccordion,
+  openAllAccordions,
+  closeAllAccordions,
+  handleAccordeonClick,
+};

resources/js/taxonomy-thematique-(faq).js

@@ -1,3 +1,5 @@
+import { openAllAccordions, closeAllAccordions } from './accordeon.js';
+
 // ##################################
 // ### HANDLE FILTER SUBMENU TOGGLE
 // ##################################
@@ -68,40 +70,26 @@ function closeSubMenuFilters() {
 // ###########################
 // ### DETAILS DEPLOY / CLOSE
 // ###########################
-function handleDeployDetails() {
+function handleDeployCloseAllDetails() {
   const deployAllButton = document.querySelector('.filters-toolbar__action-button--deploy-all');
   const closeAllButton = document.querySelector('.filters-toolbar__action-button--close-all');
+  const detailsContainers = document.querySelectorAll('details');
 
   if (!deployAllButton) return;
 
   deployAllButton.addEventListener('click', () => {
-    deployAllDetails();
+    openAllAccordions(detailsContainers);
     deployAllButton.setAttribute('hidden', true);
     closeAllButton.removeAttribute('hidden');
   });
 
+  if (!closeAllButton) return;
   closeAllButton.addEventListener('click', () => {
-    closeAllDetails();
+    closeAllAccordions(detailsContainers);
     closeAllButton.setAttribute('hidden', true);
     deployAllButton.removeAttribute('hidden');
   });
 }
-function deployAllDetails() {
-  const detailsContainers = document.querySelectorAll('details');
-  if (!detailsContainers) return;
-
-  detailsContainers.forEach((details) => {
-    details.open = true;
-  });
-}
-function closeAllDetails() {
-  const detailsContainers = document.querySelectorAll('details');
-  if (!detailsContainers) return;
-
-  detailsContainers.forEach((details) => {
-    details.open = false;
-  });
-}
 
 // #################################
 // ### UPDATE RESULTS AND DISPLAY
@@ -292,7 +280,7 @@ async function hydrateAllQuestions(CurrentMainParentThematiqueId) {
 export default async function taxonomyThematiqueFaqInit() {
   const faqFiltersToolbar = document.querySelector('.filters-toolbar--faq');
   if (!faqFiltersToolbar) return;
-  handleDeployDetails();
+  handleDeployCloseAllDetails();
   handleFilterPosts();
   handleSubmenuToggle();
 }