"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import AboutMetric from '@/components/sections/about/AboutMetric';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Award, Download, Gamepad2, Globe, Shield, Swords, TrendingUp, Users, Zap } from 'lucide-react';

export default function LandingPage() {
  return (
      <ThemeProvider
        defaultButtonVariant="slide-background"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="mediumSmall"
        sizing="large"
        background="none"
        cardStyle="glass"
        primaryButtonStyle="shadow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="semibold"
      >
        <div id="nav" data-section="nav">
          <NavbarStyleApple
            brandName="Battle Royale"
            navItems={[
              { name: "Features", id: "features" },
              { name: "Gameplay", id: "gameplay" },
              { name: "Community", id: "testimonials" },
              { name: "Download", id: "contact" }
            ]}
          />
        </div>

        <div id="hero" data-section="hero">
          <HeroLogoBillboardSplit
            logoText="Battle Royale"
            description="This is a test description"
            background={{ variant: "radial-gradient" }}
            buttons={[
              { text: "Download Now", href: "https://apps.apple.com/app/battle-royale" },
              { text: "Watch Trailer", href: "#gameplay" }
            ]}
            layoutOrder="default"
            backgroundImage="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=1920&q=80"
            imageAlt="Battle Royale epic battle scene with castle and warriors"
            frameStyle="browser"
          />
        </div>

        <div id="gameplay" data-section="gameplay">
          <ProductCardOne
            title="Game Modes"
            description="Experience multiple thrilling gameplay modes designed for every playstyle and strategy preference."
            tag="Gameplay"
            tagIcon={Gamepad2}
            products={[
              {
                id: "1",              
                name: "Campaign Mode",              
                price: "Single Player",              
                imageSrc: "https://img.b2bpic.net/free-photo/diverse-viking-men-outdoors_23-2151689953.jpg",              
                imageAlt: "Campaign mode gameplay with base building"
              },
              {
                id: "2",              
                name: "Multiplayer Battles",              
                price: "1v1 Combat",              
                imageSrc: "https://img.b2bpic.net/free-photo/portrait-scandinavian-female-viking-person_23-2151707052.jpg",              
                imageAlt: "Multiplayer PvP battle arena"
              },
              {
                id: "3",              
                name: "Clan Wars",              
                price: "Team Events",              
                imageSrc: "https://img.b2bpic.net/free-photo/diverse-viking-men-outdoors_23-2151689959.jpg",              
                imageAlt: "Epic clan war gameplay in Battle Royale"
              }
            ]}
          gridVariant="three-columns-all-equal-width"
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <AboutMetric
          title="Our Numbers"
          metrics={[
            { icon: Users, label: "Active Players", value: "100M+" },
            { icon: Globe, label: "Countries", value: "200+" },
            { icon: Award, label: "Years Active", value: "12+" },
            { icon: Zap, label: "Daily Battles", value: "1B+" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>
      <div id="features" data-section="features">
        <FeatureCardTwentyFive
          title="Amazing Features"
          description="Unleash powerful features that define the Battle Royale experience. Build your empire with cutting-edge gameplay mechanics."
          tag="Game Features"
          tagIcon={Zap}
          features={[
            {
              title: "Epic Troop Arsenal",              description: "Command hundreds of unique troops and spells. Each unit has special abilities to dominate your enemies.",              icon: Swords,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-medieval-soldiers-posing-studio_23-2150542225.jpg",                  imageAlt: "Battle Royale warrior troops"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/diverse-viking-men-outdoors_23-2151689862.jpg",                  imageAlt: "Magical spells and abilities"
                }
              ]
            },
            {
              title: "Build Your Clan Legacy",              description: "Join clans with thousands of active players worldwide. Participate in epic clan wars in Battle Royale, share resources, and climb global rankings together.",              icon: Users,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/diverse-viking-men-outdoors_23-2151689957.jpg",                  imageAlt: "Clan cooperative gameplay"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-medieval-soldiers-posing-studio_23-2150542250.jpg",                  imageAlt: "Clan war raids and battles"
                }
              ]
            },
            {
              title: "Conquer & Defend",              description: "Design impenetrable defenses for your village. Attack enemy bases with tactical precision. Balance offense and defense to become invincible.",              icon: Shield,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/portrait-scandinavian-female-viking-person_23-2151707039.jpg",                  imageAlt: "Base defense strategy"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-medieval-soldiers-posing-studio_23-2150542250.jpg",                  imageAlt: "Attack and conquest gameplay"
                }
              ]
            },
            {
              title: "Endless Progression",              description: "Upgrade hundreds of buildings and troops. Reach new Town Hall levels with increasingly powerful capabilities. Your journey never ends.",              icon: TrendingUp,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/diverse-viking-men-outdoors_23-2151689953.jpg",                  imageAlt: "Base progression and upgrades"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/portrait-scandinavian-female-viking-person_23-2151707039.jpg",                  imageAlt: "Advanced game progression"
                }
              ]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSixteen
          title="What Champions Say"
          description="Hear from legendary players who have dominated the realm and achieved greatness in Battle Royale."
          testimonials={[
            {
              id: "1",              name: "Marcus Thunder",              role: "Clan Leader",              company: "Dragon Slayers",              rating: 4,
              imageSrc: "https://img.b2bpic.net/free-photo/fantastic-aliens-with-glowing-neon-colours_23-2151648371.jpg",              imageAlt: "Marcus Thunder clan leader portrait"
            },
              {
                id: "3",              name: "James Phoenix",              role: "Streaming Legend",              company: "Battle Royale Community",              rating: 4,
              imageSrc: "https://img.b2bpic.net/free-photo/cyberpunk-man-warrior-portrait_23-2150712414.jpg",              imageAlt: "James Phoenix streamer portrait"
            },
            {
              id: "4",              name: "Elena Storm",              role: "Tournament Winner",              company: "Royal Giants",              rating: 4,
              imageSrc: "https://img.b2bpic.net/free-photo/cyberpunk-warrior-woman-portrait_23-2150712500.jpg",              imageAlt: "Elena Storm tournament champion portrait"
            }
          ]}
          kpiItems={[
            { value: "12+", label: "Years of Epic Battles" },
            { value: "5★", label: "Player Rating" },
            { value: "Millions", label: "Active Clans" }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/portrait-scandinavian-female-viking-person_23-2151707039.jpg"
          imageAlt="Battle Royale epic battle scene"
          logoText="Battle Royale"
          copyrightText="© 2024 Supercell | Battle Royale Official"
          columns={[
            {
              title: "Game",              items: [
                { label: "Download", href: "#contact" },
                { label: "Features", href: "#features" },
                { label: "Gameplay", href: "#gameplay" }
              ]
            },
            {
              title: "Community",              items: [
                { label: "Join a Clan", href: "https://supercell.com" },
                { label: "Global Rankings", href: "https://supercell.com" },
                { label: "Events & Updates", href: "https://supercell.com" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Help Center", href: "https://supercell.com" },
                { label: "Contact Us", href: "https://supercell.com" },
                { label: "Privacy Policy", href: "https://supercell.com" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}