"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FooterBase from '@/components/sections/footer/FooterBase';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-stagger"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="smallMedium"
        sizing="largeSmall"
        background="floatingGradient"
        cardStyle="gradient-bordered"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="layered"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "About",
          id: "/about",
        },
        {
          name: "Gallery",
          id: "/gallery",
        },
        {
          name: "Track Order",
          id: "/track-order",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      brandName="Malavida"
    />
  </div>

  <div id="contact-form" data-section="contact-form">
      <ContactSplitForm
      useInvertedBackground={true}
      title="Get in Touch With Malavida"
      description="Have a question about an order, a product, or just want to say hello? Our team is here to help. Fill out the form below, and we'll get back to you promptly."
      inputs={[
        {
          name: "name",
          type: "text",
          placeholder: "Your Name",
          required: true,
        },
        {
          name: "email",
          type: "email",
          placeholder: "Your Email",
          required: true,
        },
      ]}
      textarea={{
        name: "message",
        placeholder: "Your Message",
        rows: 5,
        required: true,
      }}
      imageSrc="http://img.b2bpic.net/free-photo/tailoring-studio-with-dress-form-laptop_23-2148834162.jpg"
      imageAlt="Fashion design studio interior"
      mediaAnimation="opacity"
      mediaPosition="right"
      buttonText="Send Message"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitText
      useInvertedBackground={false}
      faqs={[
        {
          id: "faq-1",
          title: "What is your return policy?",
          content: "We offer a 30-day return policy for all unworn, unwashed items with original tags attached. Please visit our returns page for detailed instructions.",
        },
        {
          id: "faq-2",
          title: "How do I find my size?",
          content: "Each product page includes a comprehensive size guide to help you choose the perfect fit. If you're still unsure, feel free to contact our customer support.",
        },
        {
          id: "faq-3",
          title: "Do you offer international shipping?",
          content: "Yes, Malavida ships worldwide! Shipping costs and delivery times vary by destination. You can calculate shipping at checkout.",
        },
      ]}
      sideTitle="Frequently Asked Questions"
      sideDescription="Find quick answers to the most common inquiries about Malavida products, orders, and services."
      faqsAnimation="slide-up"
      textPosition="left"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        {
          title: "Company",
          items: [
            {
              label: "About Us",
              href: "/about",
            },
            {
              label: "Our Story",
              href: "/about",
            },
            {
              label: "Careers",
              href: "#",
            },
          ],
        },
        {
          title: "Shop",
          items: [
            {
              label: "Collections",
              href: "/gallery",
            },
            {
              label: "New Arrivals",
              href: "/gallery",
            },
            {
              label: "Sale",
              href: "#",
            },
          ],
        },
        {
          title: "Support",
          items: [
            {
              label: "Contact Us",
              href: "/contact",
            },
            {
              label: "Track Order",
              href: "/track-order",
            },
            {
              label: "FAQ",
              href: "/contact#faq",
            },
          ],
        },
      ]}
      logoSrc="http://img.b2bpic.net/free-vector/fashion-accessories-logo-collection_23-2148888014.jpg"
      logoAlt="Malavida Logo"
      logoText="Malavida"
      copyrightText="© 2024 Malavida. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
