[READ-ONLY] a fast, modern browser for the npm registry

fix: debounce navigation to the search page (#293)

authored by

abeer0 and committed by
GitHub
003f95bc 2ddfa03b

+14 -2
+7 -1
app/components/AppHeader.vue
··· 1 1 <script setup lang="ts"> 2 + import { debounce } from 'perfect-debounce' 3 + 2 4 withDefaults( 3 5 defineProps<{ 4 6 showLogo?: boolean ··· 22 24 return route.name !== 'search' && route.name !== 'index' 23 25 }) 24 26 25 - async function handleSearchInput() { 27 + const debouncedNavigate = debounce(async () => { 26 28 const query = searchQuery.value.trim() 27 29 await router.push({ 28 30 name: 'search', 29 31 query: query ? { q: query } : undefined, 30 32 }) 31 33 searchQuery.value = '' 34 + }, 100) 35 + 36 + async function handleSearchInput() { 37 + debouncedNavigate() 32 38 } 33 39 34 40 onKeyStroke(',', e => {
+7 -1
app/pages/index.vue
··· 1 1 <script setup lang="ts"> 2 + import { debounce } from 'perfect-debounce' 3 + 2 4 const router = useRouter() 3 5 const searchQuery = ref('') 4 6 const searchInputRef = useTemplateRef('searchInputRef') 5 7 const { focused: isSearchFocused } = useFocus(searchInputRef) 6 8 7 - function handleSearch() { 9 + const debouncedNavigate = debounce(() => { 8 10 router.push({ 9 11 path: '/search', 10 12 query: searchQuery.value.trim() ? { q: searchQuery.value.trim() } : undefined, 11 13 }) 14 + }, 250) 15 + 16 + function handleSearch() { 17 + debouncedNavigate() 12 18 } 13 19 14 20 useSeoMeta({