From 521ee2d2a7950a0689b7552596ef08dc5fbb7fba Mon Sep 17 00:00:00 2001
From: Thad Miller <thad.miller@gmail.com>
Date: Mon, 2 Mar 2026 11:48:10 -0500
Subject: [PATCH] [feat] Clear Filters

---
 src/pages/partials/cards.astro | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/pages/partials/cards.astro b/src/pages/partials/cards.astro
index 598f309..13f0b58 100644
--- a/src/pages/partials/cards.astro
+++ b/src/pages/partials/cards.astro
@@ -122,7 +122,7 @@ const facets = searchResults.results.slice(1).map((result: any) => {
 
     <div id="facetContainer" hx-swap-oob="true">
         <div class="bg-dark sticky-top p-2 d-flex justify-content-end align-items-center">
-            <button type="reset" form="searchform" data-bs-dismiss="offcanvas" class="btn btn-danger me-2">Clear</button>
+            <button type="button" data-bs-dismiss="offcanvas" class="btn btn-danger me-2" id="clear-filters">Clear</button>
             <button type="submit" form="searchform" data-bs-dismiss="offcanvas" class="btn btn-success">Apply Filters</button>
         </div>
         {facets.map((facet) => (
@@ -146,6 +146,8 @@ const facets = searchResults.results.slice(1).map((result: any) => {
     </div>
 
     <script define:vars={{ totalHits, filters, facets }} is:inline>
+
+        // Filter the facet values to make things like Set easier to find
         const facetfilters = document.querySelectorAll('.facet-filter');
         for (const facetfilter of facetfilters) {
             const facetgroup = facetfilter.closest('.facet-group');
@@ -153,13 +155,24 @@ const facets = searchResults.results.slice(1).map((result: any) => {
             const facetitems = facetlist.querySelectorAll('.facet-item');
             facetfilter.addEventListener('input', (e) => {
                 const match = e.target.value.toLowerCase();
-                for (item of facetitems) {
+                for (const item of facetitems) {
                     const text = item.getAttribute('data-facet-value');
                     if (text.includes(match)) item.style.display = ''; // Show
                     else item.style.display = 'none'; // Hide
                 }
             });
         }
+        
+        // Clear all facets and resubmit the form with only the text box
+        const clearfilters = document.getElementById('clear-filters');
+        clearfilters.addEventListener('click', (e) => {
+            const facetContainer = clearfilters.closest('#facetContainer');
+            for (const item of facetContainer.querySelectorAll('input[type=checkbox]')) {
+                item.checked = false;
+            }
+            document.getElementById('searchform').dispatchEvent(new Event('submit', {bubbles:true, cancelable:true}));
+        });
+        
     </script>
 }