"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureBento from '@/components/sections/feature/FeatureBento';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="directional-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="smallMedium"
        sizing="mediumLargeSizeMediumTitles"
        background="fluid"
        cardStyle="solid"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Home",          id: "#hero"},
        {
          name: "New Arrivals",          id: "#products"},
        {
          name: "Best-Sellers",          id: "#best-sellers"},
        {
          name: "Collection Deep Dive",          id: "#garment-feature"},
        {
          name: "Our Story",          id: "#about"},
        {
          name: "Journal",          id: "#blog"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=16g93f"
      logoAlt="Elegance Atelier Logo"
      brandName="Elegance Atelier"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroLogoBillboard
      background={{
        variant: "radial-gradient"}}
      logoText="Elegance Atelier"
      description="Discover the latest collection of exquisite British luxury fashion. Timeless designs, unparalleled craftsmanship."
      buttons={[
        {
          text: "Shop New Arrivals",          href: "#products"},
        {
          text: "Explore Collection",          href: "#garment-feature"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/woman-portrait-indoors_624325-3431.jpg"
      videoSrc="http://img.b2bpic.net/free-photo/full-shot-woman-posing-night-with-flash_23-2150204461.jpg"
      imageAlt="Model showcasing Elegance Atelier's latest collection"
      videoAriaLabel="Video of a high-fashion model on the runway"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={true}
      heading={[
        {
          type: "text",          content: "Crafting British Luxury Fashion"},
      ]}
      buttons={[
        {
          text: "Our Story",          href: "#about"},
      ]}
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      products={[
        {
          id: "product-1",          name: "The Amelie Gown",          price: "£1,850",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-female-with-blond-curly-hair_613910-7022.jpg",          imageAlt: "Elegant evening gown"},
        {
          id: "product-2",          name: "Tailored Silk Blazer",          price: "£980",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-sexy-rich-business-woman-red-suit-walking-city-street-spring-summer-fashion-trend_285396-6802.jpg",          imageAlt: "Chic tailored silk blazer"},
        {
          id: "product-3",          name: "Cashmere Knit Jumper",          price: "£520",          imageSrc: "http://img.b2bpic.net/free-photo/model-touching-her-new-jacket_132075-14010.jpg",          imageAlt: "Luxury cashmere knit jumper"},
        {
          id: "product-4",          name: "Floral Midi Dress",          price: "£750",          imageSrc: "http://img.b2bpic.net/free-photo/elegant-women-with-shopping-bags-city_1157-26789.jpg",          imageAlt: "Elegant floral midi dress"},
        {
          id: "product-5",          name: "Classic Wool Trench",          price: "£1,200",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-afro-american-man-his-bicycle_23-2148828182.jpg",          imageAlt: "Classic wool trench coat"},
        {
          id: "product-6",          name: "Embroidered Blouse",          price: "£610",          imageSrc: "http://img.b2bpic.net/free-photo/awesome-blond-woman-blue-dress-posing-modern-bathroom_613910-10878.jpg",          imageAlt: "Detailed embroidered blouse"},
      ]}
      title="New Arrivals"
      description="Experience the epitome of British elegance. Our latest collection blends classic silhouettes with contemporary flair, crafted from the finest materials. Prices are in British Pounds (£)"
    />
  </div>

  <div id="garment-feature" data-section="garment-feature">
      <FeatureBento
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      features={[
        {
          title: "360° Garment View",          description: "Spin and zoom to appreciate every detail of the fabric and intricate lace work. Feel the texture digitally.",          bentoComponent: "media-stack",          items: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-fabric-material_23-2148817520.jpg",              imageAlt: "3D model of the Amelie Gown, showing intricate details"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/top-view-fabric_23-2148817485.jpg",              imageAlt: "Fabric texture overview"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/close-up-cozy-texture-clothing_23-2149432472.jpg",              imageAlt: "Detailed view of clothing texture"}
          ]
        },
        {
          title: "Runway Showcase",          description: "See the Amelie Gown in motion, capturing its fluid drape and elegant silhouette on the latest runway.",          bentoComponent: "media-stack",          items: [
            {
              videoSrc: "http://img.b2bpic.net/free-photo/fabric-textured-background_53876-32156.jpg"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/full-shot-beautiful-model_23-2148323579.jpg",              imageAlt: "Full shot of beautiful model"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-outdoors_23-2148323531.jpg",              imageAlt: "Full shot of woman outdoors"}
          ]
        }
      ]}
      title="The Amelie Gown: A Closer Look"
      description="Exquisite tailoring meets luxurious fabric. Explore every intricate detail of our signature Amelie Gown, from its delicate lace accents to the flowing silk drape, presented with a 360-degree view and cinematic video. Purchase with a 30% advance payment option at checkout."
    />
  </div>

  <div id="best-sellers" data-section="best-sellers">
    <ProductCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="four-items-2x2-equal-grid"
      useInvertedBackground={false}
      title="Best-Selling Products"
      description="Our most beloved pieces, cherished by customers for their exceptional quality and timeless design."
      products={[
        {
          id: "bestseller-1",          brand: "Elegance Atelier",          name: "The Regal Wrap Dress",          price: "£1,500",          rating: 5,
          reviewCount: "120",          imageSrc: "http://img.b2bpic.net/free-photo/gorgeous-blonde-lady-red-stylish-hat-sitting-cafe-wonderful-young-woman-with-dark-hair-red-beret-posing_197531-27663.jpg",          imageAlt: "Elegant wrap dress"
        },
        {
          id: "bestseller-2",          brand: "Elegance Atelier",          name: "Signature Silk Scarf",          price: "£350",          rating: 5,
          reviewCount: "85",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-fashion-details-stylish-woman-purple-suit-walking-city-street-spring-summer-autumn-season-fashion-trend-holding-purse_285396-6994.jpg?_wi=1",          imageAlt: "Luxury silk scarf"
        },
        {
          id: "bestseller-3",          brand: "Elegance Atelier",          name: "Luxury Leather Handbag",          price: "£2,100",          rating: 5,
          reviewCount: "150",          imageSrc: "http://img.b2bpic.net/free-photo/girl-posing-on-studio-with-bag_132075-14187.jpg",          imageAlt: "Premium leather handbag"
        },
        {
          id: "bestseller-4",          brand: "Elegance Atelier",          name: "Embroidered Evening Clutch",          price: "£780",          rating: 4,
          reviewCount: "90",          imageSrc: "http://img.b2bpic.net/free-photo/charming-lady-red-stylish-beret-smiling-sitting-sofa-wonderful-young-woman-with-dark-hair-beige-coat-posing_197531-27623.jpg?_wi=1",          imageAlt: "Exquisite evening clutch"
        }
      ]}
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "Vogue",        "Harper's Bazaar",        "Elle",        "The Times",        "The Guardian",        "British Fashion Council",        "Luxury Lifestyle Magazine"]}
      title="Trusted by Industry Insiders"
      description="Our designs are celebrated by leading fashion critics and featured in prestigious publications globally."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "1",          name: "Lady Eleanor Vance",          role: "Philanthropist",          company: "Vance Estates",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-smiling-girl-trendy-summer-light-pink-dress-sexy-carefree-woman-posing-positive-model-having-fun_158538-5135.jpg",          imageAlt: "Portrait of Lady Eleanor Vance"},
        {
          id: "2",          name: "Dr. Anya Sharma",          role: "CEO, AstraTech",          company: "AstraTech",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/smiling-cute-young-business-lady-talking-phone_1262-2425.jpg",          imageAlt: "Portrait of Dr. Anya Sharma"},
        {
          id: "3",          name: "Isabella Rossi",          role: "Fashion Editor",          company: "Chic & Style Magazine",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/charming-lady-red-stylish-beret-smiling-sitting-sofa-wonderful-young-woman-with-dark-hair-beige-coat-posing_197531-27623.jpg?_wi=2",          imageAlt: "Portrait of Isabella Rossi"},
        {
          id: "4",          name: "Chloe Davies",          role: "Creative Director",          company: "Davies & Co.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/sexy-fbi-female-agent-abadoned-place_627829-8700.jpg",          imageAlt: "Portrait of Chloe Davies"},
        {
          id: "5",          name: "Dame Vivienne Sterling",          role: "Renowned Actress",          company: "British Arts Guild",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-bride-elegant-white-wedding-dress_1296-480.jpg",          imageAlt: "Portrait of Dame Vivienne Sterling"},
      ]}
      kpiItems={[
        {
          value: "100%",          label: "Craftsmanship"},
        {
          value: "99%",          label: "Client Satisfaction"},
        {
          value: "5-Star",          label: "Average Rating"},
      ]}
      title="What Our Clients Say"
      description="Hear from women who embody Elegance Atelier's sophisticated style and appreciate our uncompromising quality."
    />
  </div>

  <div id="blog" data-section="blog">
      <BlogCardOne
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      title="The Atelier Journal"
      description="Dive into the world of luxury fashion, style guides, and behind-the-scenes stories from Elegance Atelier."
      blogs={[
        {
          id: "1",          category: "Editorial",          title: "The Future of British Couture",          excerpt: "Exploring innovation and heritage in our latest collection.",          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-outside-night-street-with-lights_1303-17052.jpg",          imageAlt: "Fashion editorial spread",          authorName: "Elegance Atelier Team",          authorAvatar: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-business-woman_158595-4753.jpg",          date: "October 26, 2024"
        },
        {
          id: "2",          category: "Behind the Seams",          title: "A Day in the Atelier",          excerpt: "A glimpse into the meticulous craftsmanship behind every garment.",          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-painting-indoors_23-2150182592.jpg",          imageAlt: "Designer working in an atelier",          authorName: "Elegance Atelier Team",          authorAvatar: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-business-woman_158595-4753.jpg",          date: "November 5, 2024"
        },
        {
          id: "3",          category: "Style Guide",          title: "Curating Your Luxury Wardrobe",          excerpt: "Timeless pieces and how to style them for every occasion.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-fashion-details-stylish-woman-purple-suit-walking-city-street-spring-summer-autumn-season-fashion-trend-holding-purse_285396-6994.jpg?_wi=2",          imageAlt: "Stylish wardrobe with luxury items",          authorName: "Elegance Atelier Team",          authorAvatar: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-business-woman_158595-4753.jpg",          date: "November 12, 2024"
        },
      ]}
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={true}
      background={{
        variant: "radial-gradient"}}
      tag="Connect"
      title="Let's Talk British Elegance"
      description="Reach out to our team for styling advice, bespoke inquiries, or any questions about our collections."
      inputPlaceholder="Your Email Address"
      buttonText="Send Inquiry"
      termsText="By sending an inquiry, you agree to our Privacy Policy and Terms of Service."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        {
          title: "Shop",          items: [
            {
              label: "New Arrivals",              href: "#products"},
            {
              label: "Collections",              href: "#products"},
            {
              label: "Bespoke",              href: "#contact"},
          ],
        },
        {
          title: "About Us",          items: [
            {
              label: "Our Story",              href: "#about"},
            {
              label: "Craftsmanship",              href: "#about"},
            {
              label: "Journal",              href: "#blog"},
          ],
        },
        {
          title: "Support",          items: [
            {
              label: "Contact",              href: "#contact"},
            {
              label: "FAQs",              href: "#"},
            {
              label: "Shipping & Returns",              href: "#"},
          ],
        },
      ]}
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=16g93f"
      logoAlt="Elegance Atelier Logo"
      logoText="Elegance Atelier"
      copyrightText="© 2024 Elegance Atelier. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}