"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import { Activity, Award, Coffee, Facebook, Instagram, Twitter } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="reveal-blur"
        borderRadius="soft"
        contentWidth="mediumSmall"
        sizing="mediumLargeSizeLargeTitles"
        background="circleGradient"
        cardStyle="soft-shadow"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        { name: "Home", id: "hero" },
        { name: "Zones", id: "features" },
        { name: "Events", id: "products" },
        { name: "Discounts", id: "faq" },
        { name: "Contact", id: "contact" },
      ]}
      brandName="Alagiori"
    />
  </div>

  <div id="discount-banner" data-section="discount-banner" className="bg-accent py-4 text-center text-white text-sm font-semibold">
    <p>🎉 სპეციალური ფასდაკლება სტუდენტებისთვის! დეტალები FAQ სექციაში.</p>
  </div>

  <div id="hero" data-section="hero">
      <HeroLogoBillboard
      background={{ variant: "gradient-bars" }}
      logoText="ALAGIORI"
      description="Book Your Ultimate Gaming Experience"
      buttons={[
        { text: "დაჯავშნა", href: "#contact" },
        { text: "გალერეა", href: "#about" },
      ]}
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5ju631"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={false}
      title="სრულყოფილი სივრცე"
      description="ალაგიორი არის მასშტაბური, ესთეტიკური და კომფორტული გასართობი ცენტრი, რომელიც სტუმრებს სთავაზობს მაღალი ხარისხის სერვისს და დაუვიწყარ ატმოსფეროს."
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=jksdkw"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureHoverPattern
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        { title: "პროფესიონალური ბილიარდი", description: "უმაღლესი ხარისხის მაგიდები და საუკეთესო სათამაშო გარემო.", icon: Award },
        { title: "Gaming Hub", description: "PlayStation 5 და პროფესიონალური სარბოლო სიმულატორები.", icon: Activity },
        { title: "Mini-Bar", description: "გემრიელი სასმელები და საჭემელი თქვენი განწყობისთვის.", icon: Coffee },
      ]}
      title="გასართობი ზონები"
      description="აირჩიეთ თქვენი საყვარელი აქტივობა და გაერთეთ მეგობრებთან ერთად."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      products={[
        { id: "1", name: "ბილიარდის ტურნირი", price: "10 GEL", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=v7cuvd" },
        { id: "2", name: "PS5 შეჯიბრი", price: "15 GEL", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5bbivf" },
        { id: "3", name: "სარბოლო სიმულატორები", price: "20 GEL", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rqv8bu" },
      ]}
      title="ტურნირები და ღონისძიებები"
      description="მიიღეთ მონაწილეობა ჩვენს ყოველკვირეულ ტურნირებში."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardFourteen
      useInvertedBackground={false}
      title="ალაგიორი ფაქტებში"
      tag="მიღწევები"
      metrics={[
        { id: "1", value: "10+", description: "ბილიარდის მაგიდა" },
        { id: "2", value: "500+", description: "კმაყოფილი სტუმარი" },
        { id: "3", value: "24/7", description: "მხარდაჭერა" },
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFifteen
      useInvertedBackground={false}
      testimonial="საუკეთესო ადგილი მეგობრებთან ერთად დროის გასატარებლად! ატმოსფერო არის უმაღლესი დონის."
      rating={5}
      author="გიორგი ნ."
      avatars={[{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=q2pl2c", alt: "user" }]}
      ratingAnimation="slide-up"
      avatarsAnimation="slide-up"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        { id: "q1", title: "გაქვთ ფასდაკლება მოსწავლეებისთვის?", content: "დიახ, გვაქვს -50% ფასდაკლება სტუდენტებისთვის! ფასდაკლების მისაღებად უბრალოდ წარმოადგინეთ თქვენი სტუდენტური ბარათი ადგილზე მისვლისას ან წინასწარ დაგვირეკეთ ნომერზე." },
        { id: "q2", title: "როგორ დავჯავშნო მაგიდა?", content: "დაგვიკავშირდით საკონტაქტო ფორმის საშუალებით." },
      ]}
      title="სპეციალური აქციები და კითხვები"
      description="გაიგეთ მეტი ჩვენს ფასდაკლებებზე."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{ variant: "gradient-bars" }}
      text="გსურთ ტურნირში მონაწილეობა? მოგვწერეთ ახლავე!"
      buttons={[
        { text: "დარეგისტრირება", href: "#" },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoText="ALAGIORI"
      columns={[
        { title: "მთავარი", items: [{ label: "მთავარი", href: "#hero" }, { label: "ზონები", href: "#features" }] },
        { title: "სოციალური ქსელები", items: [
            { label: "Facebook", href: "https://facebook.com" },
            { label: "Instagram", href: "https://instagram.com" },
            { label: "Twitter", href: "https://twitter.com" }
        ] }
      ]}
      copyrightText="© 2024 Alagiori. ყველა უფლება დაცულია."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}