Invited users want to be able to initialize their account which they can do through sign up.
Implement the Figma design to sign up an invited user and connect it to the backend authentication system.
Important notes ->
currently, there exists a /api/users/register endpoint. Do not use this. It was a temporarily fix for development purposes.
Requirements
The signup page will exist in pages/signup.jsx at the route /signup
The signup page should have a link to /login
Users have two options for sign up: Google or Credentials (email + password)
Credentials ->
Users will be required to input their name, email, password, and confirmed password in the sign up form
Perform client-side validation on these inputs using Zod and display appropriate errors according to the design
password should have a min of 8 characters
email should be an email
trim any whitespace from name
password must equal confirmed password
On submission, call the signIn("credentials", {name, email, password, callbackUrl: "/dogs" }) NextAuth client api and be sure to check if it returns errors in which case you will want to display them in a toast using react-hot-toast (already setup and installed in our repo)
Google ->
once clicked, call signIn("google", { callbackUrl: "/dogs" }) and be sure to check if it returns errors in which case you will want to display them using a toast
Description
Invited users want to be able to initialize their account which they can do through sign up.
Implement the Figma design to sign up an invited user and connect it to the backend authentication system.
Important notes ->
/api/users/registerendpoint. Do not use this. It was a temporarily fix for development purposes.Requirements
pages/signup.jsxat the route/signup/loginCredentials ->
name,email,password, and confirmed password in the sign up formsignIn("credentials", {name, email, password, callbackUrl: "/dogs" })NextAuth client api and be sure to check if it returns errors in which case you will want to display them in a toast usingreact-hot-toast(already setup and installed in our repo)Google ->
signIn("google", { callbackUrl: "/dogs" })and be sure to check if it returns errors in which case you will want to display them using a toastAcceptance Criteria
Other Notes