"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import { Award, Bell, Car, Diamond, Facebook, Film, Instagram, ShieldCheck, Twitter, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="background-highlight"
        borderRadius="pill"
        contentWidth="medium"
        sizing="mediumLarge"
        background="floatingGradient"
        cardStyle="outline"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",          id: "#hero"},
        {
          name: "About Us",          id: "#about"},
        {
          name: "Products",          id: "#products"},
        {
          name: "Features",          id: "#features"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "FAQ",          id: "#faq"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      logoSrc="http://img.b2bpic.net/free-photo/anime-girls-with-guns-cyberpunk-city_23-2151975927.jpg"
      logoAlt="Postiiify Logo"
      brandName="Postiiify"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardScroll
      background={{
        variant: "sparkles-gradient"}}
      title="Unleash Your Fandom"
      description="Discover a vast collection of high-quality anime posters and action figures from your favorite series. Bring your passion to life with Postiiify."
      buttons={[
        {
          text: "Shop Posters",          href: "#products"},
        {
          text: "Explore Figures",          href: "#products"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/black-friday-sales_23-2152020727.jpg"
      imageAlt="Dynamic collage of anime characters and action figures"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="about" data-section="about">
      <MetricSplitMediaAbout
      useInvertedBackground={false}
      title="Who We Are: Postiiify"
      description="Postiiify is dedicated to bringing the vibrant world of anime directly to your home. We meticulously curate authentic posters and articulated action figures, ensuring every piece meets the highest standards for true collectors and fans alike."
      metrics={[
        {
          value: "10,000+",          title: "Happy Collectors"},
        {
          value: "500+",          title: "Unique Figures"},
        {
          value: "1,000+",          title: "Stunning Posters"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/portrait-anime-character-shopping-cartoon-style_23-2151644383.jpg"
      imageAlt="A person admiring a curated anime collection on a shelf"
      mediaAnimation="slide-up"
      metricsAnimation="blur-reveal"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyFour
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "f1",          title: "Epic Posters & Art Prints",          author: "Postiiify Originals",          description: "Adorn your walls with breathtaking art from your favorite series. Our posters feature crisp details and vibrant colors, printed on high-quality stock.",          tags: [
            "Visuals",            "Decor",            "Collectible"],
          imageSrc: "http://img.b2bpic.net/free-photo/flower-with-psychedelic-painting_23-2149372237.jpg",          imageAlt: "High-quality anime poster detail"},
        {
          id: "f2",          title: "Dynamic Action Figures",          author: "Articulated Series",          description: "Bring your heroes to life! Explore highly detailed, articulated action figures that capture the essence of iconic characters, perfect for display and play.",          tags: [
            "Figures",            "Poseable",            "Premium"],
          imageSrc: "http://img.b2bpic.net/free-photo/still-life-cosmetic-products_23-2149163137.jpg",          imageAlt: "Articulated anime action figure in a dynamic pose"},
        {
          id: "f3",          title: "Exclusive Drops & Limited Editions",          author: "Rare Finds",          description: "Be the first to get your hands on rare and exclusive anime merchandise. Our limited edition drops are a must-have for serious collectors.",          tags: [
            "Limited",            "Exclusive",            "Rare"],
          imageSrc: "http://img.b2bpic.net/free-photo/top-view-tampons_23-2148025774.jpg",          imageAlt: "Limited edition anime merchandise box"},
      ]}
      title="Collect Beyond Limits"
      description="Dive into our expertly curated selection, featuring rare finds and popular characters across genres. Each item is chosen for its quality and collectible value."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      products={[
        {
          id: "p1",          name: "Crimson Blade Samurai Figure",          price: "$79.99",          imageSrc: "http://img.b2bpic.net/free-photo/conceptual-3d-illustration-basketball-player-dunking-motion-design_183364-124101.jpg",          imageAlt: "Crimson Blade Samurai Figure"},
        {
          id: "p2",          name: "Neon City Guardian Poster",          price: "$29.99",          imageSrc: "http://img.b2bpic.net/free-photo/cityscape-anime-inspired-urban-area_23-2151028712.jpg",          imageAlt: "Neon City Guardian Poster"},
        {
          id: "p3",          name: "Chibi Adventure Squad Set",          price: "$54.99",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-pink-play-dough-monster_23-2149554794.jpg",          imageAlt: "Chibi Adventure Squad Set"},
        {
          id: "p4",          name: "Retro Space Opera Poster",          price: "$24.99",          imageSrc: "http://img.b2bpic.net/free-photo/anime-character-using-virtual-reality-glasses-metaverse_23-2151568882.jpg",          imageAlt: "Retro Space Opera Poster"},
        {
          id: "p5",          name: "Shadow Scion Action Figure",          price: "$89.99",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-girl-with-spiders-face_23-2147695040.jpg",          imageAlt: "Shadow Scion Action Figure"},
        {
          id: "p6",          name: "Minimalist Hero Art Print",          price: "$19.99",          imageSrc: "http://img.b2bpic.net/free-photo/digital-art-fire_23-2151104480.jpg",          imageAlt: "Minimalist Hero Art Print"},
      ]}
      title="Our Top Collections"
      description="Browse our best-selling posters and fan-favorite action figures. Find the perfect addition to your collection or a gift for a fellow enthusiast."
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "Crunchyroll",        "Funimation",        "Kodansha",        "Aniplex",        "Bandai Namco",        "Good Smile Company",        "Square Enix",        "Toei Animation"]}
      title="Trusted by the Anime Community"
      description="Our collections feature characters and art from the most beloved anime series and acclaimed studios, celebrated by fans worldwide."
      speed={50}
      showCard={true}
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSix
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Sarah J.",          handle: "@AnimeFanatic88",          testimonial: "Postiiify has the best selection of anime posters! The quality is amazing, and they look fantastic in my room. Highly recommend for any serious collector!",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-anime-character-shopping-cartoon-style_23-2151644421.jpg",          imageAlt: "Happy young woman anime fan"},
        {
          id: "t2",          name: "Mark D.",          handle: "@FigureCollector",          testimonial: "The action figures from Postiiify are top-notch. Incredible detail and articulation. My favorite shop for expanding my collection!",          imageSrc: "http://img.b2bpic.net/free-photo/anime-style-characters-space_23-2151134243.jpg",          imageAlt: "Man proudly showing off action figure"},
        {
          id: "t3",          name: "Emily R.",          handle: "@MangaLover22",          testimonial: "I always find unique pieces here. The exclusive drops are a game-changer! Postiiify truly understands what collectors want.",          imageSrc: "http://img.b2bpic.net/free-photo/unpleased-young-student-girl-wearing-bandana-sunglasses-headphones-around-neck-showing-large-note-pad-looking-camera-showing-thumb-down-isolated-blue-background_141793-138962.jpg",          imageAlt: "Teenager posing with favorite anime poster"},
        {
          id: "t4",          name: "David K.",          handle: "@OtakuGamer",          testimonial: "Fast shipping and perfect packaging. My figures arrived in pristine condition. Postiiify is my go-to for all things anime collectibles.",          imageSrc: "http://img.b2bpic.net/free-photo/happy-man-celebrating-manifesting-himself-after-being-victorious-videogame_482257-121663.jpg",          imageAlt: "Gamer with anime figures setup"},
        {
          id: "t5",          name: "Jessica L.",          handle: "@CosplayQueen",          testimonial: "The artwork on their posters is stunning! It adds so much character to my cosplay studio. Postiiify makes my space feel more alive.",          imageSrc: "http://img.b2bpic.net/free-photo/man-wear-cheongsam-is-standing-respect-customer-who-come-shop-chinese-new-year_1150-35828.jpg",          imageAlt: "Female cosplayer with anime accessories"},
        {
          id: "t6",          name: "Alex P.",          handle: "@FigurineFan",          testimonial: "Absolutely thrilled with my recent purchase! The detail on the action figure is phenomenal, and it arrived super fast. Postiiify is a gem.",          imageSrc: "http://img.b2bpic.net/free-photo/view-cartoon-character-shopping_23-2151656752.jpg",          imageAlt: "View of cartoon character shopping"},
      ]}
      title="What Our Collectors Say"
      description="Hear directly from our passionate community about their Postiiify experience and treasured finds."
      speed={35}
      topMarqueeDirection="right"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",          title: "What payment methods do you accept?",          content: "We accept all major credit cards (Visa, MasterCard, Amex), PayPal, and other secure payment options. All transactions are encrypted for your safety."},
        {
          id: "q2",          title: "How long does shipping take?",          content: "Shipping times vary based on your location and the product. Standard shipping typically takes 5-7 business days within the US, while international shipping can take 10-20 business days."},
        {
          id: "q3",          title: "Do you offer international shipping?",          content: "Yes, we proudly ship our anime posters and action figures worldwide! Shipping costs and delivery times will be calculated at checkout."},
        {
          id: "q4",          title: "What is your return policy?",          content: "We offer a 30-day return policy on all unopened and undamaged items. If you're not satisfied, please contact our support team for assistance."},
        {
          id: "q5",          title: "How do I track my order?",          content: "Once your order has shipped, you will receive a confirmation email with a tracking number. You can use this number on our website's 'Track Order' page or the carrier's website."},
      ]}
      title="Your Questions Answered"
      description="Find quick answers to common questions about our products, shipping, and order process. We're here to help you enjoy your collection."
      faqsAnimation="blur-reveal"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Get in Touch"
      description="Have a question about an order, a specific product, or just want to share your passion? We'd love to hear from you. Fill out the form below or reach out directly."
      inputs={[
        {
          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
        },
        {
          name: "email",          type: "email",          placeholder: "Your Email",          required: true,
        },
      ]}
      textarea={{
        name: "message",        placeholder: "Your Message",        rows: 5,
        required: true,
      }}
      imageSrc="http://img.b2bpic.net/free-photo/mystical-canyon-vista-with-stargazing_23-2152016851.jpg"
      imageAlt="Anime character looking at a starry sky, representing connection"
      mediaAnimation="opacity"
      mediaPosition="right"
      buttonText="Send Message"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoSrc="http://img.b2bpic.net/free-photo/anime-girls-with-guns-cyberpunk-city_23-2151975927.jpg"
      logoAlt="Postiiify Logo"
      logoText="Postiiify"
      copyrightText="© 2024 Postiiify. All rights reserved."
      socialLinks={[
        {
          icon: Instagram,
          href: "#",          ariaLabel: "Instagram"},
        {
          icon: Facebook,
          href: "#",          ariaLabel: "Facebook"},
        {
          icon: Twitter,
          href: "#",          ariaLabel: "Twitter"},
        {
          icon: Film,
          href: "#",          ariaLabel: "YouTube"},
        {
          icon: Bell,
          href: "#",          ariaLabel: "Discord"},
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}