"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroSplitLarge from '@/components/sections/hero/HeroSplitLarge';
import SplitAboutMetric from '@/components/sections/about/SplitAboutMetric';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import SocialProofTwo from '@/components/sections/socialProof/SocialProofTwo';
import ContactCenterForm from '@/components/sections/contact/ContactCenterForm';
import FooterSplit from '@/components/sections/footer/FooterSplit';
import { Phone, Mail, MapPin } from "lucide-react";

export default function CoffeePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="small"
      sizing="mediumSizeExtraLargeTitles"
      background="fluid"
      cardStyle="spotlight"
      primaryButtonStyle="neon-glow-border"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Trels Coffee"
          navItems={[
            { name: "Home", id: "home" },
            { name: "About", id: "about" },
            { name: "Menu", id: "products" },
            { name: "Reviews", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Order Now",
            href: "#products"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitLarge
          title="Discover Premium Coffe Experiences"
          description="Handcrafted coffee blends made with passion and precision. From our roastery to your cup, every sip tells a story of quality and dedication."
          tag="Specialty Coffee"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140053029-sd9wbrql.jpg"
          imageAlt="Premium espresso with latte art"
          buttons={[
            { text: "Explore Menu", href: "#products" },
            { text: "Visit Us", href: "#contact" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <SplitAboutMetric
          title="Crafted With Care"
          description={[
            "At Trels, we believe great coffee starts with great beans. We source ethically grown, single-origin coffees from sustainable farms around the world. Each blend is carefully roasted in small batches to bring out unique flavors and aromas."
          ]}
          metrics={[
            { label: "Years of Coffee Excellence", value: "12+" },
            { label: "Countries Sourced From", value: "25+" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardThree
          title="What Sets Us Apart"
          description="Experience the difference quality and craft make in every cup"
          features={[
            {
              id: "01",
              title: "Expert Brewing",
              description: "Our baristas are trained in precision brewing techniques to extract the perfect cup ",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140052116-ugc31hy1.jpg",
              imageAlt: "Professional coffee brewing"
            },
            {
              id: "02",
              title: "Premium Atmosphere",
              description: "A cozy, welcoming space designed for coffee lovers to relax and connect",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140059770-hkqb0x9d.jpg",
              imageAlt: "Warm coffee shop interior"
            },
            {
              id: "03",
              title: "Uncompromising Quality",
              description: "Single-origin beans selected for their distinct flavor profiles and sustainability practices",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140054713-er1kysow.jpg",
              imageAlt: "High-quality coffee beans"
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          containerStyle="default"
          gridVariant="three-columns-all-equal-width"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardOne
          title="Our Coffee Selection"
          description="Explore our carefully curated collection of premium coffee blends"
          products={[
            {
              id: "1",
              name: "Ethiopian Yirgacheffe",
              price: "$8.50",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140060621-29xib9f7.jpg",
              imageAlt: "Ethiopian Yirgacheffe espresso"
            },
            {
              id: "2",
              name: "Italian Cappuccino",
              price: "$7.00",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140053900-frhkawzl.jpg",
              imageAlt: "Classic Italian cappuccino"
            },
            {
              id: "3",
              name: "American Americano",
              price: "$6.50",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140058956-okqwoo8n.jpg",
              imageAlt: "Strong americano"
            },
            {
              id: "4",
              name: "Silky Latte",
              price: "$7.50",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766402596830-9royz0hm.jpg",
              imageAlt: "Smooth latte with latte art"
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          containerStyle="default"
          gridVariant="four-items-2x2-equal-grid"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="Loved By Coffee Enthusiasts"
          description="Join thousands of customers who have made Trels their go-to coffee destination"
          testimonials={[
            {
              id: "1",
              name: "Sarah Mitchell",
              handle: "@sarahmitch",
              testimonial: "The best espresso I've had in years. Every visit to Trels is a ritual I look forward to.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163110158-bdk3ceda.jpg",
              imageAlt: "Sarah Mitchell"
            },
            {
              id: "2",
              name: "James Chen",
              handle: "@jamescoffee",
              testimonial: "Their attention to detail in every cup is remarkable. This is not just coffee, it's craftsmanship.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766341385475-dvyhz6kp.jpg",
              imageAlt: "James Chen"
            },
            {
              id: "3",
              name: "Emma Rodriguez",
              handle: "@emmacafes",
              testimonial: "I've visited every coffee shop in the city, but Trels stands out for quality and atmosphere.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140062551-7eyqwr2v.jpg",
              imageAlt: "Emma Rodriguez"
            },
            {
              id: "4",
              name: "Marcus Williams",
              handle: "@marcuskoffee",
              testimonial: "The sourcing transparency and ethical practices make me feel good about every purchase here.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766269123042-ekxd8aqx.jpg",
              imageAlt: "Marcus Williams"
            },
            {
              id: "5",
              name: "Jessica Lee",
              handle: "@jleemornings",
              testimonial: "Started coming for the coffee, stayed for the community. Trels feels like home.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140063369-vzpeyskp.jpg",
              imageAlt: "Jessica Lee"
            },
            {
              id: "6",
              name: "David Thompson",
              handle: "@davidroasts",
              testimonial: "As someone who roasts at home, I appreciate the skill and passion in their brews.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140061652-x0v8jc88.jpg",
              imageAlt: "David Thompson"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          speed={30}
        />
      </div>

      <div id="socialProof" data-section="socialProof">
        <SocialProofTwo
          title="Trusted By Industry Leaders"
          description="Certified sustainable and ethically sourced from respected coffee partners worldwide"
          logos={[
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766402598759-4qfwoxf2.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766402599631-qyju1v15.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766402600475-c0btheep.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766402601343-ncbs0tmb.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766402602479-olcxbx58.jpg"
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenterForm
          title="Get In Touch"
          description="Have questions or want to order? Reach out and join our coffee community."
          inputs={[
            {
              name: "name",
              type: "text",
              placeholder: "Your name",
              required: true
            },
            {
              name: "email",
              type: "email",
              placeholder: "Your email",
              required: true
            },
            {
              name: "phone",
              type: "tel",
              placeholder: "Phone number",
              required: false
            }
          ]}
          textarea={{
            name: "message",
            placeholder: "Tell us about your visit or inquiry...",
            rows: 5,
            required: true
          }}
          useInvertedBackground="noInvert"
          buttonText="Send Message"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSplit
          logoText="Trels Coffee"
          title="Brewing excellence since day one, one cup at a time"
          columns={[
            {
              title: "Menu",
              items: [
                { label: "Espresso Drinks", href: "#products" },
                { label: "Cold Brew", href: "#products" },
                { label: "Specialty Blends", href: "#products" }
              ]
            },
            {
              title: "About",
              items: [
                { label: "Our Story", href: "#about" },
                { label: "Sourcing", href: "#about" },
                { label: "Sustainability", href: "#about" }
              ]
            },
            {
              title: "Connect",
              items: [
                { label: "Contact Us", href: "#contact" },
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Newsletter", href: "#contact" }
              ]
            }
          ]}
          contactItems={[
            { icon: Phone, text: "(555) 123-4567" },
            { icon: Mail, text: "hello@trelscoffee.com" },
            { icon: MapPin, text: "123 Coffee Street, Brew City, BC 12345" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
