"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { Award, Star, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="directional-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="mediumLarge"
        sizing="largeSmall"
        background="circleGradient"
        cardStyle="inset"
        primaryButtonStyle="flat"
        secondaryButtonStyle="solid"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Home",
          id: "hero",
        },
        {
          name: "Features",
          id: "features",
        },
        {
          name: "Products",
          id: "catalog",
        },
        {
          name: "Testimonials",
          id: "testimonials",
        },
        {
          name: "FAQ",
          id: "faq",
        },
        {
          name: "Contact",
          id: "contact",
        },
      ]}
      brandName="LuxeCurate"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroLogoBillboard
      background={{
        variant: "sparkles-gradient",
      }}
      logoText="LuxeCurate"
      description="Exquisite, hand-picked treasures for the modern connoisseur. Experience the pinnacle of curated elegance."
      buttons={[
        {
          text: "Explore Catalog",
          href: "#catalog",
        },
        {
          text: "Contact Us",
          href: "#contact",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/luxury-retro-wall-lamp-cafe_1150-10890.jpg?_wi=1"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="metrics" data-section="metrics">
      <AboutMetric
      useInvertedBackground={false}
      title="Unrivaled Quality"
      metrics={[
        {
          icon: Star,
          label: "Items Curated",
          value: "500+",
        },
        {
          icon: Award,
          label: "Years Active",
          value: "12",
        },
        {
          icon: Users,
          label: "Happy Clients",
          value: "10K+",
        },
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardEight
      textboxLayout="default"
      useInvertedBackground={true}
      features={[
        {
          title: "Expert Curation",
          description: "Every item is vetted for quality and provenance.",
          imageSrc: "http://img.b2bpic.net/free-photo/closeup-bottles-with-dispensers-liquid-soap_169016-23684.jpg?_wi=1",
        },
        {
          title: "Worldwide Shipping",
          description: "Safe, insured, and expedited delivery to your door.",
          imageSrc: "http://img.b2bpic.net/free-photo/golden-easter-eggs-by-easter-decorations_1303-30802.jpg?_wi=1",
        },
        {
          title: "Concierge Support",
          description: "Dedicated assistance for your every acquisition.",
          imageSrc: "http://img.b2bpic.net/free-photo/3d-tree-with-sunlight-background_23-2150698088.jpg?_wi=1",
        },
      ]}
      title="Why Choose LuxeCurate"
      description="Discover what sets our collection apart from the rest of the market."
    />
  </div>

  <div id="catalog" data-section="catalog">
      <ProductCatalog
      layout="section"
      products={[
        {
          id: "p1",
          name: "Golden Cuff",
          price: "$120",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-still-life_23-2150176762.jpg",
        },
        {
          id: "p2",
          name: "Ceramic Vase",
          price: "$350",
          rating: 4,
          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-covid-party-with-masks_23-2149299867.jpg",
        },
        {
          id: "p3",
          name: "Leather Journal",
          price: "$85",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/unhappy-woman-black-jacket-eyeglasses-talks-phone-outside-modern-woman-with-red-lips-curly-hair-sits-outdoors_197531-19317.jpg",
        },
        {
          id: "p4",
          name: "Marble Tray",
          price: "$290",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/three-grey-credit-cards-white-platforms_187299-48079.jpg?_wi=1",
        },
        {
          id: "p5",
          name: "Silk Scarf",
          price: "$150",
          rating: 4,
          imageSrc: "http://img.b2bpic.net/free-photo/chinese-new-year-2021-envelope-flower-long-shot_23-2148763954.jpg",
        },
        {
          id: "p6",
          name: "Artisan Candle",
          price: "$60",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/brunette-girl-woman-white-fur-coat-girl-counter_1157-47300.jpg",
        },
      ]}
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",
          name: "Alice M.",
          date: "Jan 2024",
          title: "Collector",
          quote: "Simply exquisite service and products.",
          tag: "Verified",
          avatarSrc: "http://img.b2bpic.net/free-photo/smiling-woman-leaning-wall_250224-223.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/luxury-retro-wall-lamp-cafe_1150-10890.jpg?_wi=2",
          imageAlt: "minimalist portrait professional studio",
        },
        {
          id: "t2",
          name: "Robert B.",
          date: "Dec 2023",
          title: "Designer",
          quote: "The curation is truly unmatched in elegance.",
          tag: "Verified",
          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-blonde-short-haired-woman-posing-white-shirt_23-2149021781.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/closeup-bottles-with-dispensers-liquid-soap_169016-23684.jpg?_wi=2",
          imageAlt: "minimalist portrait professional studio",
        },
        {
          id: "t3",
          name: "Sarah J.",
          date: "Nov 2023",
          title: "Architect",
          quote: "Every item feels special and timeless.",
          tag: "Verified",
          avatarSrc: "http://img.b2bpic.net/free-vector/beautiful-seamless-golden-pattern-background_1055-8106.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/golden-easter-eggs-by-easter-decorations_1303-30802.jpg?_wi=2",
          imageAlt: "minimalist portrait professional studio",
        },
        {
          id: "t4",
          name: "Thomas K.",
          date: "Oct 2023",
          title: "Collector",
          quote: "A wonderful journey from start to finish.",
          tag: "Verified",
          avatarSrc: "http://img.b2bpic.net/free-photo/young-woman-enjoying-cup-coffee_23-2148415879.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/3d-tree-with-sunlight-background_23-2150698088.jpg?_wi=2",
          imageAlt: "minimalist portrait professional studio",
        },
        {
          id: "t5",
          name: "Emily P.",
          date: "Sep 2023",
          title: "Entrepreneur",
          quote: "I find myself returning for every new launch.",
          tag: "Verified",
          avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-spotlight_23-2149304646.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/three-grey-credit-cards-white-platforms_187299-48079.jpg?_wi=2",
          imageAlt: "minimalist portrait professional studio",
        },
      ]}
      title="Client Reflections"
      description="See what our discerning clients say about their experience with LuxeCurate."
    />
  </div>

  <div id="social" data-section="social">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Vogue",
        "Harper",
        "Elle",
        "AD",
        "GQ",
        "Wallpaper",
        "Kinfolk",
      ]}
      title="Featured In"
      description="We are honored to be highlighted by leading industry publications."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitText
      useInvertedBackground={false}
      faqs={[
        {
          id: "f1",
          title: "What is the return policy?",
          content: "We offer a 30-day return policy for all unworn goods.",
        },
        {
          id: "f2",
          title: "Are items authentic?",
          content: "Yes, all items go through a rigorous authentication process.",
        },
        {
          id: "f3",
          title: "Do you ship internationally?",
          content: "Yes, we ship to over 100 countries globally.",
        },
      ]}
      sideTitle="Questions?"
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      useInvertedBackground={true}
      background={{
        variant: "plain",
      }}
      tag="Newsletter"
      title="Stay Updated"
      description="Join our community to receive early access to new curated drops."
      imageSrc="http://img.b2bpic.net/free-photo/long-corridor-showcase_1127-3441.jpg"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            {
              label: "About",
              href: "#",
            },
            {
              label: "Catalog",
              href: "#catalog",
            },
          ],
        },
        {
          items: [
            {
              label: "FAQ",
              href: "#faq",
            },
            {
              label: "Support",
              href: "#",
            },
          ],
        },
        {
          items: [
            {
              label: "Instagram",
              href: "#",
            },
            {
              label: "Twitter",
              href: "#",
            },
          ],
        },
      ]}
      logoText="LuxeCurate"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
