"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import MediaAbout from '@/components/sections/about/MediaAbout';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="smallMedium"
        sizing="mediumLargeSizeLargeTitles"
        background="noiseDiagonalGradient"
        cardStyle="soft-shadow"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Stories",
          id: "/stories",
        },
        {
          name: "Services",
          id: "/services",
        },
        {
          name: "About",
          id: "/about",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      brandName="DYSRVPT"
    />
  </div>

  <div id="contact-form" data-section="contact-form">
      <ContactSplit
      useInvertedBackground={false}
      background={{
        variant: "plain",
      }}
      tag="Get in Touch"
      title="LET'S BUILD SOMETHING DYSRVPTIVE"
      description="Reach out to discuss collaborations, partnerships, or to share your story with the world. We're eager to hear from you."
      imageSrc="http://img.b2bpic.net/free-photo/two-individuals-collaborating-with-tablet-modern-setting_23-2152013676.jpg"
      imageAlt="Dynamic African community gathering"
      mediaAnimation="opacity"
      inputPlaceholder="Your Name"
      buttonText="SEND MESSAGE"
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={false}
      title="WHY COLLABORATE WITH DYSRVPT?"
      description="Our platform offers unparalleled reach into the vibrant African creative scene. We provide authentic storytelling, impactful media production, and strategic amplification for brands and artists looking to connect with a dynamic, engaged audience. Let us help you tell your story and make a lasting impression."
      imageSrc="http://img.b2bpic.net/free-photo/group-young-teens-celebrating-world-youth-day-by-doing-activities-together_23-2151478233.jpg"
      imageAlt="African creatives in a vibrant collaboration space"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="DYSRVPT"
      columns={[
        {
          title: "Navigation",
          items: [
            {
              label: "Home",
              href: "/",
            },
            {
              label: "Stories",
              href: "/stories",
            },
            {
              label: "Services",
              href: "/services",
            },
            {
              label: "About",
              href: "/about",
            },
            {
              label: "Contact",
              href: "/contact",
            },
          ],
        },
        {
          title: "Socials",
          items: [
            {
              label: "Instagram",
              href: "https://instagram.com/dysrvpt",
            },
            {
              label: "TikTok",
              href: "https://tiktok.com/@dysrvpt",
            },
            {
              label: "X",
              href: "https://x.com/dysrvpt",
            },
            {
              label: "YouTube",
              href: "https://youtube.com/@dysrvpt",
            },
          ],
        },
        {
          title: "Legal",
          items: [
            {
              label: "Privacy Policy",
              href: "#",
            },
            {
              label: "Terms of Service",
              href: "#",
            },
          ],
        },
      ]}
      copyrightText="DYSRVPT | Documenting African Culture In Motion. DO IT LIKE YOU. STAY DYSRVPTIVE."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
