"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import { Compass, Feather, Globe, Mic, Smartphone, Sparkles, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="mediumLarge"
        sizing="mediumLargeSizeLargeTitles"
        background="fluid"
        cardStyle="outline"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",          id: "/"},
        {
          name: "Stories",          id: "/stories"},
        {
          name: "Services",          id: "/services"},
        {
          name: "About",          id: "/about"},
        {
          name: "Contact",          id: "/contact"},
      ]}
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=m7mhs2"
      logoAlt="DYSRVPT Logo"
      brandName="DYSRVPT"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardCarousel
      background={{
        variant: "plain"}}
      title="DOCUMENTING THE CULTURE AS IT HAPPENS."
      description="From underground raves to the creatives shaping Africa's future, DYSRVPT tells the stories behind the movement."
      buttons={[
        {
          text: "Explore Stories",          href: "/stories"},
        {
          text: "Work With Us",          href: "/contact"},
      ]}
      mediaItems={[
        {
          videoSrc: "http://img.b2bpic.net/free-photo/medium-shot-young-woman-dancing-techno-party_23-2150639046.jpg?_wi=1",          videoAriaLabel: "African rave party crowd dancing",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-young-woman-dancing-techno-party_23-2150639046.jpg?_wi=2",          imageAlt: "african rave party crowd dancing night"},
        {
          videoSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-spanish-man-posing-red-wall-background-sunny-day_181624-54408.jpg?_wi=1",          videoAriaLabel: "African DJ performing on stage",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=m7mhs2",          imageAlt: "african rave party crowd dancing night"},
        {
          videoSrc: "http://img.b2bpic.net/free-photo/young-cheerful-people-having-fun-together_329181-16456.jpg?_wi=1",          videoAriaLabel: "Dynamic cultural event in Africa",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-spanish-man-posing-red-wall-background-sunny-day_181624-54408.jpg?_wi=2",          imageAlt: "african rave party crowd dancing night"},
        {
          videoSrc: "http://img.b2bpic.net/free-photo/african-american-artist-using-watercolor-paint-mixing-colors-palette_482257-124760.jpg?_wi=1",          videoAriaLabel: "Behind the scenes of an African creative project",          imageSrc: "http://img.b2bpic.net/free-photo/young-cheerful-people-having-fun-together_329181-16456.jpg?_wi=2",          imageAlt: "african rave party crowd dancing night"},
        {
          videoSrc: "http://img.b2bpic.net/free-photo/medium-shot-nigerian-men-playing-music_23-2149029463.jpg?_wi=1",          videoAriaLabel: "African drummer performing energetically",          imageSrc: "http://img.b2bpic.net/free-photo/african-american-artist-using-watercolor-paint-mixing-colors-palette_482257-124760.jpg?_wi=2",          imageAlt: "african rave party crowd dancing night"},
        {
          videoSrc: "http://img.b2bpic.net/free-photo/beautiful-cubism-graffiti_23-2150555452.jpg",          videoAriaLabel: "Vibrant African street art mural",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-nigerian-men-playing-music_23-2149029463.jpg?_wi=2",          imageAlt: "african rave party crowd dancing night"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={true}
      title="THE CULTURE DOESN'T WAIT. NEITHER DO WE."
      description="DYSRVPT documents Nigerian and African creativity in motion. Through editorial storytelling, media coverage, and culture reporting, we spotlight the people, spaces, and ideas shaping what comes next."
      imageSrc="http://img.b2bpic.net/free-photo/medium-shot-young-people-hostel_23-2150446748.jpg"
      imageAlt="African creative working in a studio"
    />
  </div>

  <div id="what-we-do" data-section="what-we-do">
      <FeatureCardTwentyFive
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "On-Ground Media Coverage",          description: "We show up where it's happening—capturing the energy, people, and moments shaping culture in real time.",          icon: Globe,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-middle-aged-man-taking-photos-with-device-world-photography-day_23-2151672333.jpg",              imageAlt: "African street photographer"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/person-doing-house-tour-online_23-2151050242.jpg",              imageAlt: "Mobile phone content creation"},
          ]
        },
        {
          title: "Mobile-First Content Creation",          description: "Fast, raw, social-first visuals designed for immediate impact.",          icon: Smartphone,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-posing-traditional-african-attire-outdoors_23-2150572652.jpg",              imageAlt: "African content creator filming"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/fish-cages-wall_53876-15066.jpg",              imageAlt: "African creative studio setup"},
          ]
        },
        {
          title: "Culture Storytelling",          description: "Long-form articles, interviews, and features documenting the stories behind the movement.",          icon: Feather,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-afro-american-man_23-2150771039.jpg",              imageAlt: "African woman reading editorial"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-working-pottery_23-2151680938.jpg",              imageAlt: "African community gathering"},
          ]
        },
        {
          title: "Creative Talent Amplification",          description: "Positioning artists, DJs, and disruptors at the centre of cultural conversations.",          icon: Mic,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/young-man-stretching-night-city_23-2149285678.jpg",              imageAlt: "African DJ performing"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/woman-clay-sculpting-front-view_23-2149730879.jpg",              imageAlt: "African fashion designer"},
          ]
        },
      ]}
      title="WHAT WE DO"
      description="Our core offerings to capture, create, and amplify the pulse of African culture."
    />
  </div>

  <div id="featured" data-section="featured">
      <BlogCardThree
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      title="WHAT'S NEW?"
      description="Explore our latest editorial cards across diverse categories."
      blogs={[
        {
          id: "featured-1",          category: "Weekend Guides",          title: "Where To Be This Weekend",          excerpt: "Weekly nightlife guide in collaboration with Vibe Arkitech.",          imageSrc: "http://img.b2bpic.net/free-photo/people-walking-through-alley_23-2152004245.jpg",          imageAlt: "African nightlife scene",          authorName: "DYSRVPT Staff",          authorAvatar: "http://img.b2bpic.net/free-photo/handsome-afroamerican-man-smiling_23-2148508920.jpg",          date: "July 26, 2024"},
        {
          id: "featured-2",          category: "Event Spotlight",          title: "Unfiltered: Behind the Scenes at Afro Rave Lagos",          excerpt: "Visual interviews and behind-the-scenes event coverage of the hottest raves.",          imageSrc: "http://img.b2bpic.net/free-photo/world-theatre-day-celebration_23-2151185590.jpg",          imageAlt: "Behind the scenes event coverage",          authorName: "DYSRVPT Staff",          authorAvatar: "http://img.b2bpic.net/free-photo/attractive-black-african-american-woman-posing-stylish-green-dress-isolated-green-background_285396-11041.jpg",          date: "July 20, 2024"},
        {
          id: "featured-3",          category: "Creative Spotlight",          title: "The DJ Shaping Lagos' Soundscape",          excerpt: "Features on DJs, artists, and culture disruptors defining the sound of now.",          imageSrc: "http://img.b2bpic.net/free-photo/african-american-man-smiling-working-laptop_482257-17761.jpg",          imageAlt: "African DJ portrait",          authorName: "DYSRVPT Staff",          authorAvatar: "http://img.b2bpic.net/free-photo/man-holding-clapperboard_1187-2062.jpg",          date: "July 15, 2024"},
        {
          id: "featured-4",          category: "Short Reads",          title: "Why African Culture is Disrupting Global Norms",          excerpt: "Fast, digestible culture commentary on emerging trends and movements.",          imageSrc: "http://img.b2bpic.net/free-photo/hands-holding-hot-drink-poster-with-eyeglasses-bedsheet_23-2147887681.jpg",          imageAlt: "Person reading a short article",          authorName: "DYSRVPT Staff",          authorAvatar: "http://img.b2bpic.net/free-photo/smiley-teacher-classroom_23-2151696485.jpg",          date: "July 10, 2024"},
        {
          id: "featured-5",          category: "Long Reads",          title: "The Archival Imperative: Preserving African Underground Scenes",          excerpt: "Research-driven editorial features and in-depth reporting on critical cultural topics.",          imageSrc: "http://img.b2bpic.net/free-photo/archaeological-cave-paintings_23-2151786599.jpg",          imageAlt: "Research documents and notes",          authorName: "DYSRVPT Staff",          authorAvatar: "http://img.b2bpic.net/free-photo/businessman-using-mobile-phone_107420-84909.jpg",          date: "July 5, 2024"},
        {
          id: "featured-6",          category: "Creative Spotlight",          title: "Emerging Visual Artists of Abuja",          excerpt: "Spotlighting new talent in visual arts across Nigerian cities.",          imageSrc: "http://img.b2bpic.net/free-photo/artist-listening-music-creating-abstract-painting-with-his-fingers_482257-118510.jpg",          imageAlt: "African art gallery exhibition",          authorName: "DYSRVPT Staff",          authorAvatar: "http://img.b2bpic.net/free-photo/angry-woman-holding-submachine-gun_1187-1038.jpg",          date: "June 28, 2024"},
      ]}
    />
  </div>

  <div id="why-dysrvpt" data-section="why-dysrvpt">
      <MetricCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      metrics={[
        {
          id: "metric-1",          value: "Authentic",          title: "Real Stories",          description: "Authentic stories from the people shaping culture.",          icon: Sparkles,
        },
        {
          id: "metric-2",          value: "Exclusive",          title: "Real Access",          description: "On-the-ground reporting and embedded coverage.",          icon: Compass,
        },
        {
          id: "metric-3",          value: "Connected",          title: "Real Community",          description: "Built alongside the communities we document.",          icon: Users,
        },
      ]}
      title="WE DON'T CHASE CULTURE. WE DOCUMENT IT."
      description="Our commitment to authentic and community-driven storytelling sets us apart."
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Sunday Service",        "Our House NG",        "Headslicer",        "Fearless NG",        "Open House Accra",        "KVLT",        "Smirnoff",        "Pulse Fiesta",        "Afro House In Lagos",        "Day Breeze"]}
      title="OUR PARTNERS"
      description="Proudly collaborating with leading brands and cultural movements."
    />
  </div>

  <div id="newsletter" data-section="newsletter">
      <ContactCTA
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      tag="Newsletter"
      title="DON'T MISS THE NEXT WAVE."
      description="Get weekly updates on events, stories, interviews, and the culture shaping Africa right now."
      buttons={[
        {
          text: "STAY DYSRVPTIVE",          href: "/contact"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "Company",          items: [
            {
              label: "Home",              href: "/"},
            {
              label: "Stories",              href: "/stories"},
            {
              label: "Services",              href: "/services"},
            {
              label: "About",              href: "/about"},
            {
              label: "Contact",              href: "/contact"},
          ],
        },
        {
          title: "Connect",          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"},
          ],
        },
      ]}
      bottomLeftText="DYSRVPT. Documenting African Culture In Motion."
      bottomRightText="DO IT LIKE YOU. STAY DYSRVPTIVE."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
