"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import ContactCenterForm from '@/components/sections/contact/ContactCenterForm';
import FooterSplit from '@/components/sections/footer/FooterSplit';
import { Coffee, Mail, MapPin, Phone, Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="largeSmallSizeLargeTitles"
      background="noiseDiagonalGradient"
      cardStyle="glass-elevated"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="solid"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="1"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Menu", id: "products" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Order Now", href: "#products" }}
          className="bg-white shadow-lg"
          navItemClassName="text-green-700 font-semibold"
          buttonClassName="bg-green-600 hover:bg-green-700 text-white"
          buttonTextClassName="font-bold"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="1"
          description="Discover the perfect cup. Crafted with passion, served with care. Premium specialty coffee for coffee lovers."
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766749013962-htnou8d4.jpg"
          imageAlt="Freshly brewed espresso with latte art"
          frameStyle="card"
          containerClassName="bg-gradient-to-br from-green-50 to-white"
          logoClassName="text-green-700"
          descriptionClassName="text-gray-800 text-lg md:text-3xl"
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="Our Story"
          tagIcon={Coffee}
          title="Brewing Excellence Since Day One"
          description="Founded in 2015 by coffee enthusiasts who believed great coffee brings people together"
          subdescription="1 Coffee Roasters"
          icon={Sparkles}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766749014990-ucar89w4.jpg"
          imageAlt="Premium coffee beans selection"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardTwo
          products={[
            {
              id: "1",
              brand: "1",
              name: "Single Origin Ethiopia",
              price: "$18.00",
              rating: 5,
              reviewCount: "342",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766749014990-ucar89w4.jpg",
              imageAlt: "Ethiopian single origin coffee beans"
            },
            {
              id: "2",
              brand: "1",
              name: "House Blend Espresso",
              price: "$16.00",
              rating: 5,
              reviewCount: "567",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140053900-frhkawzl.jpg",
              imageAlt: "House blend espresso preparation"
            },
            {
              id: "3",
              brand: "1",
              name: "Seasonal Cold Brew",
              price: "$15.00",
              rating: 4,
              reviewCount: "289",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766749013962-htnou8d4.jpg",
              imageAlt: "Cold brew concentrate bottle"
            }
          ]}
          title="Our Coffee Selection"
          description="Handpicked beans from sustainable farms around the world"
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="three-columns-all-equal-width"
          useInvertedBackground="noInvert"
          tag="Premium Blends"
          tagIcon={Coffee}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="Best coffee shop in town! The baristas really know their craft and the atmosphere is perfect for both work and relaxation. I visit almost every day."
          rating={5}
          author="Sarah Mitchell, Coffee Enthusiast"
          avatars={[
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183587552-1pqoe5c0.jpg", alt: "Sarah Mitchell" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766154635301-vse33sxl.jpg", alt: "James Rodriguez" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183841431-v1xtegko.jpg", alt: "Emma Thompson" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766182321167-i4kvpj5f.jpg", alt: "Michael Chen" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenterForm
          title="Get in Touch"
          description="Have questions about our coffee or want to book our space for an event? Reach out to us anytime."
          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "email", type: "email", placeholder: "Your Email", required: true }
          ]}
          textarea={{ name: "message", placeholder: "Tell us about your inquiry...", rows: 5, required: true }}
          useInvertedBackground="noInvert"
          buttonText="Send Message"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSplit
          logoText="1"
          title="Quality Coffee, Sustainable Sourcing, Community Connection"
          columns={[
            {
              title: "Navigation",
              items: [
                { label: "Home", href: "#hero" },
                { label: "Menu", href: "#products" },
                { label: "About", href: "#about" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Terms of Service", href: "/terms" },
                { label: "Privacy Policy", href: "/privacy" }
              ]
            }
          ]}
          contactItems={[
            { icon: Phone, text: "(555) 123-4567" },
            { icon: Mail, text: "hello@1.com" },
            { icon: MapPin, text: "123 Coffee Lane, Brew City, BC 12345" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}