Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 1 addition & 17 deletions app/components/Header/SearchBox.vue
Original file line number Diff line number Diff line change
Expand Up @@ -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'])
Expand Down Expand Up @@ -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({
Expand Down
16 changes: 16 additions & 0 deletions app/composables/useGlobalSearchQuery.ts
Original file line number Diff line number Diff line change
@@ -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
}
2 changes: 1 addition & 1 deletion app/pages/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -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() {
Expand Down
4 changes: 2 additions & 2 deletions app/pages/search.vue
Original file line number Diff line number Diff line change
Expand Up @@ -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)
Expand Down
Loading