"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import TextAbout from '@/components/sections/about/TextAbout';
import { Shield, Star, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="rounded"
        contentWidth="compact"
        sizing="largeSmallSizeMediumTitles"
        background="blurBottom"
        cardStyle="layered-gradient"
        primaryButtonStyle="shadow"
        secondaryButtonStyle="layered"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Features",          id: "features"},
        {
          name: "Analytics",          id: "analytics"},
        {
          name: "Pricing",          id: "pricing"},
        {
          name: "Support",          id: "contact"},
      ]}
      brandName="NeuroFlow"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardCarousel
      background={{
        variant: "sparkles-gradient"}}
      title="Build Smarter. Launch Faster."
      description="NeuroFlow revolutionizes your workflow with adaptive AI agents that evolve with your data. Experience seamless automation, predictive analytics, and next-level engineering performance."
      tag="The Next Gen AI Platform"
      buttons={[
        {
          text: "Start Free",          href: "#"},
        {
          text: "See Demo",          href: "#"},
      ]}
      mediaItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-vector/futuristic-infographics-template-theme_23-2148447379.jpg",          imageAlt: "AI Analytics Dashboard"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/optical-laser-horizontal-background_23-2149116269.jpg",          imageAlt: "Neural Landscape"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/hand-with-glitch-overlay-3d-tone_53876-126846.jpg",          imageAlt: "AI Hardware Integration"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169842.jpg",          imageAlt: "Glass Metric Cards"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/big-data-ai-learning-concept-server-center-3d-render_482257-27721.jpg",          imageAlt: "Data Node Infrastructure"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-hi-tech-neon-background-generative-ai_91128-2309.jpg",          imageAlt: "Processor Core"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <TextAbout
      useInvertedBackground={false}
      title="Intelligence Integrated into Every Pixel"
      buttons={[
        {
          text: "Learn More"},
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardSixteen
      animationType="depth-3d"
      textboxLayout="default"
      useInvertedBackground={true}
      negativeCard={{
        items: [
          "Legacy Slow Workflows",          "Static Data Silos",          "Manual Monitoring"],
      }}
      positiveCard={{
        items: [
          "Real-time AI Automation",          "Predictive Analytics",          "Instant Scaling"],
      }}
      title="Engineered for Velocity"
      description="Unlock infinite potential with automated workflows and intelligent agents."
    />
  </div>

  <div id="product" data-section="product">
      <ProductCardOne
      animationType="blur-reveal"
      textboxLayout="default"
      gridVariant="bento-grid"
      useInvertedBackground={false}
      products={[
        {
          id: "p1",          name: "Flow Engine",          price: "$49",          imageSrc: "http://img.b2bpic.net/free-photo/cyberpunk-city-street-night-with-neon-lights-futuristic-aesthetic_23-2151488747.jpg"},
        {
          id: "p2",          name: "Data Agent",          price: "$79",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-optical-fiber-details_23-2149212565.jpg"},
        {
          id: "p3",          name: "Predictive UI",          price: "$99",          imageSrc: "http://img.b2bpic.net/free-vector/glass-website-elements-templates-vector-set-element-design-button-internet-chart-graph_1284-42823.jpg"},
        {
          id: "p4",          name: "Collaboration Hub",          price: "$129",          imageSrc: "http://img.b2bpic.net/free-photo/business-chart-visual-graphics-report-concept_53876-167093.jpg"},
        {
          id: "p5",          name: "Voice Command AI",          price: "$159",          imageSrc: "http://img.b2bpic.net/free-photo/fiber-optics-lights-abstract-background_23-2148241393.jpg"},
        {
          id: "p6",          name: "Security Agent",          price: "$199",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-hard-disk-components-with-blue-light_23-2149413368.jpg"},
      ]}
      title="NeuroFlow Enterprise Suite"
      description="Deploy AI agents that understand your unique engineering stack."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardOne
      animationType="depth-3d"
      textboxLayout="default"
      gridVariant="bento-grid"
      useInvertedBackground={true}
      metrics={[
        {
          id: "m1",          value: "10x",          title: "Performance Boost",          description: "Across CI/CD pipelines.",          icon: Zap,
        },
        {
          id: "m2",          value: "99.9%",          title: "Uptime Reliability",          description: "Enterprise-grade stability.",          icon: Shield,
        },
        {
          id: "m3",          value: "450+",          title: "AI Models Deployed",          description: "Within production environments.",          icon: Star,
        },
      ]}
      title="Precision Measured Daily"
      description="Real-time impact for teams at scale."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwo
      animationType="scale-rotate"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Sarah Jenkins",          role: "CTO",          testimonial: "NeuroFlow changed the game for our infrastructure team.",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-male-personal-shopper-working_23-2148924153.jpg"},
        {
          id: "t2",          name: "Mark Miller",          role: "Lead Architect",          testimonial: "The AI agents feel like an extension of our own team.",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-businesswoman-indoors-with-arms-closed_23-2148824828.jpg"},
        {
          id: "t3",          name: "Emily Chen",          role: "Product Manager",          testimonial: "Efficiency reached an all-time high within a week.",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-beautiful-woman-party_23-2149220899.jpg"},
        {
          id: "t4",          name: "David Wu",          role: "Developer",          testimonial: "The integration flow is simply flawless and fast.",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-feeling-happy-cute-romantic-love-making-heart-shape-with-both-hands_1194-635070.jpg"},
        {
          id: "t5",          name: "Elena Rodriguez",          role: "Operations",          testimonial: "Scalability issues are a thing of the past for us.",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-professional-businesswoman-indoors_23-2148824827.jpg"},
      ]}
      title="Trusted by Innovators"
      description="Leading companies launch faster with us."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitText
      useInvertedBackground={true}
      faqs={[
        {
          id: "f1",          title: "How does AI evolve?",          content: "Our models learn continuously from your deployment patterns."},
        {
          id: "f2",          title: "Is security guaranteed?",          content: "We employ enterprise-grade encryption for all data."},
        {
          id: "f3",          title: "What integrations exist?",          content: "NeuroFlow supports all major cloud and local stacks."},
      ]}
      sideTitle="Frequently Asked Questions"
      sideDescription="Need more insights into our platform?"
      faqsAnimation="blur-reveal"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "rotated-rays-animated"}}
      text="Ready to build the future with NeuroFlow?"
      buttons={[
        {
          text: "Start Launching",          href: "#"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "Product",          items: [
            {
              label: "Features",              href: "#features"},
            {
              label: "Pricing",              href: "#pricing"},
          ],
        },
        {
          title: "Company",          items: [
            {
              label: "About",              href: "#"},
            {
              label: "Careers",              href: "#"},
          ],
        },
      ]}
      bottomLeftText="© 2024 NeuroFlow AI."
      bottomRightText="All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
