Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save brlafreniere/36da4cf1e5740cf5730e322ad2376a1d to your computer and use it in GitHub Desktop.
Save brlafreniere/36da4cf1e5740cf5730e322ad2376a1d to your computer and use it in GitHub Desktop.
const UserRegistration = (props) => {
const appContext = useContext(AppContext)
const history = useHistory();
const [cookies, setCookie, removeCookie] = useCookies(['auth-token']);
const [messagesCleared, setMessagesCleared] = useState(true)
useEffect(() => {
return () => {
appContext.setStatusMessage({type: null, text: null})
appContext.setErrors(null)
}
})
const registerUser = (event) => {
event.preventDefault()
appContext.setLoaded(false)
let payload = {
first_name: event.target.first_name.value,
last_name: event.target.last_name.value,
email_address: event.target.email_address.value,
password: event.target.password.value }
setMessagesCleared(false)
Users.create(payload)
.then(response => {
setCookie('auth-token', response.jwt)
appContext.setStatusMessage({type: "success", text: "User successfully registered. Redirecting to home page..."})
appContext.setLoaded(true)
})
.catch(error => {
console.log(error.response)
if (error.response.data.messages) { appContext.setErrors(error.response.data.messages) }
appContext.setLoaded(true)
})
}
return (
<form onSubmit={registerUser}>
<div className="form-group">
<label htmlFor="first_name">First Name:</label>
<input name="first_name" type="text" className="form-control" />
</div>
<div className="form-group">
<label htmlFor="last_name">Last Name:</label>
<input name="last_name" type="text" className="form-control" />
</div>
<div className="form-group">
<label htmlFor="email_address">Email Address:</label>
<input name="email_address" type="text" className="form-control" />
</div>
<div className="form-group">
<label htmlFor="password">Password:</label>
<input name="password" type="password" className="form-control" />
</div>
<div className="form-group">
<label htmlFor="password">Confirm Password:</label>
<input name="password" type="password" className="form-control" />
</div>
<div className="form-group">
<input className="btn btn-primary form-control" type="submit" value="Register" />
</div>
</form>
)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment