fix: improve results handling for algolia search, add types

Author: alex-key

app/composables/npm/search-utils.ts

@@ -1,4 +1,4 @@
-import type { NpmSearchResponse, NpmSearchResult, PackageMetaResponse } from '#shared/types'
+import type { NpmSearchResult, PackageMetaResponse, SearchResponse } from '#shared/types'
 
 export function metaToSearchResult(meta: PackageMetaResponse): NpmSearchResult {
   return {
@@ -20,22 +20,16 @@ export function metaToSearchResult(meta: PackageMetaResponse): NpmSearchResult {
   }
 }
 
-export function emptySearchResponse(): NpmSearchResponse {
+export function emptySearchResponse(): SearchResponse {
   return {
     objects: [],
-    total: 0,
     totalUnlimited: 0,
+    total: 0,
     isStale: false,
     time: new Date().toISOString(),
   }
 }
 
-export interface SearchSuggestion {
-  type: 'user' | 'org'
-  name: string
-  exists: boolean
-}
-
 export type SuggestionIntent = 'user' | 'org' | 'both' | null
 
 export function isValidNpmName(name: string): boolean {

app/composables/npm/useAlgoliaSearch.ts

@@ -3,7 +3,7 @@ import {
   liteClient as algoliasearch,
   type LiteClient,
   type SearchQuery,
-  type SearchResponse,
+  type SearchResponse as AlgoliaSearchResponse,
 } from 'algoliasearch/lite'
 
 let _searchClient: LiteClient | null = null
@@ -157,16 +157,15 @@ export function useAlgoliaSearch() {
       ],
     })
 
-    const response = results[0] as SearchResponse<AlgoliaHit> | undefined
+    const response = results[0] as AlgoliaSearchResponse<AlgoliaHit> | undefined
     if (!response) {
       throw new Error('Algolia returned an empty response')
     }
 
     return {
       isStale: false,
       objects: response.hits.map(hitToSearchResult),
-      totalUnlimited: response.nbHits ?? 0,
-      total: Math.min(SEARCH_ENGINE_HITS_LIMIT.algolia, response.nbHits ?? 0),
+      total: response.nbHits ?? 0,
       time: new Date().toISOString(),
     }
   }
@@ -203,7 +202,7 @@ export function useAlgoliaSearch() {
         ],
       })
 
-      const response = results[0] as SearchResponse<AlgoliaHit> | undefined
+      const response = results[0] as AlgoliaSearchResponse<AlgoliaHit> | undefined
       if (!response) break
 
       serverTotal = response.nbHits ?? 0
