"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import { Star, Trophy, Tv, ChefHat, Gamepad2 } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-stagger"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="mediumLarge"
        sizing="largeSmallSizeLargeTitles"
        background="floatingGradient"
        cardStyle="soft-shadow"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "Bar & Food",          id: "bar-food"},
        {
          name: "Gaming",          id: "gaming"},
        {
          name: "Bookings",          id: "bookings"},
      ]}
      brandName="N13 Sports Bar"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroOverlay
      title="North London's Home for Snooker, Gaming & Live Sports"
      description="Experience premium snooker tables, competitive PS5 gaming, and authentic Albanian eats at our vibrant N13 5TT bar. Join us for live action on every screen."
      buttons={[
        {
          text: "Book Your Session",          href: "#bookings"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/empty-inspiring-library-interior-with-heritage-design-peaceful-lighting_482257-125436.jpg"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/man-standing-with-arms-crossed-bar_107420-65502.jpg",          alt: "Man standing with arms crossed in bar"},
        {
          src: "http://img.b2bpic.net/free-photo/people-enjoying-their-time-dj-party_23-2149658377.jpg",          alt: "People enjoying their time at a dj party"},
        {
          src: "http://img.b2bpic.net/free-photo/wooden-bar-table-with-bar-chairs-cafe_181624-60461.jpg",          alt: "Wooden bar table with bar chairs in a cafe"},
        {
          src: "http://img.b2bpic.net/free-photo/side-view-drunk-friends-bar_171337-19364.jpg",          alt: "Side view of Drunk friends on bar"},
        {
          src: "http://img.b2bpic.net/free-photo/pub-interior-with-motorcycle-installation_1262-3608.jpg",          alt: "Pub Interior With Motorcycle Installation"},
      ]}
      avatarText="Join 500+ locals every week"
    />
  </div>

  <div id="about" data-section="about">
      <AboutMetric
      useInvertedBackground={false}
      title="The Ultimate Local Hangout"
      metrics={[
        {
          icon: Trophy,
          label: "Pool & Snooker Tables",          value: "8"},
        {
          icon: Star,
          label: "PS5 Gaming Stations",          value: "5"},
        {
          icon: Tv,
          label: "Live Sports Screens",          value: "12"},
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="bar-food" data-section="bar-food">
      <FeatureCardTen
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={true}
      features={[
        {
          title: "Traditional Bites",          description: "Hand-crafted appetizers with authentic ingredients.",          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/wooden-board-delicious-toast-with-meat-vegetables_114579-86383.jpg"},
          items: [
            {
              icon: ChefHat,
              text: "Authentic Recipes"},
          ],
          reverse: false,
        },
      ]}
      title="Authentic Flavors"
      description="Indulge in our unique Albanian-style menu designed to fuel your sessions. From savory appetizers to hearty shared plates, your perfect bar meal awaits."
    />
  </div>

  <div id="gaming" data-section="gaming">
      <FeatureCardTen
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          title: "Play Like a Pro",          description: "High-fidelity gaming experience in a private setup.",          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/retro-vhs-packaging-indoors_23-2150172444.jpg"},
          items: [
            {
              icon: Gamepad2,
              text: "Next-Gen Consoles"},
          ],
          reverse: true,
        },
      ]}
      title="Pro-Level Gaming Room"
      description="Our back room hosts 5 state-of-the-art PS5 stations. Perfect for groups up to 5—challenge your friends to the latest titles in absolute comfort."
    />
  </div>

  <div id="bookings" data-section="bookings">
      <PricingCardThree
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      plans={[
        {
          id: "p1",          price: "£10/hr",          name: "Pool Table",          features: [
            "Full set included",            "Spacious area"],
          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
        },
        {
          id: "p2",          price: "£12/hr",          name: "Snooker Table",          features: [
            "Tournament quality",            "Perfect lighting"],
          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
        },
        {
          id: "p3",          price: "£15/hr",          name: "PS5 Gaming",          features: [
            "Group up to 5",            "All games included"],
          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
        },
      ]}
      title="Secure Your Table"
      description="Book your slots in advance and avoid the queue. Perfect for casual matches or serious tournament nights."
    />
  </div>

  <div id="sports" data-section="sports">
      <MetricCardSeven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      metrics={[
        {
          id: "m1",          title: "Live Coverage",          value: "24/7",          items: [
            "Premier League",            "UCL",            "Cricket",            "Tennis"],
        },
      ]}
      title="Never Miss a Moment"
      description="With 12 large-screen TVs covering every major match, we are the community destination for Premier League, Champions League, and more."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "1",          name: "John D.",          role: "Regular",          company: "N13 Local",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/headshot-pleased-cheerful-african-american-woman-touches-cheeks-closes-eyes-enjoys-pleasant-moment-wears-yellow-raincoat-isolated-blue-background_273609-33937.jpg"},
        {
          id: "2",          name: "Sarah K.",          role: "Gamer",          company: "Gaming Fan",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/shorthaired-girl-with-pink-sunglasses-smiling-striped-backgroundteen-with-brunette-hair-grey-tshirt-beige-jacket-posing-cafe_197531-29487.jpg"},
        {
          id: "3",          name: "Mike B.",          role: "Sports Fan",          company: "Football Lover",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-joyful-african-student-woman-with-dark-wavy-hair-green-cardigan-sitting-cafe-drinking-cup-coffee-smiling-camera-woman-waiting-her-boyfriend-after-university_176420-12329.jpg"},
        {
          id: "4",          name: "Emily P.",          role: "Regular",          company: "N13 Local",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-playing-videogame_23-2149349990.jpg"},
        {
          id: "5",          name: "Chris T.",          role: "Snooker Player",          company: "Tournament Pro",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/smiling-football-player-holding-ball-looking-camera_23-2148203670.jpg"},
      ]}
      kpiItems={[
        {
          value: "4.9",          label: "5-Star Google Rating"},
        {
          value: "500+",          label: "Weekly Regulars"},
        {
          value: "10k+",          label: "Games Hosted"},
      ]}
      title="Community Favorites"
      description="Hear what our regulars have to say about the vibe, the food, and the games."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Get in Touch"
      description="Ready to play? Send us a message for table bookings, special event inquiries, or food catering options."
      inputs={[
        {
          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
        },
        {
          name: "email",          type: "email",          placeholder: "Your Email",          required: true,
        },
        {
          name: "subject",          type: "text",          placeholder: "Booking/Event Date"},
      ]}
      textarea={{
        name: "message",        placeholder: "Details (number of people, table/gaming choice...)"}}
      imageSrc="http://img.b2bpic.net/free-photo/view-luxurious-hotel-interior-space_23-2150683401.jpg"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoText="N13 Sports Bar"
      leftLink={{
        text: "Privacy Policy",        href: "#"}}
      rightLink={{
        text: "© 2024 N13 Bar & Grill",        href: "#"}}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
