diff --git a/src/components/pages/profile/form-profile.tsx b/src/components/pages/profile/form-profile.tsx new file mode 100644 index 0000000..71e5288 --- /dev/null +++ b/src/components/pages/profile/form-profile.tsx @@ -0,0 +1,72 @@ +'use client' + +import { Button } from '@/components/ui/button' +import { + Form, + FormControl, + FormField, + FormItem, + FormMessage, +} from '@/components/ui/form' +import { Input } from '@/components/ui/input' +import { PROFILE_NAME_LENGTH } from '@/constants' +import { classnames } from '@/utils' +import { zodResolver } from '@hookform/resolvers/zod' +import { FC } from 'react' +import { useForm } from 'react-hook-form' +import * as z from 'zod' + +type FormProfileProps = { className?: string } + +const formSchema = z.object({ + profileName: z + .string() + .min(PROFILE_NAME_LENGTH, 'The field must not be empty'), +}) + +const ProfileForm: FC = ({ className }) => { + const form = useForm>({ + defaultValues: { + profileName: '', + }, + resolver: zodResolver(formSchema), + }) + + function onSubmit(values: z.infer) { + alert(JSON.stringify(values)) + console.log(values) + } + + return ( +
+ + ( + + + + + + + )} + /> + + + + ) +} + +export default ProfileForm