"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import BlogCardSix from '@/components/sections/blog/BlogCardSix';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Mail } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="smallMedium"
      sizing="largeSmallSizeLargeTitles"
      background="floatingGradient"
      cardStyle="glass-depth"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="MyLEGOCollection"
          navItems={[
            { name: "Collection", id: "featured-sets" },
            { name: "Metrics", id: "collection-metrics" },
            { name: "Gallery", id: "display-collections" },
            { name: "Contact", id: "contact-section" }
          ]}
          button={{
            text: "Explore More",            href: "#featured-sets"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCarouselLogo
          logoText="MY LEGO COLLECTION"
          description="Discover an incredible journey through thousands of bricks, sets, and memories. Explore my passion for building, collecting, and creating with LEGO."
          slides={[
            {
              imageSrc: "https://img.b2bpic.net/free-photo/flat-lay-composition-toys_23-2148144841.jpg",              imageAlt: "Colorful LEGO collection display"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/plastic-eccano-set_1398-2179.jpg",              imageAlt: "Organized LEGO sets collection"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/flat-lay-composition-toys-with-copyspace_23-2148144842.jpg",              imageAlt: "Creative LEGO building childhood toy collection"
            }
          ]}
          buttons={[
            {
              text: "View Collection",              href: "#featured-sets"
            },
            {
              text: "Learn More",              href: "#display-collections"
            }
          ]}
          autoplayDelay={5000}
          showDimOverlay={true}
          logoLineHeight={1.2}
        />
      </div>

      <div id="featured-sets" data-section="featured-sets">
        <ProductCardTwo
          title="Featured Sets"
          description="Explore the crown jewels of my collection. These sets represent the most detailed, intricate, and cherished builds in my LEGO universe."
          tag="Collection Highlights"
          products={[
            {
              id: "1",              brand: "LEGO",              name: "Ultimate Star Wars Collection",              price: "High-Value Set",              rating: 5,
              reviewCount: "2.5k pieces",              imageSrc: "https://img.b2bpic.net/free-vector/modern-spaceship-collection-with-flat-design_23-2147928240.jpg",              imageAlt: "Star Wars LEGO set with minifigures"
            },
            {
              id: "2",              brand: "LEGO",              name: "Iconic Architecture Series",              price: "Premium Display",              rating: 5,
              reviewCount: "4.2k pieces",              imageSrc: "https://img.b2bpic.net/free-vector/space-vehicles-shelf_1284-61890.jpg",              imageAlt: "Architecture LEGO set"
            },
            {
              id: "3",              brand: "LEGO",              name: "Medieval Castle Fortress",              price: "Masterpiece Build",              rating: 5,
              reviewCount: "3.8k pieces",              imageSrc: "https://img.b2bpic.net/free-vector/big-rocket-background_23-2147904172.jpg",              imageAlt: "Castle LEGO set with detailed design"
            },
            {
              id: "4",              brand: "LEGO",              name: "Technic Engineering Vehicle",              price: "Advanced Build",              rating: 5,
              reviewCount: "2.1k pieces",              imageSrc: "https://img.b2bpic.net/free-vector/black-spaceship-flying-white_1308-37862.jpg",              imageAlt: "Technic LEGO motorized vehicle"
            }
          ]}
          gridVariant="two-columns-alternating-heights"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="collection-metrics" data-section="collection-metrics">
        <MetricCardEleven
          title="Collection Statistics"
          description="By the numbers: A snapshot of my LEGO passion and dedication to the hobby."
          tag="Collection Insights"
          metrics={[
            {
              id: "1",              value: "15K+",              title: "Total Bricks",              description: "Combined pieces across all sets",              imageSrc: "https://img.b2bpic.net/free-photo/woman-placing-stacked-flowering-pots-shelf_23-2147948294.jpg",              imageAlt: "Thousands of LEGO bricks organized"
            },
            {
              id: "2",              value: "127",              title: "Complete Sets",              description: "Fully built and displayed collections",              imageSrc: "https://img.b2bpic.net/free-photo/rear-view-young-woman-placing-colorful-flowering-plants-shelf_23-2147948296.jpg",              imageAlt: "Organized LEGO set storage"
            },
            {
              id: "3",              value: "500+",              title: "Minifigures",              description: "Unique characters and variants",              imageSrc: "https://img.b2bpic.net/free-photo/happy-woman-holding-colorful-flowering-pots-front-shelf_23-2147948295.jpg",              imageAlt: "LEGO minifigure display collection"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="display-collections" data-section="display-collections">
        <BlogCardSix
          title="Collection Categories"
          description="Browse through different themes and categories of my LEGO collection. Each category tells a unique story."
          tag="Gallery"
          blogs={[
            {
              id: "1",              title: "Science Fiction & Space Sets",              tags: ["Sci-Fi", "Space", "Adventure"],
              imageSrc: "https://img.b2bpic.net/free-vector/modern-spaceship-collection-with-flat-design_23-2147928240.jpg",              imageAlt: "Science fiction LEGO collection"
            },
            {
              id: "2",              title: "Architecture & Landmarks",              tags: ["Architecture", "Design", "Premium"],
              imageSrc: "https://img.b2bpic.net/free-vector/space-vehicles-shelf_1284-61890.jpg",              imageAlt: "Architecture LEGO sets"
            },
            {
              id: "3",              title: "Medieval & Fantasy Builds",              tags: ["Fantasy", "Castle", "Historic"],
              imageSrc: "https://img.b2bpic.net/free-vector/big-rocket-background_23-2147904172.jpg",              imageAlt: "Fantasy LEGO castles"
            },
            {
              id: "4",              title: "Technic & Engineering",              tags: ["Technic", "Complex", "Motorized"],
              imageSrc: "https://img.b2bpic.net/free-vector/black-spaceship-flying-white_1308-37862.jpg",              imageAlt: "Technic LEGO engineering builds"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="recent-acquisitions" data-section="recent-acquisitions">
        <BlogCardSix
          title="Recent Acquisitions & Wishlist"
          description="Latest additions to the collection and upcoming sets on my radar. Stay tuned for new builds!"
          tag="What's New"
          blogs={[
            {
              id: "1",              title: "Just Added: Limited Edition Set",              tags: ["New Arrival", "Exclusive", "Jan 2025"],
              imageSrc: "https://img.b2bpic.net/free-photo/top-view-candy-shapes-like-building-blocks_23-2148691428.jpg",              imageAlt: "New limited edition LEGO set"
            },
            {
              id: "2",              title: "Rare Find: Discontinued Collection",              tags: ["Rare", "Collectible", "Vintage"],
              imageSrc: "https://img.b2bpic.net/free-photo/high-angle-colorful-toy-arrows-with-copy-space_23-2148490543.jpg",              imageAlt: "Rare discontinued LEGO set"
            },
            {
              id: "3",              title: "Upcoming Collab: Special Edition",              tags: ["Partnership", "Announcement", "Coming Soon"],
              imageSrc: "https://img.b2bpic.net/free-photo/fun-spelled-word-with-plastic-blocks-background_53876-14686.jpg",              imageAlt: "Special edition collaboration set"
            },
            {
              id: "4",              title: "Wishlist: Anticipated 2025 Release",              tags: ["Wishlist", "Upcoming", "Pre-order"],
              imageSrc: "https://img.b2bpic.net/free-photo/plastic-eccano-set_1398-2176.jpg",              imageAlt: "Anticipated future LEGO release"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="faq-section" data-section="faq-section">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Have questions about my collection, building process, or the hobby? Find answers here!"
          tag="Help & Info"
          faqs={[
            {
              id: "1",              title: "How did you start your LEGO collection?",              content: "My journey began with classic sets in childhood and evolved into a passion for building complex, detailed sets. What started as nostalgia transformed into serious collecting!"
            },
            {
              id: "2",              title: "How do you organize and store your collection?",              content: "I use a combination of display shelves for completed sets and organized storage bins for loose bricks, sorted by color and type. This system allows easy access while keeping everything protected."
            },
            {
              id: "3",              title: "What's your favorite set in the collection?",              content: "That's like asking a parent to choose a favorite child! But if I had to pick, it would be the ultra-detailed Architecture series—the precision and artistry are unmatched."
            },
            {
              id: "4",              title: "Do you display all your sets?",              content: "Most of my completed sets are on display, but some are carefully stored for rotation or preservation. I'm always updating the display to showcase different collections seasonally."
            },
            {
              id: "5",              title: "How much does it cost to build a collection like this?",              content: "LEGO collecting is as affordable or expensive as you make it! I've acquired sets over many years through various channels—retail, sales, secondhand markets—making it a sustainable long-term hobby."
            },
            {
              id: "6",              title: "Can I get updates on new additions to your collection?",              content: "Absolutely! Subscribe to my newsletter to get notifications about new acquisitions, collection highlights, and building projects. I also share photos regularly on social media."
            }
          ]}
          animationType="smooth"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="contact-section" data-section="contact-section">
        <ContactFaq
          ctaTitle="Connect With My Collection"
          ctaDescription="Have feedback, collaboration ideas, or want to share your own LEGO passion? Get in touch!"
          ctaButton={{
            text: "Send Message",            href: "mailto:contact@mylegocollection.com"
          }}
          ctaIcon={Mail}
          faqs={[
            {
              id: "1",              title: "Can I visit your collection in person?",              content: "I occasionally host private viewings for fellow LEGO enthusiasts and collectors. Reach out to discuss possibilities!"
            },
            {
              id: "2",              title: "Do you sell or trade sets?",              content: "I'm primarily a collector, but I'm open to discussing trades or duplicate pieces. Contact me for specific inquiries."
            },
            {
              id: "3",              title: "Can you recommend sets for beginners?",              content: "Absolutely! I love helping new collectors find their starting point. Send me a message with your interests, and I'll provide personalized recommendations."
            }
          ]}
          useInvertedBackground="noInvert"
          animationType="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="MyLEGOCollection"
          columns={[
            {
              title: "Collection",              items: [
                { label: "Featured Sets", href: "#featured-sets" },
                { label: "Gallery", href: "#display-collections" },
                { label: "Recent Acquisitions", href: "#recent-acquisitions" }
              ]
            },
            {
              title: "Community",              items: [
                { label: "FAQ", href: "#faq-section" },
                { label: "Contact", href: "#contact-section" },
                { label: "Newsletter", href: "#contact-section" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Building Tips", href: "#" },
                { label: "Collector's Guide", href: "#" },
                { label: "Storage Ideas", href: "#" }
              ]
            },
            {
              title: "Follow",              items: [
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Twitter", href: "https://twitter.com" },
                { label: "YouTube", href: "https://youtube.com" }
              ]
            }
          ]}
          copyrightText="© 2025 My LEGO Collection | Celebrating the Joy of Building"
        />
      </div>
    </ThemeProvider>
  );
}