Fix search bar behaviour (step 9)

pvc-vue/src/components/general/VMSearchBar.vue

@@ -186,6 +186,9 @@ onMounted(() => {
     searchText.value = savedSearchText;
   }
   
+  // Load saved filters
+  loadFiltersFromLocalStorage();
+  
   // Initialize input value based on selected VM
   if (!props.showList && (props.selectedVM || props.vmFromUrl)) {
     inputValue.value = props.selectedVM || props.vmFromUrl;
@@ -328,8 +331,11 @@ const clearSearch = () => {
   emit('update:modelValue', '');
   emit('clear');
   
-  // Focus the search input after clearing
+  // Scroll to selected VM after clearing search
   nextTick(() => {
+    scrollToSelectedVM();
+    
+    // Focus the search input after clearing
     const searchInput = document.querySelector('.search-input');
     if (searchInput) {
       searchInput.focus();
@@ -377,6 +383,7 @@ const toggleFilterMenu = () => {
 // Filter toggle
 const handleFilterToggle = (type, value) => {
   appliedFilters.value[type][value] = !appliedFilters.value[type][value];
+  saveFiltersToLocalStorage();
 };
 
 // Reset filters
@@ -387,6 +394,7 @@ const handleResetFilters = () => {
   Object.keys(appliedFilters.value.nodes).forEach(node => {
     appliedFilters.value.nodes[node] = false;
   });
+  saveFiltersToLocalStorage();
   showFilterMenu.value = false;
 };
 
@@ -454,6 +462,9 @@ watch([availableStates, availableNodes], ([states, nodes]) => {
       appliedFilters.value.nodes[node] = false;
     }
   });
+  
+  // Save updated filters
+  saveFiltersToLocalStorage();
 });
 
 // Count active filters
@@ -532,6 +543,27 @@ const scrollToSelectedVM = () => {
     }
   });
 };
+
+// Add localStorage persistence for filters
+const saveFiltersToLocalStorage = () => {
+  localStorage.setItem('vmFilters', JSON.stringify(appliedFilters.value));
+};
+
+const loadFiltersFromLocalStorage = () => {
+  const savedFilters = localStorage.getItem('vmFilters');
+  if (savedFilters) {
+    try {
+      const parsedFilters = JSON.parse(savedFilters);
+      // Merge saved filters with current filters to handle new states/nodes
+      appliedFilters.value = {
+        states: { ...appliedFilters.value.states, ...parsedFilters.states },
+        nodes: { ...appliedFilters.value.nodes, ...parsedFilters.nodes }
+      };
+    } catch (e) {
+      console.error('Error parsing saved filters:', e);
+    }
+  }
+};
 </script>
 
 <style scoped>