From 46b5b428c1c8e45d7f7ceb2b36809b23fe3e55a5 Mon Sep 17 00:00:00 2001
From: Anthony Hinsinger <anthony.hinsinger@gmail.com>
Date: Tue, 3 Mar 2020 17:25:51 +0100
Subject: [PATCH] Fixed typo

---
 src/web/bookform.ts |  2 +-
 src/web/myhooks.ts  | 16 ++++++++++------
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/web/bookform.ts b/src/web/bookform.ts
index 62626e6..fb1c0c1 100644
--- a/src/web/bookform.ts
+++ b/src/web/bookform.ts
@@ -13,7 +13,7 @@ const schema = yup.object().shape({
 });
 
 const BookForm = () => {
-    const [titleProps, setTitle] = useFormField("author");
+    const [titleProps, setTitle] = useFormField("title");
     const [authorProps, setAuthor] = useFormField("author");
     const [addBook, { loading }] = useMutation(AddBook);
 
diff --git a/src/web/myhooks.ts b/src/web/myhooks.ts
index 2a8522c..2081a83 100644
--- a/src/web/myhooks.ts
+++ b/src/web/myhooks.ts
@@ -1,4 +1,4 @@
-import { useState } from 'haunted';
+import { useState, useCallback } from 'haunted';
 
 type FormField =  [
     {
@@ -7,18 +7,22 @@ type FormField =  [
         '.value': string;
         '@change': (e: any) => void;
     },
-    (value: string) => void
+    ReturnType<typeof useState>[1]
 ];
 
 export const useFormField = (name: string, defaultValue = ""): FormField => {
     const [value, setValue] = useState(defaultValue);
-
-    const changeHandler = (e: any) => {
+    const changeHandler = useCallback((e: any) => {
         setValue(e.target.value);
-    };
+    }, [setValue]);
 
     return [
-        { name, type: "text", '.value': value, '@change': changeHandler },
+        {
+            name,
+            type: "text",
+            '.value': value,
+            '@change': changeHandler
+        },
         setValue
     ];
 };