"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import TextAbout from '@/components/sections/about/TextAbout';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="small"
        sizing="mediumLarge"
        background="none"
        cardStyle="gradient-bordered"
        primaryButtonStyle="shadow"
        secondaryButtonStyle="layered"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        { name: "Home", id: "hero" },
        { name: "About", id: "about" },
        { name: "Services", id: "features" },
        { name: "Pricing", id: "pricing" },
        { name: "Contact", id: "contact" },
      ]}
      brandName="HELPNES"
      button={{ text: "Get Started", href: "#contact" }}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroCentered
      background={{ variant: "gradient-bars" }}
      title="Build Your Digital Presence with HELPNES"
      description="Transition your business from invisible to influential. We provide the professional tools and digital infrastructure to turn your local operation into a scalable online powerhouse."
      avatars={[
        { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Dd2dhmYzehQCCgNV23cokcmp4T/uploaded-1778597745993-vgqnvbpn.jpg", alt: "Client Profile" },
        { src: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2541.jpg", alt: "Smiling professional" },
        { src: "http://img.b2bpic.net/free-photo/smiling-middle-aged-attractive-woman-showing-thumb-up-outdoors_1262-12526.jpg", alt: "Satisfied business owner" },
        { src: "http://img.b2bpic.net/free-photo/excited-man-celebrates-startup-office_482257-123590.jpg", alt: "Happy startup leader" },
        { src: "http://img.b2bpic.net/free-photo/man-looking-camera-his-office_23-2148242891.jpg", alt: "Confident professional" },
      ]}
      avatarText="Trusted by 500+ Growing Businesses"
      buttons={[{ text: "Get Started", href: "#contact" }]}
      marqueeItems={[
        { type: "text", text: "Web Development" },
        { type: "text", text: "SEO Strategy" },
        { type: "text", text: "Domain Setup" },
        { type: "text", text: "Email Hosting" },
        { type: "text", text: "Cloud Solutions" },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <TextAbout
      useInvertedBackground={false}
      title="Simplifying Technology for Your Business Growth"
      buttons={[{ text: "Our Mission", href: "#contact" }]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyOne
      useInvertedBackground={true}
      title="Comprehensive Business Solutions"
      description="We simplify complex digital needs into high-quality, efficient services that drive real results for companies and entrepreneurs."
      accordionItems={[
        { id: "feat-1", title: "Web Design & Development", content: "Professional, fast, and secure websites built for modern devices." },
        { id: "feat-2", title: "Business Email & Domain", content: "Official business email setup and reliable domain management services." },
        { id: "feat-3", title: "Google Maps & SEO", content: "Build visibility through professional business profile creation and optimization." },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/group-graphic-designers-giving-high-five-each-other_1170-1096.jpg"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardFourteen
      useInvertedBackground={false}
      title="Performance Driven Results"
      tag="Our Impact"
      metrics={[
        { id: "m1", value: "100+", description: "Projects Delivered" },
        { id: "m2", value: "99.9%", description: "System Reliability" },
        { id: "m3", value: "24/7", description: "Technical Support" },
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="services" data-section="services">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      products={[
        { id: "p1", name: "Web Development", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/top-view-social-media-drawings_1134-84.jpg" },
        { id: "p2", name: "Domain Services", price: "Affordable", imageSrc: "http://img.b2bpic.net/free-photo/computers-data-center-running-server-rigs-diagnostic-tests_482257-118495.jpg" },
        { id: "p3", name: "Email Setup", price: "Professional", imageSrc: "http://img.b2bpic.net/free-photo/3d-view-map_23-2150471700.jpg" },
        { id: "p4", name: "Marketing Strategy", price: "Performance", imageSrc: "http://img.b2bpic.net/free-photo/supervisor-doing-server-diagnostic-test_482257-84917.jpg" },
        { id: "p5", name: "Google Maps Profile", price: "Optimized", imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-different-applications-installed_1134-89.jpg" },
        { id: "p6", name: "Online Advertising", price: "Targeted", imageSrc: "http://img.b2bpic.net/free-photo/email-inbox-message-list-online-interface_53876-133860.jpg" },
      ]}
      title="Our Digital Services"
      description="A wide range of electronic business solutions designed to build a strong presence."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardOne
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      plans={[
        {
          id: "starter",          badge: "Essential",          price: "$299",          subtitle: "For new ventures",          features: ["Custom Web Design", "Domain Setup", "Support"],
        },
        {
          id: "pro",          badge: "Popular",          price: "$599",          subtitle: "For growing businesses",          features: ["Everything in Starter", "Digital Marketing", "SEO Setup"],
        },
        {
          id: "ultimate",          badge: "Enterprise",          price: "$999",          subtitle: "Full digital presence",          features: ["Everything in Pro", "Ad Management", "Continuous Support"],
        },
      ]}
      title="Plans That Scale"
      description="Pick the package that matches your business scale and digital growth goals."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSix
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={true}
      testimonials={[
        { id: "t1", name: "Ahmed M.", handle: "@ahmedm", testimonial: "Excellent service and fast support. HELPNES turned my vision into reality.", imageSrc: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2580.jpg" },
        { id: "t2", name: "Sarah K.", handle: "@sarahk", testimonial: "Very professional approach. Our online visibility grew significantly.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-wearing-post-its_23-2149362874.jpg" },
        { id: "t3", name: "Omar F.", handle: "@omarf", testimonial: "Smart electronic solutions that truly helped my company expand digitally.", imageSrc: "http://img.b2bpic.net/free-photo/joyful-business-woman-with-coffee-cup_23-2148095746.jpg" },
        { id: "t4", name: "Layla H.", handle: "@laylah", testimonial: "Quick domain setup and email integration. Highly recommend their work.", imageSrc: "http://img.b2bpic.net/free-photo/group-young-colleagues-giving-each-other-high-five_171337-7424.jpg" },
        { id: "t5", name: "Khalid S.", handle: "@khalids", testimonial: "Fantastic experience. Their continuous support is worth every penny.", imageSrc: "http://img.b2bpic.net/free-photo/man-with-vr-goggles_1098-14668.jpg" },
      ]}
      title="What Our Clients Say"
      description="Hear from the partners who trusted us to build their digital presence."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitText
      useInvertedBackground={false}
      faqs={[
        { id: "q1", title: "How fast can you set up my domain?", content: "Most domains are activated within 24-48 hours." },
        { id: "q2", title: "Do you offer technical support?", content: "Yes, we provide continuous technical support for all our clients." },
        { id: "q3", title: "Can you help with digital marketing?", content: "We offer full digital marketing campaigns and advertising management." },
      ]}
      sideTitle="Frequently Asked Questions"
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      useInvertedBackground={true}
      background={{ variant: "plain" }}
      tag="Contact Us"
      title="Let's Build Your Digital Future"
      description="Have questions? Contact us today to discuss your business requirements and receive a free quote."
      mediaAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/busy-multicultural-diverse-employees-analysing-annual-financial-statistics-sitting-conference-desk-back-laptop-holding-documents-searching-business-solutions-business-team-working-company_482257-13900.jpg"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoText="HELPNES"
      columns={[
        {
          title: "Services",          items: [
            { label: "Web Development", href: "#services" },
            { label: "Marketing", href: "#services" },
          ],
        },
        {
          title: "Company",          items: [
            { label: "About Us", href: "#about" },
            { label: "Contact", href: "#contact" },
          ],
        },
      ]}
      copyrightText="© 2024 HELPNES Digital Services. All Rights Reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}