DEV Community

Discussion on: The magic of react-query and supabase

Collapse
 
amodinho profile image
Amo Moloko

Excellent work. 🌟

Only thing I would do differently is to create a resuable function for storing your form state.

You use the following pattern:

//useState declearation
 const [email, setEmail] = useState('')
  const [password, setPassword] = useState('')

  //in the JSX part of the component
          <input 
            type="text" 
            onChange={e => setEmail(e.target.value)}
        />
Enter fullscreen mode Exit fullscreen mode

Which could be upgraded to:

const [formState, setFormState] = useState({})

const updateFormState = (field,value) => {

   const newState = {
        [`${field}`]:value,
       ...formState
      }

     setFormState(newState)
}


    //JSX

      <input 
            type="text" 
            onChange={e => updateFormState("email",e.target.value)}
        />
Enter fullscreen mode Exit fullscreen mode