From 9bd48005fda1d94a526e36bec256b56add65b28d Mon Sep 17 00:00:00 2001
From: Vitaly Takmazov
Date: Fri, 28 Oct 2022 00:23:40 +0300
Subject: use `react-hook-form` and fix tests

---
 vnext/src/ui/SearchBox.js | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

(limited to 'vnext/src/ui/SearchBox.js')

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>
     );
 }
-- 
cgit v1.2.3