"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import { Facebook, Instagram, Twitter } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-magnetic"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="mediumSmall"
        sizing="largeSizeMediumTitles"
        background="aurora"
        cardStyle="soft-shadow"
        primaryButtonStyle="flat"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",          id: "#hero"},
        {
          name: "Menu",          id: "#menu"},
        {
          name: "About Us",          id: "#about"},
        {
          name: "Reservations",          id: "#contact"},
        {
          name: "FAQ",          id: "#faq"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      brandName="SAYO"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardCarousel
      background={{
        variant: "plain"}}
      title="Experience Authentic Pan Asian Flavors"
      description="SAYO brings you an exquisite culinary journey through the vibrant tastes of Asia, crafted with passion and fresh ingredients. Discover a fusion of tradition and innovation on every plate."
      buttons={[
        {
          text: "View Our Menu",          href: "#menu"},
        {
          text: "Make a Reservation",          href: "#contact"},
      ]}
      mediaItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/caprese-salad-tomato-basil-mozzarella-olive-oil-side-view_141793-2751.jpg",          imageAlt: "A vibrant spread of various Pan Asian dishes"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/cooking-process-asian-restaurant-cook-is-fry-vegetables-with-spices-sauce-wok_613910-4975.jpg",          imageAlt: "A chef skillfully preparing an Asian dish in a professional kitchen"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/chocolate-dessert-cup-black-tea_140725-3381.jpg",          imageAlt: "The elegant and modern interior of SAYO restaurant"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/stuffed-chicken-balls-garnished-with-cream-sauce_140725-2580.jpg",          imageAlt: "An inviting platter of assorted Asian appetizers"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/elegant-sweet-creation_23-2151947955.jpg",          imageAlt: "A beautifully plated Asian-inspired dessert"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-futuristic-soft-drink_23-2151281903.jpg",          imageAlt: "Exotic Pan Asian cocktails at the bar"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={true}
      heading={[
        {
          type: "text",          content: "Our Culinary Journey at SAYO"},
      ]}
      buttons={[
        {
          text: "Learn More About Us",          href: "#"},
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardNineteen
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          tag: "Quality",          title: "Fresh, Authentic Ingredients",          subtitle: "Directly sourced for peak flavor",          description: "We believe exceptional food starts with the finest ingredients. Our chefs carefully select fresh, seasonal produce and premium meats, ensuring every dish bursts with authentic Pan Asian flavors.",          imageSrc: "http://img.b2bpic.net/free-photo/fresh-organic-vegetable-kitchen-counter_23-2147917749.jpg",          imageAlt: "Fresh, vibrant ingredients for Asian cooking"},
        {
          tag: "Craft",          title: "Masterful Culinary Artisans",          subtitle: "Expert chefs, passionate about taste",          description: "Our team of seasoned chefs brings years of experience and a profound passion for Pan Asian cuisine. They blend traditional techniques with innovative approaches to create dishes that delight and inspire.",          imageSrc: "http://img.b2bpic.net/free-photo/mid-shot-chef-plating-dish-with-oil_23-2148794099.jpg",          imageAlt: "A master chef preparing a dish"},
        {
          tag: "Heritage",          title: "Time-Honored Recipes",          subtitle: "A taste of tradition and innovation",          description: "At SAYO, we honor the rich culinary heritage of Asia. Our menu features classic recipes, refined and presented with a modern flair, promising an authentic yet contemporary dining experience.",          imageSrc: "http://img.b2bpic.net/free-photo/view-ancient-scroll-writing-documenting-history_23-2151751684.jpg",          imageAlt: "A collection of traditional Asian spices and herbs"},
      ]}
      title="Savor the SAYO Difference"
      description="Discover what makes our dining experience truly unique and unforgettable, from the ingredients we source to the hands that craft your meal."
    />
  </div>

  <div id="menu" data-section="menu">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      products={[
        {
          id: "dish-1",          brand: "Japanese",          name: "SAYO Sushi Platter",          price: "$38",          rating: 5,
          reviewCount: "210",          imageSrc: "http://img.b2bpic.net/free-photo/salmon-roll_1339-2831.jpg",          imageAlt: "Assorted sushi and sashimi platter"},
        {
          id: "dish-2",          brand: "Thai",          name: "Classic Pad Thai",          price: "$22",          rating: 4,
          reviewCount: "185",          imageSrc: "http://img.b2bpic.net/free-photo/spicy-papaya-salad_1203-3541.jpg",          imageAlt: "Traditional Pad Thai with shrimp and peanuts"},
        {
          id: "dish-3",          brand: "Chinese",          name: "Steamed Dim Sum Basket",          price: "$18",          rating: 5,
          reviewCount: "150",          imageSrc: "http://img.b2bpic.net/free-photo/delicious-food-arrangement-still-life_23-2149325294.jpg",          imageAlt: "Steamed dim sum assortment"},
        {
          id: "dish-4",          brand: "Vietnamese",          name: "Authentic Beef Pho",          price: "$20",          rating: 4,
          reviewCount: "130",          imageSrc: "http://img.b2bpic.net/free-photo/guay-jap-meatballs-vietnamese-pork-sausage-fried-egg-thai-food_1150-25650.jpg",          imageAlt: "Bowl of Vietnamese beef pho"},
        {
          id: "dish-5",          brand: "Korean",          name: "Sizzling Korean BBQ",          price: "$45",          rating: 5,
          reviewCount: "195",          imageSrc: "http://img.b2bpic.net/free-photo/grilled-pork-plate_1339-5871.jpg",          imageAlt: "Korean BBQ table with grilled meats"},
        {
          id: "dish-6",          brand: "Chinese",          name: "Spicy Szechuan Mapo Tofu",          price: "$24",          rating: 4,
          reviewCount: "110",          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-rice-with-vegetables-plate-chopsticks-with-copy-space_23-2148377498.jpg",          imageAlt: "Szechuan Mapo Tofu with rice"},
      ]}
      title="Our Signature Dishes"
      description="Indulge in our most celebrated creations, a symphony of flavors from across Asia. Each dish is a testament to our commitment to excellence and taste."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardFourteen
      useInvertedBackground={false}
      title="SAYO By The Numbers"
      tag="Our Achievements"
      metrics={[
        {
          id: "metric-1",          value: "15+",          description: "Years of Culinary Excellence"},
        {
          id: "metric-2",          value: "200+",          description: "Unique Dishes Crafted"},
        {
          id: "metric-3",          value: "10K+",          description: "Happy Diners Served"},
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      plans={[
        {
          id: "plan-1",          title: "SAYO Tasting Menu",          price: "$85",          period: "per person",          features: [
            "7-Course Culinary Journey",            "Chef's Seasonal Selection",            "Complimentary Amuse-bouche"],
          button: {
            text: "Book Tasting",            href: "#contact"},
          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-couple-having-lunch-luxury-restaurant_23-2150598345.jpg",          imageAlt: "Elegant 7-course tasting menu"},
        {
          id: "plan-2",          title: "Chef's Private Table",          price: "$150",          period: "per person",          features: [
            "Personalized 9-Course Meal",            "Direct Chef Interaction",            "Wine Pairing Options"],
          button: {
            text: "Reserve Private Table",            href: "#contact"},
          imageSrc: "http://img.b2bpic.net/free-photo/friends-toasting-celebration-new-years_23-2148349022.jpg",          imageAlt: "Luxurious private dining room"},
        {
          id: "plan-3",          title: "Event Catering Package",          price: "Custom Quote",          period: "per event",          features: [
            "Tailored Pan Asian Menu",            "Dedicated Event Coordinator",            "On-site Service Available"],
          button: {
            text: "Inquire Now",            href: "#contact"},
          imageSrc: "http://img.b2bpic.net/free-photo/thnaksgiving-blessing-celebrating-grateful-meal-concept_53876-64914.jpg",          imageAlt: "Elegant catering setup for an event"},
      ]}
      title="Exclusive Dining Experiences"
      description="Elevate your occasion with our curated tasting menus and private event packages, designed for unforgettable moments."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFifteen
      useInvertedBackground={false}
      testimonial="SAYO is an absolute culinary masterpiece! The flavors are incredibly nuanced, and the presentation is always stunning. It's our go-to spot for authentic Pan Asian cuisine and a truly memorable dining experience."
      rating={5}
      author="Isabelle L."
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/teenage-girl-lifestyle-concept_23-2148093921.jpg",          alt: "Sarah Johnson, Satisfied Customer"},
        {
          src: "http://img.b2bpic.net/free-photo/close-up-portrait-young-stately-ginger-fellow-stylish-navy-t-shirt-smiling-showing-ok-sign-looking-camera-while-posing-blue-studio-background-human-facial-expressions-sincer_639032-2122.jpg",          alt: "Michael Chen, Food Blogger"},
        {
          src: "http://img.b2bpic.net/free-photo/couple-enjoying-food-restaurant_23-2149269179.jpg",          alt: "Emily Rodriguez, Local Critic"},
        {
          src: "http://img.b2bpic.net/free-photo/medium-shot-couple-having-lunch-luxury-restaurant_23-2150598413.jpg",          alt: "David Kim, Regular Patron"},
        {
          src: "http://img.b2bpic.net/free-photo/front-view-male-chef-holding-dish_23-2148763124.jpg",          alt: "Chef Kenji, Culinary Expert"},
      ]}
      ratingAnimation="slide-up"
      avatarsAnimation="slide-up"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "faq-1",          title: "Do you accept reservations?",          content: "Yes, we highly recommend making a reservation, especially for dinner and weekend evenings, to ensure you get a table. You can book through our website or by calling us directly."},
        {
          id: "faq-2",          title: "What are your hours of operation?",          content: "SAYO is open Tuesday to Sunday from 12:00 PM to 2:30 PM for lunch and 5:00 PM to 10:00 PM for dinner. We are closed on Mondays."},
        {
          id: "faq-3",          title: "Do you offer vegetarian or vegan options?",          content: "Absolutely! Our menu features a variety of delicious vegetarian and vegan dishes. Please inform your server about any dietary restrictions or preferences, and our chefs will be happy to accommodate."},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/side-view-woman-working-service-industry_23-2150722790.jpg"
      imageAlt="Restaurant staff attending to customers"
      mediaAnimation="slide-up"
      mediaPosition="left"
      title="Frequently Asked Questions"
      description="Find quick answers to common inquiries about our reservations, menu, dietary options, and more to enhance your dining experience."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      text="Ready to embark on a culinary adventure? Visit us or make a reservation today!"
      buttons={[
        {
          text: "Make a Reservation",          href: "#"},
        {
          text: "View Location",          href: "#"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=uxmq48"
      logoAlt="SAYO Restaurant Logo"
      logoText="SAYO - Pan Asian Restaurant"
      copyrightText="© 2025 SAYO. All rights reserved."
      socialLinks={[
        { icon: Facebook, href: "https://www.facebook.com/sayo", ariaLabel: "Facebook" },
        { icon: Instagram, href: "https://www.instagram.com/sayo", ariaLabel: "Instagram" },
        { icon: Twitter, href: "https://www.twitter.com/sayo", ariaLabel: "Twitter" },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}