aboutsummaryrefslogtreecommitdiff
path: root/vnext/src/ui/SearchBox.js
diff options
context:
space:
mode:
Diffstat (limited to 'vnext/src/ui/SearchBox.js')
-rw-r--r--vnext/src/ui/SearchBox.js17
1 files changed, 9 insertions, 8 deletions
diff --git a/vnext/src/ui/SearchBox.js b/vnext/src/ui/SearchBox.js
index c79c9e8f..e6085fdc 100644
--- a/vnext/src/ui/SearchBox.js
+++ b/vnext/src/ui/SearchBox.js
@@ -1,4 +1,4 @@
-import { useFormState } from 'react-use-form-state';
+import { useForm } from 'react-hook-form';
/**
* @typedef {Object} SearchBoxPropsFields
@@ -13,15 +13,16 @@ import { useFormState } from 'react-use-form-state';
* @param {SearchBoxProps} props
*/
function SearchBox({ onSearch }) {
- let onSubmit = (/** @type React.FormEvent<HTMLFormElement> */ event) => {
- event.preventDefault();
- onSearch(formState.values.search);
+ const { register, handleSubmit, formState: { errors }, } = useForm();
+ /** @type { import('react-hook-form').SubmitHandler<import('react-hook-form').FieldValues> } */
+ let onSubmit = ( values ) => {
+ onSearch(values.search);
};
- const [formState, { text }] = useFormState();
return (
- <form onSubmit={onSubmit}>
- <input name="search" className="text"
- placeholder="Search..." value={formState.values.search} {...text('search')} />
+ <form onSubmit={handleSubmit(onSubmit)}>
+ <input className="text" type="text"
+ placeholder="Search..." {...register('search')} />
+ <input data-testid="submit" type="submit" hidden />
</form>
);
}