"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import MediaAbout from '@/components/sections/about/MediaAbout';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Award, TrendingUp, Users, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="compact"
      sizing="mediumSizeLargeTitles"
      background="circleGradient"
      cardStyle="outline"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "About", id: "about" },
            { name: "Companies", id: "companies" },
            { name: "Journey", id: "journey" },
            { name: "Work", id: "work" },
            { name: "Contact", id: "contact" },
            { name: "Features", id: "/features" }
          ]}
          button={{ text: "Let's Connect", href: "contact" }}
          brandName="Webild"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit
          logoText="FOUNDER"
          description="Serial entrepreneur building exceptional digital companies. CEO of Webild and DialedWeb. Dropped out to pursue the path less traveled."
          background={{ variant: "radial-gradient" }}
          buttons={[
            { text: "View My Work", href: "companies" },
            { text: "Get in Touch", href: "contact" }
          ]}
          layoutOrder="default"
          imageSrc="https://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5362.jpg"
          imageAlt="Founder and Serial Entrepreneur"
          mediaAnimation="slide-up"
          buttonAnimation="slide-up"
          frameStyle="card"
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="From College Dropout to Serial Entrepreneur"
          description="I left traditional education to build my own path in the startup world. What started as a bold decision has become a passion for creating businesses that solve real problems. My journey spans multiple ventures, each teaching me valuable lessons about scaling, innovation, and impact."
          tag="My Story"
          imageSrc="https://img.b2bpic.net/free-photo/start-up-business-worker-monitoring-sales-statistics-laptop_482257-95665.jpg"
          imageAlt="Entrepreneurial journey"
          useInvertedBackground={false}
          buttons={[
            { text: "Read My Blog", href: "#" }
          ]}
        />
      </div>

      <div id="companies" data-section="companies">
        <ProductCardFour
          title="My Companies"
          description="Building the future, one company at a time. Here are the ventures I'm leading."
          products={[
            {
              id: "1",              name: "Webild",              price: "Web Development & Design",              variant: "Custom digital solutions",              imageSrc: "https://img.b2bpic.net/free-vector/program-code-laptop-screen-office-work-software-development-data-statistic_39422-766.jpg",              imageAlt: "Webild - Web development company"
            },
            {
              id: "2",              name: "DialedWeb",              price: "Digital Marketing & Web Services",              variant: "Growth-focused strategies",              imageSrc: "https://img.b2bpic.net/free-photo/coming-soon-new-recent-innovation-modern-concept_53876-127478.jpg",              imageAlt: "DialedWeb - Digital marketing agency"
            },
            {
              id: "3",              name: "Future Venture",              price: "Innovative Solutions",              variant: "Coming Soon",              imageSrc: "/placeholders/placeholder1.webp",              imageAlt: "Future business venture"
            }
          ]}
          carouselMode="buttons"
          gridVariant="two-columns-alternating-heights"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="By The Numbers"
          description="The impact of my entrepreneurial journey across multiple ventures."
          metrics={[
            {
              id: "1",              icon: TrendingUp,
              title: "Companies",              value: "2+"
            },
            {
              id: "2",              icon: Users,
              title: "Clients Served",              value: "100+"
            },
            {
              id: "3",              icon: Zap,
              title: "Projects Delivered",              value: "500+"
            },
            {
              id: "4",              icon: Award,
              title: "Years Building",              value: "5+"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="journey" data-section="journey">
        <FeatureCardTwentyThree
          title="My Entrepreneurial Journey"
          description="Key milestones and lessons learned along the way."
          features={[
            {
              id: "1",              title: "The Leap: College to Startup",              tags: ["Turning Point", "2019"],
              imageSrc: "https://img.b2bpic.net/free-photo/business-teamwork-success-concept_1421-16.jpg",              imageAlt: "College dropout turned entrepreneur"
            },
            {
              id: "2",              title: "Building Multiple Ventures",              tags: ["Expansion", "2021-2024"],
              imageSrc: "https://img.b2bpic.net/free-photo/excited-by-good-news-motivated-colleagues-celebrating-corporate-success-together_1163-5118.jpg",              imageAlt: "Multiple companies under management"
            },
            {
              id: "3",              title: "Innovation & Impact",              tags: ["Growth", "Present"],
              imageSrc: "https://img.b2bpic.net/free-vector/stylish-business-leader-background_1017-20822.jpg",              imageAlt: "Continuous innovation and scaling"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Let's build something great together. Whether you're interested in collaboration, investment opportunities, or just want to chat about startups, I'm always open to connecting with like-minded entrepreneurs."
          animationType="entrance-slide"
          buttons={[
            { text: "Send me an email", href: "mailto:founder@webild.com" },
            { text: "Schedule a call", href: "#" }
          ]}
          background={{ variant: "radial-gradient" }}
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="WEBILD"
          leftLink={{ text: "Privacy", href: "/privacy" }}
          rightLink={{ text: "Terms", href: "/terms" }}
        />
      </div>
    </ThemeProvider>
  );
}