diff --git a/dashboard/src/components/search-input.tsx b/dashboard/src/components/search-input.tsx index d40dd65..50e2d6a 100644 --- a/dashboard/src/components/search-input.tsx +++ b/dashboard/src/components/search-input.tsx @@ -2,7 +2,7 @@ import { Input } from '@/components/ui/input'; import { useRouter, useSearchParams } from 'next/navigation'; -import { ChangeEvent, HTMLInputTypeAttribute } from 'react'; +import { HTMLInputTypeAttribute, useState } from 'react'; interface SearchInputProps { value: string; @@ -18,9 +18,10 @@ export function SearchInput({ value, placeholder, pageParamKey, queryParamKey, t const router = useRouter(); const params = useSearchParams(); - const onSearchChange = (event: ChangeEvent) => { + const [searchInput, setSearchInput] = useState(value); + + const onSearchChange = (value: string) => { - const value = event.target.value; const newParams = new URLSearchParams(params.toString()); if (value.length < 1) { @@ -34,12 +35,19 @@ export function SearchInput({ value, placeholder, pageParamKey, queryParamKey, t router.replace('?' + newParams.toString()); }; + const handleKeyDown = (event: React.KeyboardEvent) => { + if (event.key === 'Enter') { + onSearchChange(searchInput); + } + }; + return ( + onChange={(e) => setSearchInput(e.target.value)} + onKeyDown={handleKeyDown}/> ); }