feat: add public contact form and update support info

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() {
           </div>
 
           <div className="grid lg:grid-cols-3 gap-8">
-            {/* FAQ Section - Main Column */}
+            <div className="lg:col-span-2 space-y-8">
-            <div className="lg:col-span-2">
+              {/* Contact Form Section */}
+              <ContactForm />
+
+              {/* FAQ Section */}
               <div className="bg-white rounded-2xl shadow-sm p-6 md:p-8">
                 <div className="flex items-center gap-3 mb-6">
                   <div className="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center">
@@ -111,8 +116,8 @@ export default function ContactPage() {
                 <div className="space-y-4">
                   <div>
                     <p className="text-sm text-gray-500 mb-1">{t('contact.contactInfo.email')}</p>
-                    <a href="mailto:hello@gohorsejobs.com" className="text-primary hover:underline font-medium">
+                    <a href="mailto:wtf@gohorsejobs.com" className="text-primary hover:underline font-medium">
-                      hello@gohorsejobs.com
+                      wtf@gohorsejobs.com
                     </a>
                   </div>
                   <div>
@@ -171,7 +176,7 @@ export default function ContactPage() {
                   {t('contact.help.description')}
                 </p>
                 <a
-                  href="mailto:hello@gohorsejobs.com"
+                  href="mailto:wtf@gohorsejobs.com"
                   className="inline-block w-full text-center bg-primary hover:bg-primary/90 text-white font-medium px-4 py-2.5 rounded-lg transition-colors"
                 >
                   Enviar Mensagem

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 (
+        <div className="bg-white rounded-2xl shadow-sm p-6 md:p-8">
+            <div className="flex items-center gap-3 mb-6">
+                <div className="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center">
+                    <Send className="w-5 h-5 text-primary" />
+                </div>
+                <h2 className="text-2xl font-bold text-gray-900">{t('contact.form.title') || "Envie uma Mensagem"}</h2>
+            </div>
+
+            <form onSubmit={handleSubmit} className="space-y-4">
+                <div className="grid md:grid-cols-2 gap-4">
+                    <div className="space-y-2">
+                        <Label htmlFor="name">{t('contact.form.name') || "Nome"}</Label>
+                        <Input
+                            id="name"
+                            required
+                            placeholder={t('contact.form.namePlaceholder') || "Seu nome completo"}
+                            value={formData.name}
+                            onChange={(e) => setFormData({ ...formData, name: e.target.value })}
+                        />
+                    </div>
+                    <div className="space-y-2">
+                        <Label htmlFor="email">{t('contact.form.email') || "E-mail"}</Label>
+                        <Input
+                            id="email"
+                            type="email"
+                            required
+                            placeholder="seu@email.com"
+                            value={formData.email}
+                            onChange={(e) => setFormData({ ...formData, email: e.target.value })}
+                        />
+                    </div>
+                </div>
+
+                <div className="grid md:grid-cols-2 gap-4">
+                    <div className="space-y-2">
+                        <Label htmlFor="subject">{t('contact.form.subject') || "Assunto"}</Label>
+                        <Input
+                            id="subject"
+                            required
+                            placeholder={t('contact.form.subjectPlaceholder') || "No que podemos ajudar?"}
+                            value={formData.subject}
+                            onChange={(e) => setFormData({ ...formData, subject: e.target.value })}
+                        />
+                    </div>
+                    <div className="space-y-2">
+                        <Label htmlFor="category">{t('contact.form.category') || "Categoria"}</Label>
+                        <Select
+                            value={formData.category}
+                            onValueChange={(val) => setFormData({ ...formData, category: val })}
+                        >
+                            <SelectTrigger>
+                                <SelectValue placeholder={t('contact.form.categoryPlaceholder') || "Selecione uma categoria"} />
+                            </SelectTrigger>
+                            <SelectContent>
+                                <SelectItem value="support">{t('tickets.categories.support') || "Suporte"}</SelectItem>
+                                <SelectItem value="bug">{t('tickets.categories.bug') || "Bug / Erro"}</SelectItem>
+                                <SelectItem value="feature">{t('tickets.categories.feature') || "Sugestão"}</SelectItem>
+                                <SelectItem value="billing">{t('tickets.categories.billing') || "Financeiro"}</SelectItem>
+                                <SelectItem value="other">{t('tickets.categories.other') || "Outros"}</SelectItem>
+                            </SelectContent>
+                        </Select>
+                    </div>
+                </div>
+
+                <div className="space-y-2">
+                    <Label htmlFor="message">{t('contact.form.message') || "Mensagem"}</Label>
+                    <Textarea
+                        id="message"
+                        required
+                        placeholder={t('contact.form.messagePlaceholder') || "Descreva sua dúvida ou problema detalhadamente..."}
+                        className="min-h-[150px] resize-none"
+                        value={formData.message}
+                        onChange={(e) => setFormData({ ...formData, message: e.target.value })}
+                    />
+                </div>
+
+                <Button
+                    type="submit"
+                    className="w-full h-12 text-lg font-semibold"
+                    disabled={loading}
+                >
+                    {loading ? (
+                        <motion.div
+                            animate={{ rotate: 360 }}
+                            transition={{ repeat: Infinity, duration: 1, ease: "linear" }}
+                            className="w-6 h-6 border-2 border-white/30 border-t-white rounded-full"
+                        />
+                    ) : (
+                        <>
+                            {t('contact.form.submit') || "Enviar Ticket"}
+                            <Send className="ml-2 w-5 h-5" />
+                        </>
+                    )}
+                </Button>
+                <p className="text-xs text-center text-gray-500 mt-2">
+                    {t('contact.form.disclaimer') || "Responderemos em até 72 horas úteis."}
+                </p>
+            </form>
+        </div>
+    )
+}

frontend/src/i18n/en.json

@@ -147,7 +147,7 @@
       },
       "support": {
         "title": "Support",
-        "description": "Monday to Friday, 9am to 6pm"
+        "description": "Tuesday to Thursday, 10am to 5pm (business days)"
       }
     },
     "faq": {
@@ -183,7 +183,7 @@
         },
         "q8": {
           "q": "How do I contact support?",
-          "a": "You can contact us via email at hello@gohorsejobs.com or by phone at (11) 9999-9999. Our team is available Monday through Friday, from 9 AM to 6 PM."
+          "a": "You can contact us via email at wtf@gohorsejobs.com or by phone at (11) 9999-9999. Our team is available Tuesday through Thursday, from 10 AM to 5 PM. The response time for tickets is 72 business hours."
         }
       }
     },
