add lookup

apps/admin.saladeaula.digital/app/routes/_.$orgid.courses._index/route.tsx

@@ -5,8 +5,6 @@ import { AwardIcon, BanIcon, LaptopIcon } from 'lucide-react'
 import { Suspense, useMemo } from 'react'
 import { Await, useSearchParams } from 'react-router'
 
-import placeholder from '@/assets/placeholder.webp'
-
 import { SearchForm } from '@repo/ui/components/search-form'
 import { Skeleton } from '@repo/ui/components/skeleton'
 import {
@@ -27,6 +25,8 @@ import { cn } from '@repo/ui/lib/utils'
 import { createSearch } from '@repo/util/meili'
 import { request as req } from '@repo/util/request'
 
+import placeholder from '@/assets/placeholder.webp'
+
 type Cert = {
   exp_interval: number
 }
@@ -61,7 +61,7 @@ export async function loader({ context, request, params }: Route.LoaderArgs) {
     url: `/orgs/${params.orgid}/custom-pricing`,
     context,
     request
-  }).then((r) => r.json())
+  }).then((r) => r.json() as Promise<{ items: CustomPricing[] }>)
 
   return {
     data: Promise.all([courses, customPricing])
@@ -70,7 +70,7 @@ export async function loader({ context, request, params }: Route.LoaderArgs) {
 
 export default function Route({ loaderData: { data } }: Route.ComponentProps) {
   const [searchParams, setSearchParams] = useSearchParams()
-  const term = searchParams.get('term') as string
+  const s = searchParams.get('s') as string
 
   return (
     <Suspense fallback={<Skeleton />}>
@@ -96,17 +96,15 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
                         pesquisar
                       </>
                     }
-                    defaultValue={term}
-                    onChange={(term) => {
-                      setSearchParams({ term })
+                    defaultValue={s}
+                    onChange={(s) => {
+                      setSearchParams({ s: String(s) })
                     }}
                   />
                 </div>
               </div>
 
-              <div className="grid lg:grid-cols-3 xl:grid-cols-4 gap-5">
-                <List term={term} hits={hits} customPricing={items} />
-              </div>
+              <List s={s} hits={hits as Course[]} customPricing={items} />
             </>
           )
         }}
@@ -116,11 +114,11 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
 }
 
 function List({
-  term,
+  s,
   hits = [],
   customPricing = []
 }: {
-  term: string
+  s: string
   hits: Course[]
   customPricing: CustomPricing[]
 }) {
@@ -133,12 +131,12 @@ function List({
   }, [hits])
 
   const hits_ = useMemo(() => {
-    if (!term) {
+    if (!s) {
       return hits
     }
 
-    return fuse.search(term).map(({ item }) => item)
-  }, [term, fuse, hits])
+    return fuse.search(s).map(({ item }) => item)
+  }, [s, fuse, hits])
 
   const customPricingMap = new Map(
     customPricing.map((x) => {
@@ -149,29 +147,35 @@ function List({
 
   if (hits_.length === 0) {
     return (
-      <Empty>
+      <Empty className="border border-dashed">
         <EmptyHeader>
           <EmptyMedia variant="icon">
             <BanIcon />
           </EmptyMedia>
           <EmptyTitle>Nada encontrado</EmptyTitle>
           <EmptyDescription>
-            Nenhum resultado para <mark>{term}</mark>.
+            Nenhum resultado para <mark>{s}</mark>.
           </EmptyDescription>
         </EmptyHeader>
       </Empty>
     )
   }
 
-  return hits_.map((props: Course, idx) => {
-    return (
-      <Course
-        key={idx}
-        custom_pricing={customPricingMap.get(props.id)}
-        {...props}
-      />
-    )
-  })
+  return (
+    <div className="grid lg:grid-cols-3 xl:grid-cols-4 gap-5">
+      {hits_
+        .filter(({ metadata__unit_price = 0 }) => metadata__unit_price > 0)
+        .map((props: Course, idx) => {
+          return (
+            <Course
+              key={idx}
+              custom_pricing={customPricingMap.get(props.id)}
+              {...props}
+            />
+          )
+        })}
+    </div>
+  )
 }
 
 function Course({