feat(search-ui): optimize search UI

web/src/hooks/use-available-tags.ts

@@ -17,7 +17,7 @@
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 
-import { get_top_tags } from '@/api/search/api';
+import { get_tags } from '@/api/search/api';
 import { useQuery } from '@tanstack/react-query';
 import React from 'react';
 
@@ -45,7 +45,7 @@ export function useAvailableTags(): UseAvailableTagsResult {
         refetch,
     } = useQuery<TagCount[]>({
         queryKey: ['all-tags'],
-        queryFn: get_top_tags,
+        queryFn: get_tags,
         staleTime: 60 * 1000,
         retry: false,
         refetchOnWindowFocus: false,

web/src/hooks/use-contacts.ts

@@ -0,0 +1,26 @@
+import { useMemo } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import { get_contacts } from '@/api/search/api';
+
+export const useContacts = (searchTerm: string = "") => {
+    const { data: allContacts = [], isLoading, isError } = useQuery({
+        queryKey: ['contacts', 'all'],
+        queryFn: get_contacts,
+        staleTime: 1000 * 60 * 10,
+        gcTime: 1000 * 60 * 30,
+    });
+
+    const filtered = useMemo(() => {
+        if (!searchTerm) return allContacts;
+        const lower = searchTerm.toLowerCase();
+        return allContacts.filter(email =>
+            email.toLowerCase().includes(lower)
+        );
+    }, [allContacts, searchTerm]);
+
+    return {
+        contacts: filtered,
+        isLoading,
+        isError
+    };
+};

web/src/hooks/use-search-messages.ts

@@ -92,6 +92,7 @@ export function useSearchMessages() {
         setPage,
         onSubmit,
         reset,
-        filter
+        filter,
+        setFilter
     };
 }