Closed oskarrough closed 3 years ago
Playing around with our own useForm hook (after talking to the falxa) that removes boilerplate around fetching something async while handling error + loading states.
useForm
Refactored the channel and track forms with it.
Here's an example of how to use the hook:
function ExampleForm({database, apiCall}) { const {form, loading, error, bind, handleSubmit} = useForm( {title: 'Hello World'}, {onSubmit: apiCall} ) return ( <form onSubmit={handleSubmit}> <p> <label htmlFor="title">Title</label> <input id="title" type="text" defaultValue={form.title} required onChange={bind} /> </p> <p> <button type="submit" disabled={loading}> {loading ? 'Loading...' : 'Create track'} </button> </p> <ErrorDisplay error={error}></ErrorDisplay> </form> ) }
Playing around with our own
useForm
hook (after talking to the falxa) that removes boilerplate around fetching something async while handling error + loading states.Refactored the channel and track forms with it.
Here's an example of how to use the hook: