From e744f278a293ab230bc1c7190bd18f3a43f6a161 Mon Sep 17 00:00:00 2001
From: Vordgi <sasha2822222@gmail.com>
Date: Wed, 11 Feb 2026 19:31:00 +0000
Subject: [PATCH] fix: missed input parts on quick search

---
 app/components/Header/SearchBox.vue     | 18 +-----------------
 app/composables/useGlobalSearchQuery.ts | 16 ++++++++++++++++
 app/pages/index.vue                     |  2 +-
 app/pages/search.vue                    |  4 ++--
 4 files changed, 20 insertions(+), 20 deletions(-)
 create mode 100644 app/composables/useGlobalSearchQuery.ts

diff --git a/app/components/Header/SearchBox.vue b/app/components/Header/SearchBox.vue
index d9b5adf4d..fe40f4696 100644
--- a/app/components/Header/SearchBox.vue
+++ b/app/components/Header/SearchBox.vue
@@ -28,8 +28,7 @@ const showSearchBar = computed(() => {
   return route.name !== 'index'
 })
 
-// Local input value (updates immediately as user types)
-const searchQuery = shallowRef(normalizeSearchParam(route.query.q))
+const searchQuery = useGlobalSearchQuery()
 
 // Pages that have their own local filter using ?q
 const pagesWithLocalFilter = new Set(['~username', 'org'])
@@ -75,21 +74,6 @@ watch(searchQuery, value => {
   updateUrlQuery(value)
 })
 
-// Sync input with URL when navigating (e.g., back button)
-watch(
-  () => route.query.q,
-  urlQuery => {
-    // Don't sync from pages that use ?q for local filtering
-    if (pagesWithLocalFilter.has(route.name as string)) {
-      return
-    }
-    const value = normalizeSearchParam(urlQuery)
-    if (searchQuery.value !== value) {
-      searchQuery.value = value
-    }
-  },
-)
-
 function handleSubmit() {
   if (pagesWithLocalFilter.has(route.name as string)) {
     router.push({
diff --git a/app/composables/useGlobalSearchQuery.ts b/app/composables/useGlobalSearchQuery.ts
new file mode 100644
index 000000000..51f5b7d2d
--- /dev/null
+++ b/app/composables/useGlobalSearchQuery.ts
@@ -0,0 +1,16 @@
+import { normalizeSearchParam } from '#shared/utils/url'
+
+export function useGlobalSearchQuery() {
+  const route = useRoute()
+  const searchQuery = useState<string>('search-query', () => normalizeSearchParam(route.query.q))
+
+  // clean search input when navigating away from search page
+  watch(
+    () => route.query.q,
+    urlQuery => {
+      const value = normalizeSearchParam(urlQuery)
+      if (!value) searchQuery.value = ''
+    },
+  )
+  return searchQuery
+}
diff --git a/app/pages/index.vue b/app/pages/index.vue
index 897888a27..35d01f08b 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -4,7 +4,7 @@ import { SHOWCASED_FRAMEWORKS } from '~/utils/frameworks'
 
 const { searchProvider } = useSearchProvider()
 
-const searchQuery = shallowRef('')
+const searchQuery = useGlobalSearchQuery()
 const isSearchFocused = shallowRef(false)
 
 async function search() {
diff --git a/app/pages/search.vue b/app/pages/search.vue
index ca4c63f92..b1d73029b 100644
--- a/app/pages/search.vue
+++ b/app/pages/search.vue
@@ -38,8 +38,8 @@ const updateUrlPage = debounce((page: number) => {
   })
 }, 500)
 
-// The actual search query (from URL, used for API calls)
-const query = computed(() => normalizeSearchParam(route.query.q))
+const searchQuery = useGlobalSearchQuery()
+const query = computed(() => searchQuery.value)
 
 // Track if page just loaded (for hiding "Searching..." during view transition)
 const hasInteracted = shallowRef(false)