open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Debounce

Browse Source
This commit is contained in:
Ian Philips 2022-06-22 11:43:47 -05:00
parent 3b3717d307
commit a1ea864799
1 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
web/components/filter-select-users.tsx
View File

@ -6,6 +6,7 @@ import clsx from 'clsx'
import { Menu, Transition } from '@headlessui/react' import { Menu, Transition } from '@headlessui/react'
import { Avatar } from 'web/components/avatar' import { Avatar } from 'web/components/avatar'
import { Row } from 'web/components/layout/row' import { Row } from 'web/components/layout/row'
import { debounce } from 'lodash'
export function FilterSelectUsers(props: { export function FilterSelectUsers(props: {
setSelectedUsers: (users: User[]) => void setSelectedUsers: (users: User[]) => void
@ -26,6 +27,8 @@ export function FilterSelectUsers(props: {
user.name.toLowerCase().includes(query.toLowerCase()) user.name.toLowerCase().includes(query.toLowerCase())
) )
}) })
const debouncedQuery = debounce(setQuery, 50)
return ( return (
<div> <div>
<div className="relative mt-1 rounded-md"> <div className="relative mt-1 rounded-md">
@ -37,7 +40,7 @@ export function FilterSelectUsers(props: {
name="user name" name="user name"
id="user name" id="user name"
value={query} value={query}
onChange={(e) => setQuery(e.target.value)} onChange={(e) => debouncedQuery(e.target.value)}
className="input input-bordered block w-full pl-10 focus:border-gray-300 " className="input input-bordered block w-full pl-10 focus:border-gray-300 "
placeholder="Austin Chen" placeholder="Austin Chen"
/> />