"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import { Award, Clock, Cog, Compass, Diamond, Gauge, History, Sparkles, Star, Waves } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="mediumLarge"
        sizing="largeSizeMediumTitles"
        background="grid"
        cardStyle="gradient-radial"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Home",          id: "#home"},
        {
          name: "Collections",          id: "#collections"},
        {
          name: "Craftsmanship",          id: "#craftsmanship"},
        {
          name: "Heritage",          id: "#heritage"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      logoSrc="http://img.b2bpic.net/free-vector/vintage-white-clocks-repair-service-emblems_1284-38371.jpg"
      logoAlt="Rolex Crown Logo"
      brandName="ROLEX"
      bottomLeftText="Swiss Horology"
      bottomRightText="info@rolex.com"
    />
  </div>

  <div id="home" data-section="home">
      <HeroBillboardRotatedCarousel
      background={{
        variant: "rotated-rays-animated"}}
      title="Engineered for Eternity"
      description="Discover the unparalleled precision, timeless design, and legendary heritage of Rolex timepieces. A symphony of Swiss craftsmanship and technological perfection."
      tag="Absolute Luxury"
      tagIcon={Sparkles}
      tagAnimation="blur-reveal"
      buttons={[
        {
          text: "Explore Collections",          href: "#collections"},
      ]}
      buttonAnimation="slide-up"
      carouselItems={[
        {
          id: "1",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-clock-with-time-change_23-2149241166.jpg",          imageAlt: "Rolex Submariner 3D render"},
        {
          id: "2",          imageSrc: "http://img.b2bpic.net/free-photo/elegance-gold-luxury-watch-success-generated-by-ai_188544-14010.jpg",          imageAlt: "Rolex Daytona 3D render"},
        {
          id: "3",          imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-businessman-handsome-model-man-casual-cloth-suit-with-accesories-hands_158538-9460.jpg",          imageAlt: "Rolex GMT-Master II 3D render"},
        {
          id: "4",          imageSrc: "http://img.b2bpic.net/free-photo/businessman-hand-pants-pocket_1262-18152.jpg",          imageAlt: "Rolex Datejust 3D render"},
        {
          id: "5",          imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-casino-roulette-wheel-black-surface_181624-59880.jpg",          imageAlt: "Rolex Day-Date 3D render"},
        {
          id: "6",          imageSrc: "http://img.b2bpic.net/free-photo/man-looking-his-watch_53876-13503.jpg",          imageAlt: "Rolex Oyster Perpetual 3D render"},
      ]}
      autoPlay={true}
      autoPlayInterval={6000}
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={false}
      title="A Legacy Forged in Time"
      description="For over a century, Rolex has stood as the ultimate symbol of performance and prestige. Each timepiece is a testament to an unwavering pursuit of horological excellence, crafted by master artisans with meticulous precision and visionary innovation. Discover the enduring spirit of a brand that defines luxury."
      tag="Our Heritage"
      tagIcon={Compass}
      tagAnimation="slide-up"
      buttons={[
        {
          text: "Learn More",          href: "#heritage-details"},
      ]}
      buttonAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/closeup-shot-hands-numbers-hour-marks-black-watch_181624-26818.jpg"
      imageAlt="Close-up of Rolex watch movement components"
    />
  </div>

  <div id="collections" data-section="collections">
      <ProductCardTwo
      animationType="blur-reveal"
      textboxLayout="default"
      gridVariant="bento-grid"
      useInvertedBackground={false}
      products={[
        {
          id: "submariner",          brand: "Rolex",          name: "Submariner",          price: "Price on Request",          rating: 5,
          reviewCount: "250",          imageSrc: "http://img.b2bpic.net/free-photo/black-wrist-watch_1057-4040.jpg",          imageAlt: "Rolex Submariner deep green dial"},
        {
          id: "daytona",          brand: "Rolex",          name: "Cosmograph Daytona",          price: "Price on Request",          rating: 5,
          reviewCount: "180",          imageSrc: "http://img.b2bpic.net/free-photo/businessman-looking-his-watch-closeup_53876-176905.jpg",          imageAlt: "Rolex Daytona champagne gold"},
        {
          id: "gmt",          brand: "Rolex",          name: "GMT-Master II",          price: "Price on Request",          rating: 5,
          reviewCount: "120",          imageSrc: "http://img.b2bpic.net/free-photo/hipster-vacation-lake_23-2147978823.jpg",          imageAlt: "Rolex GMT-Master II 'Pepsi'"},
        {
          id: "datejust",          brand: "Rolex",          name: "Datejust",          price: "Price on Request",          rating: 5,
          reviewCount: "300",          imageSrc: "http://img.b2bpic.net/free-photo/pensive-bearded-man-dark-suit-is-checking-what-time-is-now-dark-photo-studio_613910-12654.jpg",          imageAlt: "Rolex Datejust blue dial"},
        {
          id: "daydate",          brand: "Rolex",          name: "Day-Date",          price: "Price on Request",          rating: 5,
          reviewCount: "90",          imageSrc: "http://img.b2bpic.net/free-photo/closeup-photo-shoot-tattoo-making-artist-is-working-with-tattoo-machine-customer-s-hand_613910-17250.jpg",          imageAlt: "Rolex Day-Date platinum ice blue"},
        {
          id: "oyster",          brand: "Rolex",          name: "Oyster Perpetual",          price: "Price on Request",          rating: 5,
          reviewCount: "210",          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-traveler-with-suitcase_23-2151043310.jpg",          imageAlt: "Rolex Oyster Perpetual green dial"},
      ]}
      title="Iconic Collections"
      description="Explore the legendary Rolex collections, each a masterpiece of design and engineering, built for remarkable achievements and enduring style. From the depths of the ocean to the highest peaks, a Rolex is a companion for life's extraordinary journeys."
      tag="World of Rolex"
      tagIcon={Diamond}
      tagAnimation="blur-reveal"
    />
  </div>

  <div id="craftsmanship" data-section="craftsmanship">
      <FeatureCardNineteen
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          tag: "Movement",          title: "Heartbeat of Innovation",          subtitle: "Self-Winding Calibers",          description: "At the core of every Rolex beats a mechanical movement entirely developed and manufactured in-house. These self-winding calibers are certified chronometers, a testament to their superlative precision and reliability.",          imageSrc: "http://img.b2bpic.net/free-photo/male-jeweler-working-shop-with-measuring-device_23-2150914191.jpg",          imageAlt: "Exploded view of Rolex movement"},
        {
          tag: "Materials",          title: "Exceptional Alloys",          subtitle: "Oystersteel & Gold",          description: "Rolex crafts its watches from the highest quality materials, including Oystersteel – a unique alloy developed in-house for extreme corrosion resistance – and meticulously cast 18 ct gold, ensuring both durability and enduring beauty.",          imageSrc: "http://img.b2bpic.net/free-photo/astronaut-diving-ocean_23-2151549785.jpg",          imageAlt: "Close up of Rolex Oystersteel"},
        {
          tag: "Waterproofing",          title: "Oyster Case Mastery",          subtitle: "Hermetically Sealed",          description: "The iconic Oyster case, invented by Rolex in 1926, is hermetically sealed to guarantee waterproofness up to extreme depths. Its robust construction protects the movement from water, dust, pressure, and shocks.",          imageSrc: "http://img.b2bpic.net/free-photo/realistic-manta-ray-sea-water_23-2151461125.jpg",          imageAlt: "Rolex Oyster case water resistance"},
        {
          tag: "Crystal",          title: "Sapphire Resilience",          subtitle: "Virtually Scratchproof",          description: "Every Rolex timepiece is fitted with a sapphire crystal, virtually scratchproof and produced to stringent quality standards. Some models feature a Cyclops lens for enhanced date readability, a signature Rolex innovation.",          imageSrc: "http://img.b2bpic.net/free-photo/new-year-party-concept-with-girl-holding-clock_23-2147995152.jpg",          imageAlt: "Rolex sapphire crystal close-up"},
      ]}
      title="The Art of Precision"
      description="Immerse yourself in the world of Rolex craftsmanship, where every component is meticulously engineered and flawlessly assembled. From the intricate movements to the robust Oyster case, discover the unparalleled dedication to perfection."
      tag="Swiss Perfection"
      tagIcon={Cog}
      tagAnimation="blur-reveal"
      buttonAnimation="slide-up"
    />
  </div>

  <div id="submariner-details" data-section="submariner-details">
      <MediaAbout
      useInvertedBackground={false}
      title="Submariner: Conquer the Depths"
      description="The Oyster Perpetual Submariner is the quintessential diver's watch, a robust and functional tool that has become an icon. Designed to conquer the underwater world, it embodies Rolex’s deep connection with the pioneering spirit of exploration. Its unidirectional rotating bezel, luminescent display, and Oyster case ensure reliability and legibility even in the darkest marine environments."
      tag="Submariner Heritage"
      tagIcon={History}
      tagAnimation="slide-up"
      buttons={[
        {
          text: "View Full Collection",          href: "#collections"},
      ]}
      buttonAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/flat-lay-close-up-hydroalcoholic-gel_23-2148858969.jpg"
      imageAlt="Rolex Submariner watch underwater"
    />
  </div>

  <div id="daytona-details" data-section="daytona-details">
      <MediaAbout
      useInvertedBackground={false}
      title="Daytona: The Ultimate Racing Chronicle"
      description="Born to race, the Oyster Perpetual Cosmograph Daytona is the ultimate tool for those with a passion for driving and speed. A chronometer-certified high-performance chronograph, it has conquered the world's most demanding circuits, etched into the history of motor racing. Its tachymetric scale bezel and precise chronograph function make it indispensable for measuring average speeds up to 400 miles per hour."
      tag="Daytona Legacy"
      tagIcon={Gauge}
      tagAnimation="slide-up"
      buttons={[
        {
          text: "View Full Collection",          href: "#collections"},
      ]}
      buttonAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/close-up-clock-with-time-change_23-2149241142.jpg"
      imageAlt="Rolex Daytona watch on a racing track"
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardOne
      animationType="depth-3d"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      metrics={[
        {
          id: "1",          value: "100+",          title: "Years of Innovation",          description: "Leading the world in horological advancements and precision engineering.",          icon: Award,
        },
        {
          id: "2",          value: "±2",          title: "Seconds Per Day",          description: "Exceeding industry standards for chronometric precision, guaranteeing accuracy.",          icon: Clock,
        },
        {
          id: "3",          value: "200M+",          title: "Water Resistance",          description: "Pioneering deep-sea exploration with uncompromised reliability.",          icon: Waves,
        },
      ]}
      title="Defining Excellence"
      description="For over a century, Rolex has continually pushed the boundaries of horological innovation and precision, setting benchmarks for the industry. Our commitment to perfection is reflected in every milestone and every intricate detail."
      tag="Our Achievements"
      tagIcon={Award}
      tagAnimation="blur-reveal"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      animationType="depth-3d"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          name: "Sir Edmund Hillary",          role: "Mountaineer",          company: "Expedition Leader",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-bearded-stylish-male-wearing-elegant-suit-dark-background_613910-11359.jpg",          imageAlt: "Sir Edmund Hillary"},
        {
          id: "2",          name: "Jacques Piccard",          role: "Oceanographer",          company: "Deep-sea Explorer",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/cheerful-blonde-female-modern-clothes-studying-with-book-sitting-bench-park-against-skyscraper_613910-3876.jpg",          imageAlt: "Jacques Piccard"},
        {
          id: "3",          name: "Paul Newman",          role: "Actor & Racing Driver",          company: "Hollywood Icon",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/lady-red-posing-studio_651396-1333.jpg",          imageAlt: "Paul Newman"},
        {
          id: "4",          name: "Martin Luther King Jr.",          role: "Civil Rights Leader",          company: "Nobel Laureate",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/handsome-young-man-wearing-checkered-shirt-standing-night-street-illuminated-signboards-neon-lights_613910-21240.jpg",          imageAlt: "Martin Luther King Jr."},
        {
          id: "5",          name: "Roger Federer",          role: "Tennis Legend",          company: "Athlete",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/dark-skinned-bearded-hipster-guy-dressed-black-hoodie-sports-shorts-holds-skateboard-while-sitting-stairs-ghetto_613910-17652.jpg",          imageAlt: "Roger Federer"},
      ]}
      kpiItems={[
        {
          value: "Unrivaled",          label: "Craftsmanship"},
        {
          value: "Iconic",          label: "Design"},
        {
          value: "Timeless",          label: "Heritage"},
      ]}
      title="A Legacy Worn by Legends"
      description="Rolex watches have graced the wrists of explorers, pioneers, artists, and leaders throughout history. Hear from those who define excellence and embody the spirit of the crown."
      tag="Elite Endorsements"
      tagIcon={Star}
      tagAnimation="blur-reveal"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "Collections",          items: [
            {
              label: "Submariner",              href: "#collections"},
            {
              label: "Daytona",              href: "#collections"},
            {
              label: "GMT-Master II",              href: "#collections"},
            {
              label: "Datejust",              href: "#collections"},
            {
              label: "Day-Date",              href: "#collections"},
            {
              label: "Oyster Perpetual",              href: "#collections"},
          ],
        },
        {
          title: "The Brand",          items: [
            {
              label: "Our Heritage",              href: "#about"},
            {
              label: "Craftsmanship",              href: "#craftsmanship"},
            {
              label: "Excellence",              href: "#metrics"},
            {
              label: "Testimonials",              href: "#testimonials"},
          ],
        },
        {
          title: "Legal",          items: [
            {
              label: "Privacy Policy",              href: "#"},
            {
              label: "Terms & Conditions",              href: "#"},
            {
              label: "Cookie Settings",              href: "#"},
          ],
        },
        {
          title: "Connect",          items: [
            {
              label: "Facebook",              href: "https://facebook.com/rolex"},
            {
              label: "Instagram",              href: "https://instagram.com/rolex"},
            {
              label: "YouTube",              href: "https://youtube.com/rolex"},
          ],
        },
      ]}
      bottomLeftText="© 2024 Rolex. All rights reserved."
      bottomRightText="The Official Website of Rolex"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