@@ -192,7 +192,7 @@
       "email": "Email",
       "phone": "Phone",
       "hours": "Business Hours",
-      "hoursValue": "Mon – Fri: 9 AM to 6 PM"
+      "hoursValue": "Tue – Thu: 10 AM to 5 PM (business days)"
     },
     "resources": {
       "title": "Useful Resources",
@@ -205,7 +205,7 @@
     },
     "help": {
       "title": "Need more help?",
-      "description": "Our support team is ready to assist you.",
+      "description": "Our support team is ready to assist you. The response time for tickets is 72 business hours.",
       "button": "Send Message"
     }
   },

frontend/src/i18n/es.json

@@ -147,7 +147,7 @@
       },
       "support": {
         "title": "Soporte",
-        "description": "Lunes a viernes, de 9 a 18 h"
+        "description": "Martes a jueves, de 10 a 17 h (días hábiles)"
       }
     },
     "faq": {
@@ -183,7 +183,7 @@
         },
         "q8": {
           "q": "¿Cómo contacto con el soporte?",
-          "a": "Puedes contactarnos por correo electrónico a hello@gohorsejobs.com o por teléfono al (11) 9999-9999. Nuestro equipo está disponible de lunes a viernes, de 9:00 a 18:00."
+          "a": "Puedes contactarnos por correo electrónico a wtf@gohorsejobs.com o por teléfono al (11) 9999-9999. Nuestro equipo está disponible de martes a jueves, de 10:00 a 17:00. El plazo de respuesta para tickets es de 72 horas hábiles."
         }
       }
     },
@@ -192,7 +192,7 @@
       "email": "Correo electrónico",
       "phone": "Teléfono",
       "hours": "Horario de Atención",
-      "hoursValue": "Lun – Vie: 9:00 a 18:00"
+      "hoursValue": "Mar – Jue: 10:00 a 17:00 (días hábiles)"
     },
     "resources": {
       "title": "Recursos Útiles",
@@ -205,7 +205,7 @@
     },
     "help": {
       "title": "¿Necesitas más ayuda?",
-      "description": "Nuestro equipo de soporte está listo para ayudarte.",
+      "description": "Nuestro equipo de soporte está listo para ayudarte. El plazo de respuesta para tickets es de 72 horas hábiles.",
       "button": "Enviar Mensaje"
     }
   },

frontend/src/i18n/pt-BR.json

@@ -180,7 +180,7 @@
       },
       "support": {
         "title": "Suporte",
-        "description": "Segunda a sexta-feira, das 9h às 18h"
+        "description": "Terça a quinta-feira, das 10h às 17h (dias úteis)"
       }
     },
     "intro": {
@@ -220,7 +220,7 @@
         },
         "q8": {
           "q": "Como entro em contato com o suporte?",
-          "a": "Você pode entrar em contato conosco pelo e-mail hello@gohorsejobs.com ou pelo telefone (11) 9999-9999. Nosso time está disponível de segunda a sexta-feira, das 9h às 18h."
+          "a": "Você pode entrar em contato conosco pelo e-mail wtf@gohorsejobs.com ou pelo telefone (11) 9999-9999. Nosso time está disponível de terça a quinta-feira, das 10h às 17h. O prazo de resposta para tickets é de 72 horas úteis."
         }
       }
     },
@@ -229,7 +229,7 @@
       "email": "E-mail",
       "phone": "Telefone",
       "hours": "Horário de Atendimento",
-      "hoursValue": "Segunda a sexta-feira: 9h às 18h"
+      "hoursValue": "Terça a quinta-feira: 10h às 17h (dias úteis)"
     },
     "resources": {
       "title": "Recursos Úteis",
@@ -242,7 +242,7 @@
     },
     "help": {
       "title": "Precisa de mais ajuda?",
-      "description": "Nossa equipe de suporte está pronta para ajudar você.",
+      "description": "Nossa equipe de suporte está pronta para ajudar você. O prazo de resposta para tickets é de 72 horas úteis.",
       "button": "Enviar Mensagem"
     },
     "actions": {