"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
import Link from "next/link";
import { HelpCircle } from "lucide-react";

export default function ContactPage() {
  const navItems = [
    { name: "Home", id: "/" },
    { name: "Services", id: "/services" },
    { name: "Portfolio", id: "/" },
    { name: "Pricing", id: "/pricing" },
    { name: "Contact", id: "/contact" },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="mediumLarge"
      sizing="largeSmallSizeLargeTitles"
      background="circleGradient"
      cardStyle="subtle-shadow"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="solid"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={navItems}
          brandName="BuildTrades"
          bottomLeftText="Websites for Contractors"
          bottomRightText="hello@buildtrades.com"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Ready to Grow Your Business?"
          description="Let's talk about your website. Tell us about your business, and we'll show you exactly how we can help you attract more clients and grow your bottom line."
          inputs={[
            {
              name: "fullName",              type: "text",              placeholder: "Your Full Name",              required: true,
            },
            {
              name: "businessEmail",              type: "email",              placeholder: "Business Email Address",              required: true,
            },
            {
              name: "businessName",              type: "text",              placeholder: "Business Name",              required: true,
            },
            {
              name: "serviceType",              type: "text",              placeholder: "Type of Service (e.g., Plumbing, Electrical, Renovation)"},
          ]}
          textarea={{
            name: "message",            placeholder:
              "Tell us about your business and what you're looking to achieve with a new website...",            rows: 5,
            required: true,
          }}
          useInvertedBackground={false}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQUTdG9bI9SIob3c5ogoGiecMG/a-professional-team-of-web-designers-and-1772524381824-5e8170ca.png?_wi=3"
          imageAlt="BuildTrades team collaborating on web projects"
          mediaPosition="right"
          mediaAnimation="slide-up"
          buttonText="Send Inquiry"
          onSubmit={(data) => {
            console.log("Form submitted:", data);
          }}
        />
      </div>

      <div id="contact-faq" data-section="contact-faq">
        <FaqSplitMedia
          title="Common Questions About Our Process"
          description="Before you reach out, check out these frequently asked questions about how we work and what you can expect from partnering with BuildTrades."
          tag="FAQs"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "How long does it take to build my website?",              content:
                "Most projects are completed within 4-6 weeks from start to finish. This includes discovery, design, development, testing, and launch. We'll provide you with a specific timeline during our initial consultation."},
            {
              id: "2",              title: "Can I update my website myself?",              content:
                "Yes! We build sites with user-friendly content management systems. We provide training and documentation so you can update your portfolio, services, and pricing easily. Our support team is also available to help."},
            {
              id: "3",              title: "What's the next step after I fill out this form?",              content:
                "Once you submit, our team will review your information and reach out within 24 business hours to schedule a discovery call. During this call, we'll learn about your business, discuss your goals, and provide a custom proposal."},
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQUTdG9bI9SIob3c5ogoGiecMG/a-helpful-customer-service-representativ-1772524380874-1ceecd4b.png?_wi=2"
          imageAlt="Customer support team helping with website questions"
          mediaPosition="left"
          mediaAnimation="slide-up"
          textboxLayout="default"
          faqsAnimation="slide-up"
          useInvertedBackground={true}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="BuildTrades"
          columns={[
            {
              title: "Company",              items: [
                { label: "About Us", href: "/about" },
                { label: "Our Process", href: "#services" },
                { label: "Portfolio", href: "#portfolio" },
                { label: "Pricing", href: "/pricing" },
              ],
            },
            {
              title: "Services",              items: [
                { label: "Website Design", href: "#" },
                { label: "SEO Services", href: "#" },
                { label: "Lead Generation", href: "#" },
                { label: "Website Maintenance", href: "#" },
              ],
            },
            {
              title: "Resources",              items: [
                { label: "Blog", href: "#" },
                { label: "Case Studies", href: "#" },
                { label: "FAQ", href: "#faq" },
                { label: "Contact Us", href: "#contact" },
              ],
            },
            {
              title: "Connect",              items: [
                { label: "Facebook", href: "https://facebook.com" },
                { label: "LinkedIn", href: "https://linkedin.com" },
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Email Us", href: "mailto:hello@buildtrades.com" },
              ],
            },
          ]}
          copyrightText="© 2025 BuildTrades. Professional Websites for Contractors & Trades Professionals."
          onPrivacyClick={() => {
            console.log("Privacy policy clicked");
          }}
        />
      </div>
    </ThemeProvider>
  );
}