0cbc8e4a-88da-4bd7-a1a4-39d5ce414746/src/app/page.tsx

"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardThree from '@/components/sections/product/ProductCardThree';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="medium"
      background="circleGradient"
      cardStyle="glass-elevated"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="normal"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarStyleCentered
            navItems={[
              { name: "Home", id: "home" },
              { name: "Leaderboard", id: "leaderboard" },
              { name: "Matches", id: "matches" },
              { name: "Admin", id: "admin" },
            ]}
            brandName="MarbleCityFC"
          />
        </div>

        <div id="home" data-section="home">
          <HeroBillboard
            background={{ variant: "plain" }}
            title="MarbleCityFC Performance Portal"
            description="The official internal dashboard for tracking matches, player stats, and club performance."
            imageSrc="http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg"
            mediaAnimation="slide-up"
            avatars={[
              { src: "http://img.b2bpic.net/free-photo/figure-skating-girl-ice-arena_654080-1585.jpg", alt: "Staff profile 1" },
              { src: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-933.jpg", alt: "Staff profile 2" },
              { src: "http://img.b2bpic.net/free-photo/sports-center_1127-4160.jpg", alt: "Staff profile 3" },
              { src: "http://img.b2bpic.net/free-photo/basketball-players-big-professional-arena-game_654080-295.jpg", alt: "Staff profile 4" },
              { src: "http://img.b2bpic.net/free-photo/business-investor-analyzing-stock-market-trend-monitor-trading-capital-profit-exchange-investment-young-broker-investing-funds-using-financial-forex-market-sales-close-up-handheld-shot_482257-40948.jpg", alt: "Staff profile 5" },
            ]}
            avatarText="Trusted by our elite staff"
            marqueeItems={[
              { type: "text", text: "League Leader: #1" },
              { type: "text", text: "Unbeaten Streak: 12" },
              { type: "text", text: "Top Scorer: 12 Goals" },
              { type: "text", text: "Match Win Rate: 85%" },
              { type: "text", text: "Season Progress: 60%" },
            ]}
          />
        </div>

        <div id="leaderboard" data-section="leaderboard">
          <ProductCardThree
            animationType="slide-up"
            textboxLayout="default"
            gridVariant="uniform-all-items-equal"
            useInvertedBackground={false}
            products={[
              { id: "p1", name: "James Wilson", price: "12 Goals", imageSrc: "http://img.b2bpic.net/free-photo/figure-skating-girl-ice-arena_654080-1585.jpg" },
              { id: "p2", name: "Marcus Rashford", price: "10 Goals", imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-933.jpg" },
              { id: "p3", name: "Liam Smith", price: "8 Goals", imageSrc: "http://img.b2bpic.net/free-photo/sports-center_1127-4160.jpg" },
              { id: "p4", name: "Tom Baker", price: "7 Goals", imageSrc: "http://img.b2bpic.net/free-photo/basketball-players-big-professional-arena-game_654080-295.jpg" },
              { id: "p5", name: "Alex Reed", price: "6 Goals", imageSrc: "http://img.b2bpic.net/free-photo/business-investor-analyzing-stock-market-trend-monitor-trading-capital-profit-exchange-investment-young-broker-investing-funds-using-financial-forex-market-sales-close-up-handheld-shot_482257-40948.jpg" },
              { id: "p6", name: "Sam Field", price: "5 Goals", imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg" },
            ]}
            title="Player Leaderboard"
            description="Top performers based on seasonal statistics."
          />
        </div>

        <div id="matches" data-section="matches">
          <FeatureCardTwentySeven
            animationType="slide-up"
            textboxLayout="split"
            useInvertedBackground={true}
            features={[
              { id: "m1", title: "Oct 12 vs Tigers", descriptions: ["Score: 3-1", "Goal Scorers: Wilson, Smith, Baker"], imageSrc: "http://img.b2bpic.net/free-photo/businessman-doing-research-analysis-computer-screen-plan-financial-statistics-with-charts-graphs-data-male-employee-working-with-diagram-report-find-sales-profit-e-commerce_482257-40940.jpg", imageAlt: "dashboard admin ui" },
              { id: "m2", title: "Oct 05 vs City Rovers", descriptions: ["Score: 2-2", "Goal Scorers: Rashford, Reed"], imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg", imageAlt: "dashboard admin ui" },
              { id: "m3", title: "Sep 28 vs North United", descriptions: ["Score: 4-0", "Goal Scorers: Wilson, Smith, Baker, Field"], imageSrc: "http://img.b2bpic.net/free-photo/figure-skating-girl-ice-arena_654080-1585.jpg", imageAlt: "dashboard admin ui" },
            ]}
            title="Recent Match Logs"
            description="Historical data of recent league matches and outcomes."
          />
        </div>

        <div id="metric" data-section="metric">
          <MetricCardFourteen
            useInvertedBackground={false}
            title="Club Performance Overview"
            tag="Live Metrics"
            metrics={[
              { id: "stat-1", value: "18", description: "Matches Played" },
              { id: "stat-2", value: "42", description: "Goals Scored" },
              { id: "stat-3", value: "12", description: "Clean Sheets" },
              { id: "stat-4", value: "2.4", description: "Goals Per Match" },
            ]}
            metricsAnimation="slide-up"
          />
        </div>

        <div id="admin" data-section="admin">
          <ContactCenter
            useInvertedBackground={false}
            background={{ variant: "plain" }}
            tag="Admin Tools"
            title="Match & Stats Entry"
            description="Use this secure panel to input new player data, match scores, and update weekly stats."
            inputPlaceholder="Enter admin authorization code"
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterBase
            columns={[
              {
                title: "Platform",                items: [
                  { label: "Dashboard", href: "#home" },
                  { label: "Stats", href: "#leaderboard" },
                ],
              },
              {
                title: "Support",                items: [{ label: "Contact Admin", href: "#admin" }],
              },
            ]}
            logoText="MarbleCityFC"
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}