"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="bounce-effect"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="largeSmall"
        background="fluid"
        cardStyle="gradient-radial"
        primaryButtonStyle="flat"
        secondaryButtonStyle="solid"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",
          id: "#hero",
        },
        {
          name: "Domestic",
          id: "#domestic",
        },
        {
          name: "Imports",
          id: "#imports",
        },
        {
          name: "Metrics",
          id: "#metrics",
        },
        {
          name: "Contact",
          id: "#contact",
        },
      ]}
      brandName="AutoPerformance"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitDoubleCarousel
      background={{
        variant: "gradient-bars",
      }}
      title="High Performance Performance Art"
      description="Experience the ultimate collection of Japanese and Import sports cars. Technical insights, market prices, and raw power metrics await."
      leftCarouselItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/serious-blond-woman-auto-mechanic-her-young-colleague-are-posing-photographer_613910-17068.jpg",
          imageAlt: "Sports Car Front",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-engine_1170-1499.jpg",
          imageAlt: "Engine Details",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-exterior-details-modern-black-car_181624-25346.jpg",
          imageAlt: "Sports Car Side",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/front-air-conditioners-metallic-color-car_114579-4010.jpg",
          imageAlt: "Interior Detail",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-spoiler-white-luxury-car-lights-isolated_181624-23597.jpg",
          imageAlt: "Wheels Detail",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/still-life-seat-gamers_23-2149746579.jpg",
          imageAlt: "Taillights Detail",
        },
      ]}
      rightCarouselItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-cool-motorcycle_23-2150849407.jpg",
          imageAlt: "Sports Car Front",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/female-salesperson-car-showroom-standing-by-car_1303-22387.jpg",
          imageAlt: "Engine Details",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-shot-black-car-s-modern-interior_181624-25418.jpg",
          imageAlt: "Sports Car Side",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/modern-car-futuristic-road_23-2151021178.jpg",
          imageAlt: "Interior Detail",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/engine-piston-cross-section_1232-2590.jpg",
          imageAlt: "Wheels Detail",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/night-drive_23-2151955605.jpg",
          imageAlt: "Taillights Detail",
        },
      ]}
      buttons={[
        {
          text: "View Catalog",
          href: "#domestic",
        },
      ]}
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/details-car-standing-car-showroom_1303-29468.jpg",
          alt: "User 1",
        },
        {
          src: "http://img.b2bpic.net/free-photo/closeup-headlight-white-luxury-car-lights-against-grey-background_181624-25222.jpg",
          alt: "User 2",
        },
        {
          src: "http://img.b2bpic.net/free-photo/man-cafe-racer-style-motorbike_23-2148189649.jpg",
          alt: "User 3",
        },
        {
          src: "http://img.b2bpic.net/free-photo/beautiful-small-girl-is-sitting-lifting-platform-with-car-holding-hammer_613910-17070.jpg",
          alt: "User 4",
        },
        {
          src: "http://img.b2bpic.net/free-photo/turbocharged-engine-sports-car-close-up-hood_78492-3881.jpg",
          alt: "User 5",
        },
      ]}
      avatarText="Join 5,000+ automotive enthusiasts."
      marqueeItems={[
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/car-being-taking-care-workshop_23-2149580601.jpg",
          alt: "Brand 1",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/still-life-seat-gamers_23-2149746564.jpg",
          alt: "Brand 2",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/dark-vip-cinema-studio-still-life_23-2149500615.jpg",
          alt: "Brand 3",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/black-interior-car-center-control-space_53876-96704.jpg",
          alt: "Brand 4",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/stylish-elegant-woman-car-salon_1157-32008.jpg",
          alt: "Brand 5",
        },
      ]}
    />
  </div>

  <div id="domestic" data-section="domestic">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="bento-grid"
      useInvertedBackground={false}
      products={[
        {
          id: "1",
          name: "Toyota GR Supra",
          price: "New: ¥7.5M | Used: ¥5.2M",
          imageSrc: "http://img.b2bpic.net/free-photo/batmobile-car-with-neon-lights_23-2151649957.jpg",
        },
        {
          id: "2",
          name: "Nissan GT-R",
          price: "New: ¥14.8M | Used: ¥10.5M",
          imageSrc: "http://img.b2bpic.net/free-photo/modern-car-driving-city_23-2151674275.jpg",
        },
        {
          id: "3",
          name: "Toyota GR86",
          price: "New: ¥3.5M | Used: ¥2.8M",
          imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139119.jpg",
        },
        {
          id: "4",
          name: "Mazda RX-7",
          price: "Used: ¥6.0M",
          imageSrc: "http://img.b2bpic.net/free-photo/rear-light-new-red-car_23-2147962989.jpg",
        },
        {
          id: "5",
          name: "Honda NSX",
          price: "Used: ¥20.0M",
          imageSrc: "http://img.b2bpic.net/free-photo/car-transmission-inside-car-salon-close-up_1303-19223.jpg",
        },
        {
          id: "6",
          name: "Subaru BRZ",
          price: "New: ¥3.4M | Used: ¥2.6M",
          imageSrc: "http://img.b2bpic.net/free-photo/light-trails-city-street-with-cityscape_1359-784.jpg",
        },
      ]}
      title="Domestic Legends"
      description="The pinnacle of Japanese automotive engineering. From JDM legends to modern masterpieces."
    />
  </div>

  <div id="imports" data-section="imports">
      <FeatureCardTwentyEight
      animationType="scale-rotate"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          id: "f1",
          title: "Lamborghini Revuelto",
          subtitle: "V12 Hybrid",
          category: "Italian",
          value: "350 km/h",
        },
        {
          id: "f2",
          title: "Ferrari 296 GTB",
          subtitle: "V6 Turbo Hybrid",
          category: "Italian",
          value: "330 km/h",
        },
        {
          id: "f3",
          title: "Porsche 911 Turbo S",
          subtitle: "Flat-6",
          category: "German",
          value: "330 km/h",
        },
        {
          id: "f4",
          title: "BMW M4 Competition",
          subtitle: "Straight-6",
          category: "German",
          value: "290 km/h",
        },
        {
          id: "f5",
          title: "Audi R8 V10",
          subtitle: "V10 Engine",
          category: "German",
          value: "320 km/h",
        },
        {
          id: "f6",
          title: "Mercedes-AMG GT",
          subtitle: "V8 Biturbo",
          category: "German",
          value: "315 km/h",
        },
      ]}
      title="Global Icons"
      description="European powerhouses defining the global standard for performance."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardSeven
      animationType="depth-3d"
      textboxLayout="split"
      useInvertedBackground={false}
      metrics={[
        {
          id: "m1",
          value: "50+",
          title: "Models Tracked",
          items: [
            "Japanese",
            "Italian",
            "German",
          ],
        },
        {
          id: "m2",
          value: "12%",
          title: "Price Stability",
          items: [
            "Market index",
            "Yearly average",
          ],
        },
        {
          id: "m3",
          value: "890hp",
          title: "Max Horsepower",
          items: [
            "Track mode",
            "Stock limits",
          ],
        },
      ]}
      title="Performance Analytics"
      description="Comparative insights to help you make the right choice."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",
          name: "Alex Racing",
          role: "Journalist",
          company: "AutoSpeed",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-jolly-car-dealership-agent-hired-respond-client-inquiries_482257-118173.jpg",
        },
        {
          id: "2",
          name: "Chris Tuner",
          role: "Enthusiast",
          company: "DriftClub",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/owner-car-bought-new-detail_114579-2806.jpg",
        },
        {
          id: "3",
          name: "Sam Driver",
          role: "Track Expert",
          company: "CircuitPro",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/professional-women-stylish-suits-office_23-2150167737.jpg",
        },
        {
          id: "4",
          name: "Dave Mech",
          role: "Engineer",
          company: "Precision",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-male-barber-standing-with-arm-crossed_107420-94783.jpg",
        },
        {
          id: "5",
          name: "Elena Collector",
          role: "Buyer",
          company: "LuxuryCars",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-senior-businessman-library_1262-2398.jpg",
        },
      ]}
      kpiItems={[
        {
          value: "4.9/5",
          label: "Community Rating",
        },
        {
          value: "10k+",
          label: "Active Users",
        },
        {
          value: "95%",
          label: "Data Accuracy",
        },
      ]}
      title="Driver Feedback"
      description="What our community says about these engineering marvels."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="split"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",
          title: "How often is pricing updated?",
          content: "Our data is refreshed weekly based on market trends.",
        },
        {
          id: "q2",
          title: "Can I request specific models?",
          content: "Yes, join our community forum to suggest new vehicles.",
        },
        {
          id: "q3",
          title: "Are these prices for new cars?",
          content: "We list both MSRP for new cars and current average used market prices.",
        },
      ]}
      title="Frequently Asked Questions"
      description="Everything you need to know about our sports car database."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "radial-gradient",
      }}
      text="Ready to find your next dream car? Reach out to our team."
      buttons={[
        {
          text: "Contact Us",
          href: "#",
        },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoText="AutoPerformance"
      leftLink={{
        text: "Privacy Policy",
        href: "#",
      }}
      rightLink={{
        text: "Terms of Service",
        href: "#",
      }}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
