"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import { Mail } from "lucide-react";

export default function ContactPage() {
  const navItemsForNavbar = [
    { name: "Ana Sayfa", id: "/" },
    { name: "Hakkımızda", id: "/hakkimizda" },
    { name: "Hizmetler", id: "/hizmetler" },
    { name: "Ürünler", id: "/urunler" },
    { name: "SSS", id: "/iletisim" },
    { name: "Haberler", id: "/haberler" },
  ];

  const handleEmailSubmit = (email: string) => {
    console.log("Email submitted:", email);
  };

  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="compact"
      sizing="mediumLargeSizeLargeTitles"
      background="noiseDiagonalGradient"
      cardStyle="glass-elevated"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={navItemsForNavbar}
          button={{ text: "İletişim", href: "/iletisim" }}
          brandName="Şirketim"
        />
      </div>

      <div id="contact-form" data-section="contact-form">
        <ContactCenter
          tag="İletişim"
          title="Bizimle İletişime Geçin"
          description="Sorularınız veya önerileriniz için bize yazın. En kısa sürede yanıt vereceğiz. Müşteri desteğimiz her zaman yardıma hazırdır."
          tagIcon={Mail}
          tagAnimation="slide-up"
          background={{ variant: "rotated-rays-animated" }}
          useInvertedBackground={true}
          inputPlaceholder="E-mail adresiniz"
          buttonText="Gönder"
          termsText="Gizlilik Politikamız'ı okuyarak kabul etmiş olursunuz."
          onSubmit={handleEmailSubmit}
        />
      </div>

      <div id="faq-contact" data-section="faq-contact">
        <FaqSplitText
          sideTitle="Sıkça Sorulan Sorular"
          sideDescription="Hizmetlerimiz hakkında bilmeniz gereken her şey"
          textPosition="left"
          useInvertedBackground={true}
          animationType="smooth"
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "1",
              title: "Hizmetleriniz hangi sektörlere uygun?",
              content:
                "Finans, teknoloji, perakende, sağlık ve kamu sektörü dahil birçok alanda hizmet sunuyoruz. Her sektörün özel ihtiyaçlarına uygun çözümler geliştiririz.",
            },
            {
              id: "2",
              title: "Proje süresi ne kadar?",
              content:
                "Proje kapsamına bağlı olarak değişir. Basit projeler 2-4 hafta, kompleks projeler ise 3-6 ay sürebilir. Önceden detaylı zaman tahmini verilir.",
            },
            {
              id: "3",
              title: "Teknik destek hizmeti nasıl çalışır?",
              content:
                "7/24 teknik destek sağlıyor, sorunlarınız 24 saat içinde çözülüyor. E-mail, telefon ve canlı sohbet üzerinden destek sunuyoruz.",
            },
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="Şirketim"
          columns={[
            {
              title: "Ürün",
              items: [
                { label: "Hizmetler", href: "/hizmetler" },
                { label: "Paketler", href: "/urunler" },
                { label: "Fiyatlandırma", href: "/urunler" },
              ],
            },
            {
              title: "Şirket",
              items: [
                { label: "Hakkımızda", href: "/hakkimizda" },
                { label: "Projeler", href: "/" },
                { label: "Haberler", href: "/haberler" },
              ],
            },
            {
              title: "Destek",
              items: [
                { label: "SSS", href: "/iletisim" },
                { label: "İletişim", href: "/iletisim" },
                { label: "Dokümanlar", href: "/" },
              ],
            },
            {
              title: "Yasal",
              items: [
                { label: "Gizlilik Politikası", href: "/" },
                { label: "Kullanım Şartları", href: "/" },
                { label: "İletişim Bilgisi", href: "/iletisim" },
              ],
            },
          ]}
          copyrightText="© 2024 | Şirketim. Tüm Hakları Saklıdır."
        />
      </div>
    </ThemeProvider>
  );
}