fix

apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.add/course-picker.tsx

@@ -62,27 +62,29 @@ export const CoursePicker = forwardRef<HTMLInputElement, CoursePickerProps>(
     const [open, { set }] = useToggle()
     const [sort, { toggle }] = useToggle('a-z', 'z-a')
     const fuse = useMemo(() => {
-      const hits_ = hits.map((item) => ({
+      return new Fuse(hits, {
-        ...item,
+        keys: ['name'],
-        _name: normalize(item.name)
-      }))
-
-      return new Fuse(hits_, {
-        keys: ['_name'],
         threshold: 0.3,
-        includeMatches: true
+        includeMatches: true,
+        getFn: (obj, path) => {
+          const value = obj[path as keyof typeof obj]
+          return typeof value === 'string' ? normalize(value) : value
+        }
       })
     }, [hits])
 
     const filtered = useMemo(() => {
-      const results = !search
+      if (!search) {
-        ? hits
+        return [...hits].sort((a, b) => {
-        : fuse.search(normalize(search)).map(({ item }) => item)
+          const comparison = a.name.localeCompare(b.name)
+          return sort === 'a-z' ? comparison : -comparison
+        })
+      }
 
-      return results.sort((a, b) => {
+      return fuse.search(search).map(({ item, matches }) => ({
-        const comparison = a.name.localeCompare(b.name)
+        ...item,
-        return sort === 'a-z' ? comparison : -comparison
+        matches
-      })
+      }))
     }, [search, fuse, hits, sort])
 
     return (
@@ -124,6 +126,7 @@ export const CoursePicker = forwardRef<HTMLInputElement, CoursePickerProps>(
                   tabIndex={-1}
                   className="cursor-pointer text-muted-foreground hover:text-accent-foreground"
                   onClick={toggle}
+                  disabled={search.length > 0}
                 >
                   {sort == 'a-z' ? <ArrowDownAZIcon /> : <ArrowUpAZIcon />}
                 </Button>
@@ -143,31 +146,34 @@ export const CoursePicker = forwardRef<HTMLInputElement, CoursePickerProps>(
                       id,
                       name,
                       access_period,
-                      metadata__unit_price: unit_price
+                      metadata__unit_price: unit_price,
-                    }) => (
+                      matches
-                      <CommandItem
+                    }) => {
-                        key={id}
+                      return (
-                        value={id}
+                        <CommandItem
-                        className="cursor-pointer"
+                          key={id}
-                        onSelect={() => {
+                          value={id}
-                          onChange?.({
+                          className="cursor-pointer"
-                            id,
+                          onSelect={() => {
-                            name,
+                            onChange?.({
-                            access_period: Number(access_period),
+                              id,
-                            unit_price: Number(unit_price)
+                              name,
-                          })
+                              access_period: Number(access_period),
-                          set(false)
+                              unit_price: Number(unit_price)
-                        }}
+                            })
-                      >
+                            set(false)
-                        {name}
+                          }}
-                        <CheckIcon
+                        >
-                          className={cn(
+                          {name}
-                            'ml-auto',
+                          <CheckIcon
-                            value?.id === id ? 'opacity-100' : 'opacity-0'
+                            className={cn(
-                          )}
+                              'ml-auto',
-                        />
+                              value?.id === id ? 'opacity-100' : 'opacity-0'
-                      </CommandItem>
+                            )}
-                    )
+                          />
+                        </CommandItem>
+                      )
+                    }
                   )}
               </CommandGroup>
             </CommandList>