@@ -319,36 +318,37 @@ export function useAlgoliaSearch() {
 
     const { results } = await client.search({ requests })
 
-    const mainResponse = results[0] as SearchResponse<AlgoliaHit> | undefined
+    const mainResponse = results[0] as AlgoliaSearchResponse<AlgoliaHit> | undefined
     if (!mainResponse) {
       throw new Error('Algolia returned an empty response')
     }
 
     const searchResult: NpmSearchResponse = {
       isStale: false,
       objects: mainResponse.hits.map(hitToSearchResult),
-      total: Math.min(SEARCH_ENGINE_HITS_LIMIT.algolia, mainResponse.nbHits ?? 0),
-      totalUnlimited: mainResponse.nbHits ?? 0,
+      total: mainResponse.nbHits ?? 0,
       time: new Date().toISOString(),
     }
 
     let orgExists = false
     if (orgQueryIndex >= 0 && checks?.name) {
-      const orgResponse = results[orgQueryIndex] as SearchResponse<AlgoliaHit> | undefined
+      const orgResponse = results[orgQueryIndex] as AlgoliaSearchResponse<AlgoliaHit> | undefined
       const scopePrefix = `@${checks.name.toLowerCase()}/`
       orgExists =
         orgResponse?.hits?.some(h => h.name?.toLowerCase().startsWith(scopePrefix)) ?? false
     }
 
     let userExists = false
     if (userQueryIndex >= 0) {
-      const userResponse = results[userQueryIndex] as SearchResponse<AlgoliaHit> | undefined
+      const userResponse = results[userQueryIndex] as AlgoliaSearchResponse<AlgoliaHit> | undefined
       userExists = (userResponse?.nbHits ?? 0) > 0
     }
 
     let packageExists: boolean | null = null
     if (packageQueryIndex >= 0) {
-      const pkgResponse = results[packageQueryIndex] as SearchResponse<AlgoliaHit> | undefined
+      const pkgResponse = results[packageQueryIndex] as
+        | AlgoliaSearchResponse<AlgoliaHit>
+        | undefined
       packageExists = (pkgResponse?.nbHits ?? 0) > 0
     }
 

app/composables/npm/useSearch.ts

@@ -1,20 +1,21 @@
-import type { NpmSearchResponse, NpmSearchResult, SearchProvider } from '#shared/types'
+import type {
+  NpmSearchResponse,
+  NpmSearchResult,
+  SearchProvider,
+  SearchResponse,
+  SearchResult,
+  SearchSuggestion,
+} from '#shared/types'
 import type { AlgoliaMultiSearchChecks } from './useAlgoliaSearch'
-import { type SearchSuggestion, emptySearchResponse, parseSuggestionIntent } from './search-utils'
+import { emptySearchResponse, parseSuggestionIntent } from './search-utils'
 import { isValidNewPackageName, checkPackageExists } from '~/utils/package-name'
 
 export const SEARCH_ENGINE_HITS_LIMIT: Record<SearchProvider, number> = {
   algolia: 1000,
   npm: 5000,
 } as const
 
-function emptySearchPayload() {
-  return {
-    searchResponse: emptySearchResponse(),
-    suggestions: [] as SearchSuggestion[],
-    packageAvailability: null as { name: string; available: boolean } | null,
-  }
-}
+const DEFAULT_INITIAL_SEARCH_LIMIT = 25
 
 export interface SearchOptions {
   size?: number
@@ -78,6 +79,25 @@ export function useSearch(
     }
   }
 
+  function prepareSearchResponse(response: NpmSearchResponse | SearchResponse): SearchResponse {
+    const totalUnlimited: number =
+      'totalUnlimited' in response ? response.totalUnlimited : response.total
+
+    return {
+      ...response,
+      totalUnlimited,
+      total: Math.min(totalUnlimited, SEARCH_ENGINE_HITS_LIMIT[toValue(searchProvider)]),
+    }
+  }
+
+  function emptySearchPayload(): SearchResult {
+    return {
+      searchResponse: emptySearchResponse(),
+      suggestions: [],
+      packageAvailability: null,
+    }
+  }
+
   /**
    * Determine which extra checks to include in the Algolia multi-search.
    * Returns `undefined` when nothing uncached needs checking.
@@ -166,7 +186,7 @@ export function useSearch(
     suggestionsLoading.value = false
   }
 
-  const asyncData = useLazyAsyncData(
+  const asyncData = useLazyAsyncData<SearchResult>(
     () => `search:${toValue(searchProvider)}:${toValue(query)}`,
     async (_nuxtApp, { signal }) => {
       const q = toValue(query)
@@ -185,7 +205,11 @@ export function useSearch(
 
         if (config.suggestions) {
           suggestionsLoading.value = true
-          const result = await algoliaMultiSearch(q, { size: opts.size ?? 25 }, checks)
+          const result = await algoliaMultiSearch(
+            q,
+            { size: opts.size ?? DEFAULT_INITIAL_SEARCH_LIMIT },
+            checks,
+          )
 
           if (q !== toValue(query)) {
             return emptySearchPayload()
@@ -194,28 +218,32 @@ export function useSearch(
           isRateLimited.value = false
           processAlgoliaChecks(q, checks, result)
           return {
-            searchResponse: result.search,
+            searchResponse: prepareSearchResponse(result.search),
             suggestions: suggestions.value,
             packageAvailability: packageAvailability.value,
           }
         }
 
-        const response = await searchAlgolia(q, { size: opts.size ?? 25 })
+        const response = await searchAlgolia(q, { size: opts.size ?? DEFAULT_INITIAL_SEARCH_LIMIT })
 
         if (q !== toValue(query)) {
           return emptySearchPayload()
         }
 
         isRateLimited.value = false
         return {
-          searchResponse: response,
+          searchResponse: prepareSearchResponse(response),
           suggestions: [],
           packageAvailability: null,
         }
       }
 
       try {
-        const response = await searchNpm(q, { size: opts.size ?? 25 }, signal)
+        const response = await searchNpm(
+          q,
+          { size: opts.size ?? DEFAULT_INITIAL_SEARCH_LIMIT },
+          signal,
+        )
 
         if (q !== toValue(query)) {
           return emptySearchPayload()
@@ -225,7 +253,7 @@ export function useSearch(
 
         isRateLimited.value = false
         return {
-          searchResponse: response,
+          searchResponse: prepareSearchResponse(response),
           suggestions: [],
           packageAvailability: null,
         }
@@ -261,8 +289,7 @@ export function useSearch(
 
     // Seed cache from asyncData for Algolia (which skips cache on initial fetch)
     if (!cache.value && asyncData.data.value) {
-      const { searchResponse } = asyncData.data.value
-      setCache([...searchResponse.objects], searchResponse.total)
+      setCache([...searchResponse.objects], searchResponse.totalUnlimited)
     }
 
     const currentCount = cache.value?.objects.length ?? 0
@@ -326,7 +353,7 @@ export function useSearch(
     },
   )
 
-  const data = computed<NpmSearchResponse | null>(() => {
+  const data = computed<SearchResponse | null>(() => {
     if (cache.value) {
       return {
         isStale: false,
@@ -339,7 +366,7 @@ export function useSearch(
     return asyncData.data.value?.searchResponse ?? null
   })
 
-  const hasMore = computed(() => {
+  const hasMore = computed<boolean>(() => {
     if (!cache.value) return true
     return cache.value.objects.length < cache.value.total
   })

shared/types/npm-registry.ts

@@ -124,11 +124,26 @@ export interface NpmPerson {
 export interface NpmSearchResponse {
   isStale: boolean
   objects: NpmSearchResult[]
-  totalUnlimited?: number
   total: number
   time: string
 }
 
+export interface SearchResponse extends NpmSearchResponse {
+  totalUnlimited: number
+}
+
+export interface SearchSuggestion {
+  type: 'user' | 'org'
+  name: string
+  exists: boolean
+}
+
+export interface SearchResult {
+  searchResponse: SearchResponse
+  suggestions: SearchSuggestion[]
+  packageAvailability: { name: string; available: boolean } | null
+}
+
 export interface NpmSearchResult {
   package: NpmSearchPackage
   score: NpmSearchScore