From 1bfe12a2881c5c48e8e3414aeecf5135413ea7a9 Mon Sep 17 00:00:00 2001
From: Will Miao <13051207myq@gmail.com>
Date: Mon, 17 Mar 2025 17:41:41 +0800
Subject: [PATCH] Add filter button functionality and clean up recipe template
 scripts

- Implemented click handler for the filter button in FilterManager to toggle the filter panel.
- Removed redundant recipe filter manager initialization from recipes.html for cleaner code.
- Updated header.html to remove inline JavaScript for filter button, enhancing maintainability.
---
 static/js/managers/FilterManager.js |  7 +++++++
 templates/components/header.html    |  2 +-
 templates/recipes.html              | 11 -----------
 3 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/static/js/managers/FilterManager.js b/static/js/managers/FilterManager.js
index 5f5ef8ef..36239927 100644
--- a/static/js/managers/FilterManager.js
+++ b/static/js/managers/FilterManager.js
@@ -21,6 +21,13 @@ export class FilterManager {
     initialize() {
         // Create base model filter tags
         this.createBaseModelTags();
+
+        // Add click handler for filter button
+        if (this.filterButton) {
+            this.filterButton.addEventListener('click', () => {
+                this.toggleFilterPanel();
+            });
+        }
         
         // Close filter panel when clicking outside
         document.addEventListener('click', (e) => {
diff --git a/templates/components/header.html b/templates/components/header.html
index 833d6656..7a07dd49 100644
--- a/templates/components/header.html
+++ b/templates/components/header.html
@@ -26,7 +26,7 @@
         <button class="search-options-toggle" id="searchOptionsToggle" title="Search Options">
           <i class="fas fa-sliders-h"></i>
         </button>
-        <button class="search-filter-toggle" id="filterButton" onclick="filterManager.toggleFilterPanel()" title="Filter models">
+        <button class="search-filter-toggle" id="filterButton" title="Filter models">
           <i class="fas fa-filter"></i>
           <span class="filter-badge" id="activeFiltersCount" style="display: none">0</span>
         </button>
diff --git a/templates/recipes.html b/templates/recipes.html
index 181740e1..60b10b5f 100644
--- a/templates/recipes.html
+++ b/templates/recipes.html
@@ -132,17 +132,6 @@
         checkInitStatus();
     </script>
     {% endif %}
-    
-    <!-- Recipe page specific scripts -->
-    <script type="module">
-        import { RecipeFilterManager } from '/loras_static/js/managers/RecipeFilterManager.js';
-        
-        // Initialize the recipe filter manager
-        window.recipeFilterManager = new RecipeFilterManager();
-        
-        // Make it globally available
-        window.filterManager = window.recipeFilterManager; // For compatibility with existing code
-    </script>
 
     <script>
         // Refresh recipes