import { emailSignUpSchema, SignUp } from '@/lib/zod/auth-schema'
import { zodResolver } from '@hookform/resolvers/zod'
import { signIn } from 'next-auth/react'
import { FormProvider, SubmitHandler, useForm } from 'react-hook-form'
import { z } from 'zod'
import Button from '../ui/button'
import Input from '../ui/input'
import Label from '../ui/label'
export default function LoginForm() {
const methods = useForm()
const { handleSubmit, register } = useForm<SignUp>({
resolver: zodResolver(emailSignUpSchema),
})
const onSubmit = async (data: SignUp) => {
console.log('loginWithEmail', data)
await signIn('email', {
email: data.email,
callbackUrl: '/dashboard',
})
}
const onErrors = (errors: any) => console.error(errors)
return (
<FormProvider {...methods}>
<form onSubmit={handleSubmit(onSubmit, onErrors)}>
<div className="space-y-6">
<Label htmlFor="email">Email address</Label>
<div className="mt-1">
<Input
id="email"
name="email"
type="email"
autoComplete="email"
required
/>
</div>
<Button
type="submit"
className="flex w-full justify-center"
color="primary"
>
Sign in
</Button>
</div>
</form>
</FormProvider>
)
}
import { emailSignUpSchema, SignUp } from '@/lib/zod/auth-schema'
import { zodResolver } from '@hookform/resolvers/zod'
import { signIn } from 'next-auth/react'
import { FormProvider, SubmitHandler, useForm } from 'react-hook-form'
import { z } from 'zod'
import Button from '../ui/button'
import Input from '../ui/input'
import Label from '../ui/label'
export default function LoginForm() {
const methods = useForm()
const { handleSubmit, register } = useForm<SignUp>({
resolver: zodResolver(emailSignUpSchema),
})
const onSubmit = async (data: SignUp) => {
console.log('loginWithEmail', data)
await signIn('email', {
email: data.email,
callbackUrl: '/dashboard',
})
}
const onErrors = (errors: any) => console.error(errors)
return (
<FormProvider {...methods}>
<form onSubmit={handleSubmit(onSubmit, onErrors)}>
<div className="space-y-6">
<Label htmlFor="email">Email address</Label>
<div className="mt-1">
<Input
id="email"
name="email"
type="email"
autoComplete="email"
required
/>
</div>
<Button
type="submit"
className="flex w-full justify-center"
color="primary"
>
Sign in
</Button>
</div>
</form>
</FormProvider>
)
}