Highlight the filter if there are selected options

solidusio · Sep 21, 2023 · 8991b30 · 8991b30
1 parent dcf0b25
commit 8991b30
Showing 1 changed file with 9 additions and 0 deletions.
diff --git a/admin/app/components/solidus_admin/ui/table/ransack_filter/component.js b/admin/app/components/solidus_admin/ui/table/ransack_filter/component.js
@@ -6,6 +6,7 @@ export default class extends Controller {
 
   connect() {
     this.setCheckboxesFromUrlParams()
+    this.highlightFilter()
     useClickOutside(this)
   }
 
@@ -59,4 +60,12 @@ export default class extends Controller {
       container.appendChild(checkbox.closest('div'))
     })
   }
+
+  highlightFilter() {
+    const optionIsSelected = this.optionTargets.some((option) => {
+      return option.querySelector("input[type=checkbox]").checked
+    })
+
+    this.summaryTarget.classList.toggle("bg-gray-100", optionIsSelected)
+  }
 }