"use client";

import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Github, Send, Twitter, Youtube } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="small"
      background="aurora"
      cardStyle="glass-outline"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="minimal"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Vitaliy"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Fails", id: "fails" },
            { name: "Stats", id: "stats" },
            { name: "Roasts", id: "roasts" },
            { name: "FAQ", id: "faq" }
          ]}
          button={{ text: "Join the Roast", href: "contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Vitaliy's Counter-Strike 2 Nightmare"
          description="A comprehensive documentation of how one person manages to consistently underperform in every single match, every single round, every single encounter. This is his story."
          tag="The Greatest Whiffer Alive"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766158635120-y4gwwb01.jpg"
          imageAlt="Vitaliy gaming setup"
          frameStyle="card"
          buttons={[
            { text: "Witness the Fails", href: "fails" },
            { text: "View Stats", href: "stats" }
          ]}
        />
      </div>

      <div id="fails" data-section="fails">
        <ProductCardOne
          title="Vitaliy's Greatest Fails"
          description="A curated collection of the most spectacular, jaw-dropping, head-scratching moments of pure gaming incompetence"
          tag="Fail Highlights"
          products={[
            {
              id: "1",
              name: "The Phantom Spray",
              price: "0 Kills",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163144014-82xk4wdq.jpg",
              imageAlt: "Spray completely missed target"
            },
            {
              id: "2",
              name: "One vs One Loss",
              price: "100% Failure Rate",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163144014-82xk4wdq.jpg",
              imageAlt: "Lost clutch moment"
            },
            {
              id: "3",
              name: "The Eco Round Disaster",
              price: "Full Buy Wasted",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163144014-82xk4wdq.jpg",
              imageAlt: "Economy ruined in seconds"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          containerStyle="default"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="stats" data-section="stats">
        <MetricCardSeven
          title="The Devastating Numbers"
          description="Real statistics that prove what we all already know"
          tag="By The Numbers"
          metrics={[
            {
              id: "1",
              value: "47%",
              title: "Average Accuracy",
              items: ["Mostly shooting at walls", "Sometimes hitting teammates", "Rarely hitting enemies"]
            },
            {
              id: "2",
              value: "0.82",
              title: "Kill Death Ratio",
              items: ["Dies every round", "Gets clutched by teammates", "Blames the lag"]
            },
            {
              id: "3",
              value: "12",
              title: "Average Deaths Per Game",
              items: ["Rushing at spawn", "Peeking for no reason", "Standing in smoke"]
            },
            {
              id: "4",
              value: "0",
              title: "Clutch Wins",
              items: ["Never had one", "Never will have one", "Monitor detected"]
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          containerStyle="default"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="roasts" data-section="roasts">
        <TestimonialCardFifteen
          testimonial="Playing with Vitaliy is like having a 4v5 from the start. His spray control is so bad, I'm convinced his mouse is broken. His awp shots miss standing targets. His positioning is non-existent. Yet somehow, we keep queuing with him. That's friendship."
          rating={5}
          author="His Suffering Teammates"
          avatars={[
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140063369-vzpeyskp.jpg",
              alt: "Teammate 1"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163145146-fsataaws.jpg",
              alt: "Teammate 2"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163146349-ine3yxut.jpg",
              alt: "Teammate 3"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163147304-jje53169.jpg",
              alt: "Teammate 4"
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Common Excuses & Real Answers"
          description="Everything Vitaliy blames for his performance, and the truth behind it"
          tag="The Deflection Hall of Fame"
          faqs={[
            {
              id: "1",
              title: "It's just the lag, right?",
              content: "No. The servers are fine. Your aim is not. Everyone else on the server has the same ping, yet they manage to get kills. Maybe it's not the lag."
            },
            {
              id: "2",
              title: "My monitor must be broken",
              content: "Your monitor shows the game. The game shows enemies. You don't shoot them. The monitor is working perfectly. The operator, however, is not."
            },
            {
              id: "3",
              title: "I'm just having an off day",
              content: "Every day is an off day. Literally every single one. At this point, calling it an 'off day' is generous. It's just your baseline."
            },
            {
              id: "4",
              title: "My mouse is too sensitive",
              content: "Then adjust it. Or don't. Because clearly, the problem isn't the mouse settings. The problem is the person holding the mouse."
            },
            {
              id: "5",
              title: "The team's fault for bad calls",
              content: "Even when the call is perfect, you still miss the shot. Even when you're supposed to hold an angle, you peek into 5 enemies. Strategy cannot fix mechanical incompetence."
            },
            {
              id: "6",
              title: "I'll improve next season",
              content: "You've said this for 3 seasons. The only thing improving is your ability to make excuses. At some point, you have to accept the truth."
            }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766158631222-b4add55v.jpg"
          imageAlt="Vitaliy's terrible statistics"
          mediaPosition="left"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Got a Fail Clip?"
          ctaDescription="Send us your best Vitaliy moments. We're always collecting evidence."
          ctaButton={{ text: "Submit Clip", href: "mailto:vitaliy@fails.com" }}
          ctaIcon={Send}
          faqs={[
            {
              id: "1",
              title: "Can I join the roast squad?",
              content: "Absolutely. If you've witnessed Vitaliy's gameplay, you're already part of the roast squad. Just start telling everyone."
            },
            {
              id: "2",
              title: "Will he ever get good?",
              content: "The statistical probability approaches zero. At this point, we're not waiting for improvement. We're documenting a phenomenon."
            },
            {
              id: "3",
              title: "Is this page real or a joke?",
              content: "Yes. It's real about the page. The gameplay? That's the joke nobody asked for but everyone witnessed."
            }
          ]}
          useInvertedBackground="noInvert"
          animationType="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseSocial
          description="A living monument to gaming incompetence. Dedicated to Vitaliy and his eternal struggle with Counter-Strike 2."
          logoText="Vitaliy CS2"
          copyrightText="© 2025 The Vitaliy Documentation Project"
          columns={[
            {
              title: "Pages",
              items: [
                { label: "Home", href: "home" },
                { label: "Fails", href: "fails" },
                { label: "Statistics", href: "stats" }
              ]
            },
            {
              title: "Resources",
              items: [
                { label: "Roasts", href: "roasts" },
                { label: "FAQ", href: "faq" },
                { label: "Submit Clip", href: "contact" }
              ]
            }
          ]}
          socialLinks={[
            { icon: Github, href: "https://github.com", ariaLabel: "GitHub" },
            { icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
            { icon: Youtube, href: "https://youtube.com", ariaLabel: "YouTube" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}