chore(www): improve search in partners directory (supabase#46390)

In the partner integrations directory, search and find results even
while inputting sub-strings.

For example find Stripe even if you just typed out "str".
Current behaviour is that you need to type full words to match findings.

## Before


https://github.com/user-attachments/assets/d8b0fd2e-ba50-4530-a800-dbecc49e9bc6

## After


https://github.com/user-attachments/assets/cc48a89a-5800-4e97-a29b-e020b1b29476

Author: fsansalvadore

apps/www/lib/marketplaceDb.ts

@@ -101,18 +101,24 @@ export async function listPartnerSlugs(): Promise<string[]> {
 }
 
 async function searchMarketplaceListings(search: string): Promise<Partner[] | null> {
+  const searchTerm = search.trim()
   let query = marketplaceClient.from('listings').select('*').is('publish_marketplace', true)
 
-  if (search.trim()) {
-    query = query.textSearch('listing_tsv', `${search.trim()}`, {
-      type: 'websearch',
-      config: 'english',
-    })
+  if (searchTerm) {
+    const searchPattern = `%${searchTerm}%`
+    query = query.or(
+      `title.ilike.${searchPattern},description.ilike.${searchPattern},partner_name.ilike.${searchPattern}`
+    )
   }
 
-  const { data } = await query
+  const { data, error } = await query
 
-  return data?.map(toPartner) ?? null
+  if (error) {
+    console.error('Marketplace search error:', error)
+    return null
+  }
+
+  return data?.map(toPartner) ?? []
 }
 
 /**
@@ -122,23 +128,27 @@ export async function searchPartners(search: string): Promise<Partner[] | null>
   if (isUseMarketplaceDb) {
     return searchMarketplaceListings(search)
   } else {
+    const searchTerm = search.trim()
     let query = supabase
       .from('partners')
       .select('*')
       .eq('approved', true)
       .order('category')
       .order('title')
 
-    if (search.trim()) {
-      query = query.textSearch('tsv', `${search.trim()}`, {
-        type: 'websearch',
-        config: 'english',
-      })
+    if (searchTerm) {
+      const searchPattern = `%${searchTerm}%`
+      query = query.or(`title.ilike.${searchPattern},description.ilike.${searchPattern}`)
     }
 
-    const { data: partners } = await query
+    const { data: partners, error } = await query
+
+    if (error) {
+      console.error('Partners search error:', error)
+      return null
+    }
 
-    return partners?.map(miscDbToPartner) ?? null
+    return partners?.map(miscDbToPartner) ?? []
   }
 }
 

apps/www/pages/partners/integrations/index.tsx

@@ -7,7 +7,7 @@ import { type Category, type Partner } from '~/types/partners'
 import { Loader, Search } from 'lucide-react'
 import { NextSeo } from 'next-seo'
 import { useRouter } from 'next/router'
-import { useEffect, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import { InputGroup, InputGroupAddon, InputGroupInput } from 'ui'
 import { useDebounce } from 'use-debounce'
 
@@ -51,6 +51,7 @@ function IntegrationPartnersPage(props: Props) {
   const [search, setSearch] = useState('')
   const [debouncedSearchTerm] = useDebounce(search, 300)
   const [isSearching, setIsSearching] = useState(false)
+  const searchIdRef = useRef(0)
 
   useEffect(() => {
     if (debouncedSearchTerm.trim() === '') {
@@ -60,13 +61,24 @@ function IntegrationPartnersPage(props: Props) {
     }
 
     setIsSearching(true)
-    searchPartners(debouncedSearchTerm).then((partners) => {
-      if (partners) {
-        setPartners(partners)
-      }
+    const currentSearchId = ++searchIdRef.current
 
-      setIsSearching(false)
-    })
+    searchPartners(debouncedSearchTerm)
+      .then((results) => {
+        if (currentSearchId === searchIdRef.current) {
+          setPartners(results ?? [])
+        }
+      })
+      .catch(() => {
+        if (currentSearchId === searchIdRef.current) {
+          setPartners([])
+        }
+      })
+      .finally(() => {
+        if (currentSearchId === searchIdRef.current) {
+          setIsSearching(false)
+        }
+      })
   }, [debouncedSearchTerm, initialPartners])
 
   return (