diff --git a/resources/css/pages/repertoire-metiers.css b/resources/css/pages/repertoire-metiers.css index 2d8966a..1bb52a7 100644 --- a/resources/css/pages/repertoire-metiers.css +++ b/resources/css/pages/repertoire-metiers.css @@ -20,6 +20,9 @@ p { @apply text-neutral-900 tracking-wide; } + #reset-all-artisans-button { + @apply mt-4 mx-auto; + } } } .card-artisans { diff --git a/resources/js/dynamicSearch.js b/resources/js/dynamicSearch.js index a06206b..ed11269 100644 --- a/resources/js/dynamicSearch.js +++ b/resources/js/dynamicSearch.js @@ -36,6 +36,24 @@ function observeSearchResetButton() { } }); } +function observeResetAllArtisansButton() { + const resetAllArtisansButton = document.querySelector('#reset-all-artisans-button'); + resetAllArtisansButton.addEventListener('click', () => { + resetSearchfield(); + hydrateWithAllArtisans({}); + }); +} +function observeNoResultsApparition() { + const grid = document.querySelector('.artisans-posts__grid'); + + const observer = new MutationObserver(() => { + const noResults = grid.querySelector('.no-results'); + if (!noResults) return; + + observeResetAllArtisansButton(); + }); + observer.observe(grid, { childList: true, subtree: true }); +} function clearAllCheckboxes() { const filtersCheckboxes = document.querySelectorAll('.taxonomy-checkbox'); @@ -219,7 +237,7 @@ export default function dynamicSearch() { }); const searchForm = document.querySelector('.artisan-search-bar'); - searchForm.addEventListener('submit', handleSearchSubmit); observeSearchResetButton(); + observeNoResultsApparition(); // Si la div no-results apparait, on observe le bouton reset all artisans pour gérer son comortement } diff --git a/template-components/artisans/artisan-search-no-results.php b/template-components/artisans/artisan-search-no-results.php index 314a63e..bc8060f 100644 --- a/template-components/artisans/artisan-search-no-results.php +++ b/template-components/artisans/artisan-search-no-results.php @@ -5,4 +5,7 @@ " alt='' />

métiers ou critères pour lancer votre recherche", "metiers-patrimoine-theme") ?>

+ \ No newline at end of file