Skip to content
Snippets Groups Projects
Commit e5cd5c09 authored by Matt Kirby's avatar Matt Kirby
Browse files

Added registration page

parent 18d35560
No related branches found
No related tags found
No related merge requests found
import BasicField from "@/components/form/basicField";
import NavBar from "@/components/navigation/NavBar";
import { LockClosedIcon } from "@heroicons/react/24/outline";
import { useEffect, useState } from "react";
const Register = () => {
const [username, setUsername] = useState<string>("");
const [email, setEmail] = useState<string>("");
const [password, setPassword] = useState<string>("");
const [passwordConfirmation, setPasswordConfirmation] = useState<string>("");
const handleSubmit = async (event) => {
event.preventDefault()
const JSONdata = JSON.stringify({
username: username,
email: email,
password: password,
profile: ""
})
const endpoint = '/api/form'
const options = {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSONdata,
}
const response = await fetch(endpoint, options)
const result = await response.json()
alert(`Success: ${result.data}`)
}
return (
<>
<div className="flex min-h-full items-center justify-center px-4 py-12 sm:px-6 lg:px-8">
<div className="w-full max-w-md space-y-8">
<h2 className="mt-6 text-center text-3xl font-bold tracking-tight text-gray-900">
Create an account
</h2>
<p className="mt-2 text-center text-sm text-gray-600">
Or{' '}
<a href="#" className="font-medium text-c-pink hover:text-indigo-500">
log in
</a>
</p>
<form className="mt-8 space-y-6" action="#" method="POST">
<input type="hidden" name="remember" defaultValue="true" />
<div className="rounded-md shadow-sm">
<BasicField name="username" placeholder="Username" onChange={setUsername}/>
<BasicField name="email" placeholder="Email Address" onChange={setEmail}/>
<BasicField name="password" placeholder="Password" onChange={setPassword}/>
<BasicField name="password" placeholder="Confirm Password" onChange={setPasswordConfirmation} error={password === passwordConfirmation ? null : "Confirmation doesn't match"}/>
</div>
<div>
<button
type="submit"
className="group relative flex w-full justify-center rounded-md bg-c-pink px-3 py-2 text-sm font-semibold text-white hover:bg-white hover:text-c-pink hover:border-c-pink focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-c-pink"
>
Sign in
</button>
</div>
</form>
</div>
</div>
</>
)
}
export default Register;
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment