import type { NextPage } from "next"; import Head from "next/head"; import Link from "next/link"; import { z } from "zod/v4"; import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage, } from "~/components/custom_ui/form"; import Input from "~/components/custom_ui/input"; import { Textarea } from "~/components/custom_ui/textarea"; import { useZodForm } from "~/lib/zodForm"; import { DualInputLayout } from "~/components/custom_ui/inputLayouts"; import { api } from "~/utils/api"; import { useTranslation } from "~/providers/I18nProvider"; import { CheckCircle } from "lucide-react"; import { useState } from "react"; import { Checkbox } from "~/components/ui/checkbox"; import { PhoneInput } from "~/components/phone-input"; const Contatto: NextPage = () => { const { locale, t } = useTranslation(); const [hasSent, setHasSent] = useState(false); const ContactFormSchema = z.object({ nome: z.string().nonempty("Inserisci un nome valido"), cognome: z.string().nonempty("Inserisci un cognome valido"), email: z.email(), messaggio: z.string().nonempty("Inserisci un messaggio"), numero: z.string().nonempty("Inserisci un numero di telefono"), checkbox: z.boolean().refine((val) => val === false), // Honeypot field }); const form = useZodForm(ContactFormSchema, { defaultValues: { nome: "", cognome: "", email: "", messaggio: "", numero: "", checkbox: false, // Honeypot field }, }); const { mutate: contactMutation } = api.contact.postContact.useMutation({ onSuccess: () => { setHasSent(true); form.reset(); }, }); const onSubmit = (data: z.infer) => { contactMutation({ nome: data.nome, cognome: data.cognome, email: data.email, messaggio: data.messaggio, telefono: data.numero, }); }; z.config(z.locales[locale]()); return ( <> {t.heads.contatti_titolo}
{t.contatti}

{t.contact_form.titolo}

{t.contact_form.sottotitolo1}{" "} {t.contact_form.sottotitolo2} {" "} {t.contact_form.sottotitolo3}

{hasSent ? ( ) : (
(
{t.contact_form.nome}
)} /> } children2={ (
{t.contact_form.cognome}
)} /> } /> (
{t.contact_form.email}
)} /> (
{t.contact_form.telefono}
)} /> (
{t.contact_form.messaggio}