"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import { Award, Shield, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="medium"
        sizing="mediumLarge"
        background="floatingGradient"
        cardStyle="outline"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="solid"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Uomo",
          id: "#uomo",
        },
        {
          name: "Donna",
          id: "#donna",
        },
        {
          name: "Attrezzatura",
          id: "#attrezzatura",
        },
        {
          name: "Tecnologia",
          id: "#tecnologia",
        },
        {
          name: "Blog",
          id: "#blog",
        },
      ]}
      brandName="AquaTech"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitTestimonial
      useInvertedBackground={false}
      background={{
        variant: "gradient-bars",
      }}
      title="Oltre il limite dell'acqua."
      description="La miglior tecnologia per il tuo nuoto."
      testimonials={[
        {
          name: "Marco P.",
          handle: "@marco_swim",
          testimonial: "Prestazioni incredibili.",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=igo69j",
        },
        {
          name: "Giulia R.",
          handle: "@giulia_pro",
          testimonial: "Qualità eccezionale.",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ez0u8i",
        },
        {
          name: "Fabio S.",
          handle: "@fabio_sw",
          testimonial: "Ideale per competizioni.",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9mdfr7",
        },
        {
          name: "Elena M.",
          handle: "@elena_m",
          testimonial: "Tessuti che fanno la differenza.",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r155of",
        },
        {
          name: "Davide P.",
          handle: "@dave_swim",
          testimonial: "Precisione e comfort totale.",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3mctmt",
        },
      ]}
      buttons={[
        {
          text: "Scopri la collezione",
          href: "#catalogo",
        },
      ]}
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=eznira"
      imageAlt="Swimmer in action"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=eznira",
          alt: "user 1",
        },
        {
          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=j07ad6",
          alt: "user 2",
        },
        {
          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gs9m0x",
          alt: "user 3",
        },
        {
          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=84vimh",
          alt: "user 4",
        },
        {
          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hyt4za",
          alt: "user 5",
        },
      ]}
      marqueeItems={[
        {
          type: "text",
          text: "Idrodinamicità",
        },
        {
          type: "text",
          text: "Materiali Tech",
        },
        {
          type: "text",
          text: "Supporto Pro",
        },
        {
          type: "text",
          text: "Performance 100%",
        },
        {
          type: "text",
          text: "Design Avanzato",
        },
      ]}
    />
  </div>

  <div id="categories" data-section="categories">
      <FeatureCardNineteen
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          tag: "Uomo",
          title: "Abbigliamento Uomo",
          subtitle: "Comfort ed idrodinamicità",
          description: "Soluzioni tecniche per ogni bracciata.",
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=j07ad6",
        },
        {
          tag: "Donna",
          title: "Abbigliamento Donna",
          subtitle: "Stile e performance",
          description: "Tessuti avanzati per massimizzare la velocità.",
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gs9m0x",
        },
        {
          tag: "Gear",
          title: "Accessori & Attrezzatura",
          subtitle: "Occhialini, pinne, pull-buoy",
          description: "Tutto il necessario per l'agonista.",
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=84vimh",
        },
      ]}
      title="Le nostre categorie"
      description="Scegli il meglio per il tuo allenamento."
    />
  </div>

  <div id="tecnologia" data-section="tecnologia">
      <FeatureCardNineteen
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          tag: "Materiali",
          title: "Tessuti Idrodinamici",
          subtitle: "Resistenza minima",
          description: "Ottimizzati per scivolare sull'acqua.",
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hyt4za",
        },
        {
          tag: "Vision",
          title: "Lenti Polarizzate",
          subtitle: "Visione perfetta",
          description: "Elimina i riflessi in piscina o mare.",
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=f8r48q",
        },
        {
          tag: "Tech",
          title: "Chiusure Ergonomiche",
          subtitle: "Tenuta perfetta",
          description: "Sicurezza ad ogni virata.",
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xbw3dj",
        },
      ]}
      title="Focus Tecnologia"
      description="Materiali avanzati per atleti moderni."
    />
  </div>

  <div id="catalogo" data-section="catalogo">
      <ProductCatalog
      layout="section"
      products={[
        {
          id: "p1",
          name: "Occhialini Pro",
          price: "€45,00",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9blxq5",
        },
        {
          id: "p2",
          name: "Costume Performance",
          price: "€120,00",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=f6ba8k",
        },
        {
          id: "p3",
          name: "Cuffia Silikon",
          price: "€15,00",
          rating: 4,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=p95eqi",
        },
        {
          id: "p4",
          name: "Pinne Corta",
          price: "€35,00",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=lh8vz8",
        },
        {
          id: "p5",
          name: "Pull-Buoy Training",
          price: "€25,00",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kgywio",
        },
        {
          id: "p6",
          name: "Borraccia Sport",
          price: "€12,00",
          rating: 4,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2rmmo3",
        },
      ]}
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardThree
      textboxLayout="default"
      useInvertedBackground={false}
      metrics={[
        {
          id: "m1",
          icon: Award,
          title: "Atleti",
          value: "5000+",
        },
        {
          id: "m2",
          icon: Shield,
          title: "Recensioni",
          value: "4.9/5",
        },
        {
          id: "m3",
          icon: Zap,
          title: "Spedizioni",
          value: "100k+",
        },
      ]}
      title="Numeri del Brand"
      description="La fiducia dei nostri atleti."
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "Fiamme Oro",
        "Aniene",
        "Team Lombardia",
        "Swim Pro",
        "Azzurra Team",
        "Milano Nuoto",
        "Water Sport",
      ]}
      title="Partner e Community"
      description="Seguiti dai migliori club in Italia."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",
          name: "Luca B.",
          role: "Nuotatore",
          company: "Agonista",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=igo69j",
        },
        {
          id: "2",
          name: "Sara V.",
          role: "Nuotatrice",
          company: "Principiante",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ez0u8i",
        },
        {
          id: "3",
          name: "Fabio S.",
          role: "Istruttore",
          company: "Swim Team",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9mdfr7",
        },
        {
          id: "4",
          name: "Elena M.",
          role: "Nuotatrice",
          company: "Agonista",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r155of",
        },
        {
          id: "5",
          name: "Davide P.",
          role: "Triatleta",
          company: "Pro",
          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3mctmt",
        },
      ]}
      kpiItems={[
        {
          value: "5/5",
          label: "Media Voti",
        },
        {
          value: "98%",
          label: "Resi Soddisfatti",
        },
        {
          value: "24h",
          label: "Assistenza",
        },
      ]}
      title="Recensioni Clienti"
      description="Cosa dicono i nostri atleti."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "gradient-bars",
      }}
      text="Hai bisogno di assistenza? Il nostro team di Milano è a tua disposizione per consigli tecnici o supporto sugli ordini."
      buttons={[
        {
          text: "Chatta ora",
          href: "javascript:void(0)",
        },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            {
              label: "Chi siamo",
              href: "#",
            },
            {
              label: "Spedizioni",
              href: "#",
            },
            {
              label: "Resi",
              href: "#",
            },
          ],
        },
        {
          items: [
            {
              label: "Negozio Milano",
              href: "#",
            },
            {
              label: "Contatti",
              href: "#",
            },
            {
              label: "Newsletter",
              href: "#",
            },
          ],
        },
        {
          items: [
            {
              label: "Instagram",
              href: "#",
            },
            {
              label: "Facebook",
              href: "#",
            },
            {
              label: "Twitter",
              href: "#",
            },
          ],
        },
      ]}
      logoText="AquaTech"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
