"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Leaf, Recycle, Heart, Zap, ShoppingBag } from 'lucide-react';
import Link from 'next/link';

export default function HomePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="largeSizeMediumTitles"
      background="circleGradient"
      cardStyle="gradient-mesh"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen 
          brandName="Upcycled Threads"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Shop", id: "/shop" },
            { name: "Contact", id: "/contact" }
          ]}
          bottomLeftText="Sustainable Fashion"
          bottomRightText="hello@upcycledthreads.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard 
          title="Transform Old Into New"
          description="Discover sustainably crafted fashion pieces made from upcycled materials. Each garment tells a story of transformation, creativity, and environmental responsibility."
          background={{ variant: "sparkles-gradient" }}
          tag="Eco-Conscious Fashion"
          tagIcon={Leaf}
          imageSrc="https://img.b2bpic.net/free-photo/full-shot-woman-posing-fast-fashion-concept_23-2150805333.jpg"
          imageAlt="Upcycled fashion transformation showcase"
          buttons={[
            { text: "Explore Shop", href: "/shop" },
            { text: "Learn Our Story", href: "/about" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric 
          title="I transform old, forgotten garments into beautiful, wearable art. Every piece I create is unique—a celebration of creativity, sustainability, and second chances."
          useInvertedBackground="invertDefault"
          metrics={[
            { icon: Recycle, label: "Garments Upcycled", value: "500+" },
            { icon: Leaf, label: "Waste Diverted", value: "2,000 kg" },
            { icon: Heart, label: "Happy Customers", value: "1,200+" },
            { icon: Zap, label: "Years Experience", value: "5+" }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardOne 
          title="Featured Collection"
          description="Browse our latest upcycled creations. Each piece is unique and ready to find its new home."
          tag="Shop Now"
          tagIcon={ShoppingBag}
          products={[
            {
              id: "1",
              name: "Vintage Denim Jacket",
              price: "€75",
              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-young-women-posing-outdoors_23-2149412643.jpg",
              imageAlt: "Upcycled vintage denim jacket"
            },
            {
              id: "2",
              name: "Patchwork Summer Dress",
              price: "€95",
              imageSrc: "https://img.b2bpic.net/free-photo/front-view-woman-wearing-vacation-outfit_23-2150668926.jpg",
              imageAlt: "Handcrafted patchwork summer dress"
            },
            {
              id: "3",
              name: "Organic Cotton Shirt",
              price: "€65",
              imageSrc: "https://img.b2bpic.net/free-photo/casual-curly-man-handrail_23-2147678271.jpg",
              imageAlt: "Sustainable organic cotton shirt"
            },
            {
              id: "4",
              name: "Upcycled Joggers",
              price: "€85",
              imageSrc: "https://img.b2bpic.net/free-photo/woman-holding-bag-fruit-park_23-2148595056.jpg",
              imageAlt: "Comfortable upcycled joggers"
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "View Full Shop", href: "/shop" }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne 
          title="What Customers Love"
          description="Real reviews from people who've discovered their perfect upcycled piece"
          testimonials={[
            {
              id: "1",
              name: "Emma S.",
              role: "Fashion Lover",
              company: "Amsterdam",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/front-view-business-woman-suit_23-2148603018.jpg",
              imageAlt: "Customer Emma"
            },
            {
              id: "2",
              name: "Sophie D.",
              role: "Sustainability Advocate", 
              company: "Paris",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg",
              imageAlt: "Customer Sophie"
            },
            {
              id: "3",
              name: "Marcus B.",
              role: "Design Professional",
              company: "Berlin", 
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg",
              imageAlt: "Customer Marcus"
            },
            {
              id: "4",
              name: "Lisa M.",
              role: "Eco-Warrior",
              company: "Copenhagen",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-confident-corporate-woman-professional-entrepreneur-smiling-cross-arms-chest-smiling-enthusiastic-standing-white-background_1258-85600.jpg",
              imageAlt: "Customer Lisa"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText 
          text="Ready to discover your perfect upcycled piece? Get in touch with questions, custom requests, or just to share your passion for sustainable fashion."
          animationType="entrance-slide"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Contact Me", href: "/contact" },
            { text: "Follow @upcycledthreads", href: "https://instagram.com" }
          ]}
        />
      </div>

      <FooterLogoReveal logoText="Upcycled Threads" />
    </ThemeProvider>
  );
}