diff --git a/frontend/src/app/contact/page.tsx b/frontend/src/app/contact/page.tsx index 2925f20..18c21f8 100644 --- a/frontend/src/app/contact/page.tsx +++ b/frontend/src/app/contact/page.tsx @@ -9,6 +9,8 @@ import Image from "next/image" import Link from "next/link" import { useTranslation } from "@/lib/i18n" +import { ContactForm } from "@/components/contact-form" + export default function ContactPage() { const { t } = useTranslation() @@ -53,8 +55,11 @@ export default function ContactPage() {
- {/* FAQ Section - Main Column */} -
+
+ {/* Contact Form Section */} + + + {/* FAQ Section */}
@@ -111,8 +116,8 @@ export default function ContactPage() {

{t('contact.contactInfo.email')}

- - hello@gohorsejobs.com + + wtf@gohorsejobs.com
@@ -171,7 +176,7 @@ export default function ContactPage() { {t('contact.help.description')}

Enviar Mensagem diff --git a/frontend/src/components/contact-form.tsx b/frontend/src/components/contact-form.tsx new file mode 100644 index 0000000..106b5f2 --- /dev/null +++ b/frontend/src/components/contact-form.tsx @@ -0,0 +1,167 @@ +"use client" + +import { useState } from "react" +import { Button } from "@/components/ui/button" +import { Input } from "@/components/ui/input" +import { Textarea } from "@/components/ui/textarea" +import { Label } from "@/components/ui/label" +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from "@/components/ui/select" +import { ticketsApi } from "@/lib/api" +import { toast } from "sonner" +import { useTranslation } from "@/lib/i18n" +import { motion } from "framer-motion" +import { Send } from "lucide-react" + +export function ContactForm() { + const { t } = useTranslation() + const [loading, setLoading] = useState(false) + const [formData, setFormData] = useState({ + name: "", + email: "", + subject: "", + category: "support", + message: "", + }) + + const handleSubmit = async (e: React.FormEvent) => { + e.preventDefault() + setLoading(true) + + try { + // For public tickets, we might need to include name/email in the subject or message + // if the backend doesn't support guest tickets with these fields directly. + // Assuming ticketsApi.create handles guest info via message or similar if not authenticated. + + const payload = { + subject: formData.subject, + category: formData.category, + priority: "medium", // Default priority + message: `Name: ${formData.name}\nEmail: ${formData.email}\n\n${formData.message}`, + } + + await ticketsApi.create(payload) + + toast.success(t('contact.form.success') || "Mensagem enviada com sucesso! Responderemos em até 72 horas úteis.") + setFormData({ + name: "", + email: "", + subject: "", + category: "support", + message: "", + }) + } catch (error) { + console.error("Error submitting contact form:", error) + toast.error(t('contact.form.error') || "Erro ao enviar mensagem. Tente novamente mais tarde.") + } finally { + setLoading(false) + } + } + + return ( +
+
+
+ +
+

{t('contact.form.title') || "Envie uma Mensagem"}

+
+ +
+
+
+ + setFormData({ ...formData, name: e.target.value })} + /> +
+
+ + setFormData({ ...formData, email: e.target.value })} + /> +
+
+ +
+
+ + setFormData({ ...formData, subject: e.target.value })} + /> +
+
+ + +
+
+ +
+ +