1.5 Re-factor a bit more for good

Author: one-aalam

src/lib/utils.ts

@@ -1,12 +1,13 @@
 import { useState } from 'react'
 
-export function useFormFields<T>(initialValues: T): [T, (event: React.ChangeEvent<HTMLInputElement>) => void] {
+export function useFormFields<T>(initialValues: T): [T, (event: React.ChangeEvent<HTMLInputElement>) => void, () => void] {
     const [values, setValues] = useState<T>(initialValues)
     const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
       event.persist();
       const { target } = event;
       const { name, value } = target;
       setValues({ ...values, [name]: value })
     }
-    return [ values, handleChange]
+    const resetForm = () => setValues(initialValues)
+    return [ values, handleChange, resetForm ]
   }

src/pages/index.tsx

@@ -23,12 +23,13 @@ const IndexPage: NextPage<NextAppPageProps> = ({}) => {
   const { loading, signIn, signUp } = useAuth()
   // Now since we have our form ready, what we're gonna need for signing up our users
   // 1. let users provide email and password
-  const [ values, handleChange ] = useFormFields<SignUpFieldProps>(FORM_VALUES)
+  const [ values, handleChange, resetFormFields ] = useFormFields<SignUpFieldProps>(FORM_VALUES)
   // 2. send the provided details to Supabase
 
-  const handleSumbit = (event: React.FormEvent) => {
+  const handleSumbit = async (event: React.FormEvent) => {
     event.preventDefault()
-    isSignIn ?  signIn(values) : signUp(values)
+    isSignIn ?  await signIn(values) : await signUp(values)
+    resetFormFields()
   }
 
   return (