"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import TextAbout from '@/components/sections/about/TextAbout';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        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">
      <NavbarLayoutFloatingInline
      navItems={[
        { name: "Dashboard", id: "#dashboard" },
        { name: "Explore", id: "#explore" },
        { name: "Leaderboard", id: "#leaderboard" },
        { name: "Add Startup", id: "#add-startup" },
      ]}
      brandName="TrustMRR"
      button={{ text: "Login", href: "/login" }}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardRotatedCarousel
      background={{ variant: "rotated-rays-animated" }}
      title="Prove Your Startup's MRR"
      description="The transparent database of verified startup revenues. Connect your Stripe or LemonSqueezy account to build trust with investors and founders."
      buttons={[{ text: "Start Verifying", href: "#add-startup" }]}
      carouselItems={[
        { id: "1", imageSrc: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126353.jpg?_wi=1", imageAlt: "Dashboard visualization" },
        { id: "2", imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-looks-greenscreen_482257-76544.jpg?_wi=1", imageAlt: "Subscription metrics" },
        { id: "3", imageSrc: "http://img.b2bpic.net/free-photo/minimalist-architectural-building-details_23-2151870855.jpg?_wi=1", imageAlt: "Growth charts" },
        { id: "4", imageSrc: "http://img.b2bpic.net/free-photo/ai-cloud-concept-with-cube_23-2149739756.jpg?_wi=1", imageAlt: "API integration" },
        { id: "5", imageSrc: "http://img.b2bpic.net/free-photo/cyberpunk-location-tracking-mobile-device_23-2152001127.jpg?_wi=1", imageAlt: "Network graph" },
        { id: "6", imageSrc: "http://img.b2bpic.net/free-photo/data-analytics-dashboard_23-2152001529.jpg", imageAlt: "Data reports" },
      ]}
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardEleven
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={true}
      metrics={[
        { id: "1", value: "$100M+", title: "Verified MRR", description: "Total tracked revenue across our platform.", imageSrc: "http://img.b2bpic.net/free-photo/calculator-money-wallet-investment-saving-finance-concept-pink-background-3d-rendering_56104-1432.jpg" },
        { id: "2", value: "1.2K", title: "Startups", description: "Verified businesses growing in public.", imageSrc: "http://img.b2bpic.net/free-photo/lock-sign-front-side-white-background_187299-40178.jpg" },
        { id: "3", value: "100%", title: "Secure", description: "Read-only access via official APIs.", imageSrc: "http://img.b2bpic.net/free-vector/ecological-strategy-development-natural-resources-access-ecologists-cartoon-characters-eco-shield-environmental-protection-world-rescue_335657-763.jpg" },
      ]}
      title="Verified Performance"
      description="Real-time revenue insights backed by verified payment gateway data."
    />
  </div>

  <div id="about" data-section="about">
      <TextAbout
      useInvertedBackground={false}
      title="Radical Transparency for Startups"
      buttons={[{ text: "Read our API Docs", href: "/docs" }]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyFour
      animationType="scale-rotate"
      textboxLayout="split"
      useInvertedBackground={true}
      features={[
        { id: "f1", title: "Stripe & LemonSqueezy", author: "Integration", description: "Connect your payment accounts in seconds for read-only verified data.", tags: ["API", "Finance"], imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-using-trade-market-profit-data-screen-create-financial-investment-looking-stock-charts-statistics-male-broker-analyzing-hedge-hund-trend-forex-exchange_482257-39523.jpg" },
        { id: "f2", title: "Public Revenue Profiles", author: "Transparency", description: "Share your revenue journey with a beautiful, auto-updating profile page.", tags: ["Social", "Growth"], imageSrc: "http://img.b2bpic.net/free-photo/hand-pointing-currency-blockchain-technology-background_53876-102966.jpg" },
        { id: "f3", title: "AI Analytics Query", author: "Intelligence", description: "Ask natural language questions like 'Top 5 SaaS startups in India' and get SQL-driven results.", tags: ["AI", "Analytics"], imageSrc: "http://img.b2bpic.net/free-photo/dynamic-data-visualization-3d_23-2151904319.jpg" },
      ]}
      title="Built for Founders"
      description="Everything you need to showcase your metrics to the world."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        { id: "1", name: "Sarah Miller", date: "Oct 2023", title: "Founder", quote: "TrustMRR gave us the credibility we needed to raise our seed round.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1662.jpg", imageSrc: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126353.jpg?_wi=2", imageAlt: "professional entrepreneur portrait" },
        { id: "2", name: "James Chen", date: "Nov 2023", title: "CTO", quote: "The easiest way to display our metrics without manually updating screenshots.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-bearded-man-smiling-using-laptop-while-sitting-sofa-home_231208-14093.jpg", imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-looks-greenscreen_482257-76544.jpg?_wi=2", imageAlt: "professional entrepreneur portrait" },
        { id: "3", name: "Elena Rodriguez", date: "Dec 2023", title: "CEO", quote: "Love the AI query feature. It helps me spot growth trends instantly.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-business-leader-looking-through-window_1262-5623.jpg", imageSrc: "http://img.b2bpic.net/free-photo/minimalist-architectural-building-details_23-2151870855.jpg?_wi=2", imageAlt: "professional entrepreneur portrait" },
        { id: "4", name: "David Park", date: "Jan 2024", title: "Founder", quote: "The integration process was flawless. 10/10 recommendation.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/black-white-portrait-digital-nomads_23-2151253957.jpg", imageSrc: "http://img.b2bpic.net/free-photo/ai-cloud-concept-with-cube_23-2149739756.jpg?_wi=2", imageAlt: "professional entrepreneur portrait" },
        { id: "5", name: "Sophie Moore", date: "Feb 2024", title: "Growth Lead", quote: "Finally, a way to prove our revenue transparently.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/handsome-young-man-wearing-checkered-shirt-standing-night-street-illuminated-signboards-neon-lights_613910-21240.jpg", imageSrc: "http://img.b2bpic.net/free-photo/cyberpunk-location-tracking-mobile-device_23-2152001127.jpg?_wi=2", imageAlt: "professional entrepreneur portrait" },
      ]}
      title="Trusted by Founders"
      description="Hear from the startup community building in public."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="split"
      useInvertedBackground={true}
      faqs={[
        { id: "q1", title: "Is my revenue data safe?", content: "Yes, we only use read-only API keys from Stripe/LemonSqueezy to sync metrics." },
        { id: "q2", title: "Can I hide specific metrics?", content: "Yes, you have full control over what data is made public on your profile." },
        { id: "q3", title: "Do you support other payment gateways?", content: "We currently support Stripe and LemonSqueezy, with more coming soon." },
      ]}
      title="Common Questions"
      description="Get clarity on how TrustMRR keeps your data safe and verified."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Need Help?"
      description="Reach out to our support team for any integration issues or inquiries."
      inputs={[
        { name: "name", type: "text", placeholder: "Your Name", required: true },
        { name: "email", type: "email", placeholder: "Your Email", required: true },
      ]}
      textarea={{ name: "message", placeholder: "Describe your request...", rows: 4, required: true }}
      imageSrc="http://img.b2bpic.net/free-photo/easy-online-returns_23-2151952967.jpg"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoText="TrustMRR"
      leftLink={{ text: "Terms of Service", href: "/terms" }}
      rightLink={{ text: "Support", href: "/support" }}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
