SearchInput: blur on Enter pressed

This commit is contained in:
rektdeckard
2020-08-22 14:59:15 -04:00
parent f854d8e165
commit 24a9662041

View File

@@ -11,7 +11,7 @@ type SearchInputProps = {};
const SearchInput: React.FC<SearchInputProps> = () => { const SearchInput: React.FC<SearchInputProps> = () => {
const [value, setValue] = useState<string>(""); const [value, setValue] = useState<string>("");
const [query, setQuery] = useRecoilState(searchQueryAtom); const [query, setQuery] = useRecoilState(searchQueryAtom);
void(query); void query;
const [isReady] = useDebounce(() => setQuery(value), 250, [value]); const [isReady] = useDebounce(() => setQuery(value), 250, [value]);
@@ -33,6 +33,9 @@ const SearchInput: React.FC<SearchInputProps> = () => {
value={value} value={value}
placeholder="Search" placeholder="Search"
onChange={({ currentTarget }) => setValue(currentTarget.value)} onChange={({ currentTarget }) => setValue(currentTarget.value)}
onKeyPress={({ currentTarget, key }) =>
key === "Enter" && currentTarget.blur()
}
/> />
{value ? ( {value ? (
isReady() ? ( isReady() ? (