"use client";

import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import MediaSplitAbout from '@/components/sections/about/MediaSplitAbout';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import MetricCardEight from '@/components/sections/metrics/MetricCardEight';
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactCenterForm from '@/components/sections/contact/ContactCenterForm';
import FooterBase from '@/components/sections/footer/FooterBase';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="mediumLargeSizeMediumTitles"
      background="noiseDiagonalGradient"
      cardStyle="outline-light"
      primaryButtonStyle="outline"
      secondaryButtonStyle="layered"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Tokyo Butcher"
          navItems={[
            { name: "About", id: "about" },
            { name: "Products", id: "products" },
            { name: "Team", id: "team" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="TOKYO BUTCHER"
          description="Authentic Japanese butcher since 1998. Premium cuts, traditional craftsmanship, and uncompromising quality for discerning customers."
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767106433742-nlofgqtd.jpg"
          imageAlt="Tokyo Butcher Shop Interior"
          frameStyle="card"
          logoLineHeight={1.2}
          ariaLabel="Tokyo Butcher Hero Section"
        />
      </div>

      <div id="about" data-section="about">
        <MediaSplitAbout
          title="Our Story"
          description="For over 25 years, Tokyo Butcher has been dedicated to sourcing and preparing the finest meats in Japan. Our master butchers combine traditional techniques with modern quality standards, ensuring every cut meets our exacting standards. We work directly with local farms and trusted suppliers to bring you the best of Japan's meat heritage."
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767106434616-vs7j7lmt.jpg"
          imageAlt="Butcher Master at Work"
          imagePosition="right"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Learn More", href: "#products" }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardOne
          title="Premium Selections"
          description="Handpicked meats from our curated collection. Each product represents our commitment to quality and excellence."
          products={[
            {
              id: "1",
              name: "Japanese Wagyu",
              price: "¥12,000/kg",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767106436500-zc1dej9u.jpg",
              imageAlt: "Premium Japanese Wagyu Beef"
            },
            {
              id: "2",
              name: "Free-Range Pork",
              price: "¥3,500/kg",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767106437342-6su9hbqa.jpg",
              imageAlt: "Premium Pork Cuts"
            },
            {
              id: "3",
              name: "Heritage Chicken",
              price: "¥2,800/kg",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767106438210-yurgpo9w.jpg",
              imageAlt: "Premium Chicken Selection"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEight
          title="Our Commitment to Excellence and Customer Satisfaction"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767106435425-5d9hki02.jpg"
          imageAlt="Quality Assurance in Butchery"
          metrics={[
            { id: "1", value: "25+", title: "Years of Experience" },
            { id: "2", value: "500+", title: "Regular Customers" },
            { id: "3", value: "98%", title: "Quality Rating" },
            { id: "4", value: "15+", title: "Premium Cuts" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardEleven
          title="Meet Our Master Butchers"
          description="Experienced professionals dedicated to the art of butchery and quality meat preparation"
          groups={[
            {
              id: "masters",
              groupTitle: "Master Butchers",
              members: [
                {
                  id: "1",
                  title: "Taro Yamamoto",
                  subtitle: "Head Master Butcher",
                  detail: "25 years of experience in Japanese butchery tradition",
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767106435425-5d9hki02.jpg",
                  imageAlt: "Taro Yamamoto"
                },
                {
                  id: "2",
                  title: "Kenji Nakamura",
                  subtitle: "Senior Butcher",
                  detail: "Specialist in wagyu and premium cuts",
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767106433742-nlofgqtd.jpg",
                  imageAlt: "Kenji Nakamura"
                }
              ]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardEight
          title="What Our Customers Say"
          description="Trusted by Tokyo's finest restaurants and households for premium meat quality"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",
              name: "Hiroshi Suzuki",
              role: "Head Chef",
              company: "Michelin Star Restaurant",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184197576-xe6oube6.jpg",
              imageAlt: "Chef Hiroshi Suzuki"
            },
            {
              id: "2",
              name: "Yuki Tanaka",
              role: "Restaurant Owner",
              company: "Izakaya Tanaka",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183840246-543e8kk4.jpg",
              imageAlt: "Yuki Tanaka"
            },
            {
              id: "3",
              name: "Masao Kobayashi",
              role: "Executive Chef",
              company: "Hotel Tokyo Elite",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183827933-jsmix0wr.jpg",
              imageAlt: "Chef Masao Kobayashi"
            },
            {
              id: "4",
              name: "Akiko Yamamoto",
              role: "Home Cook",
              company: "Tokyo Local",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766278834679-mepfz8op.jpg",
              imageAlt: "Akiko Yamamoto"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Everything you need to know about our products and services"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          faqs={[
            {
              id: "1",
              title: "What makes your meat premium quality?",
              content: "Our meats come from carefully selected local and regional suppliers who meet our strict quality standards. We personally inspect every cut and only accept the highest grades of meat for our customers."
            },
            {
              id: "2",
              title: "Do you offer custom cuts?",
              content: "Yes! Our master butchers can prepare custom cuts according to your specific requirements. Please contact us directly to discuss your needs."
            },
            {
              id: "3",
              title: "Can you deliver to my home?",
              content: "We offer delivery services within Tokyo for orders over ¥5,000. Deliveries are available Tuesday through Saturday. Please contact us for scheduling."
            },
            {
              id: "4",
              title: "What is your return policy?",
              content: "We guarantee satisfaction with every purchase. If you're not completely satisfied with your meat, contact us within 24 hours for a replacement or refund."
            },
            {
              id: "5",
              title: "How should I store the meat?",
              content: "All meats should be refrigerated immediately upon receipt. Refrigerate at 0-4°C and use within 3 days for optimal freshness, or freeze for up to 3 months."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenterForm
          title="Get in Touch"
          description="Contact us for orders, inquiries, or special requests. We're here to serve you with the finest quality meat."
          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: true }
          ]}
          textarea={{
            name: "message",
            placeholder: "Your Message or Order Request",
            rows: 5,
            required: true
          }}
          useInvertedBackground="noInvert"
          buttonText="Send Message"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Tokyo Butcher"
          copyrightText="© 2024 Tokyo Butcher. All rights reserved."
          columns={[
            {
              title: "Company",
              items: [
                { label: "About Us", href: "about" },
                { label: "Our Team", href: "team" },
                { label: "Contact", href: "contact" }
              ]
            },
            {
              title: "Products",
              items: [
                { label: "Premium Cuts", href: "products" },
                { label: "Custom Orders", href: "contact" }
              ]
            },
            {
              title: "Support",
              items: [
                { label: "FAQ", href: "faq" },
                { label: "Delivery Info", href: "contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}