"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Award, DollarSign, HelpCircle, Heart, Link as LinkIcon, Palette, Plug, Settings, Sparkles, TrendingUp, Users, Zap } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="mediumLargeSizeMediumTitles"
      background="none"
      cardStyle="solid"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "Reviews", id: "testimonials" },
            { name: "FAQ", id: "faq" },
            { name: "Contact", id: "contact" }
          ]}
          brandName="ReviewHub"
          bottomLeftText="Made for ecommerce sellers"
          bottomRightText="hello@reviewhub.io"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardGallery
          title="Empower Your Customers With Social Proof"
          description="Let ecommerce sellers showcase authentic customer reviews directly on their websites. Build trust, boost conversions, and grow your business with ReviewHub."
          tag="SaaS Platform"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          background={{ variant: "plain" }}
          buttons={[
            { text: "Start Free Trial", href: "#pricing" },
            { text: "See Demo", href: "#testimonials" }
          ]}
          buttonAnimation="slide-up"
          mediaItems={[
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/a-beautiful-ecommerce-dashboard-showing--1772475735543-287ea9c9.png?_wi=1", imageAlt: "ReviewHub Dashboard" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/a-minimalist-illustration-showing-easy-i-1772475734331-ecd46dd4.png?_wi=1", imageAlt: "Easy integration workflow" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/an-interface-showing-a-review-management-1772475735921-211e41c1.png?_wi=1", imageAlt: "Review management dashboard" }
          ]}
          mediaAnimation="slide-up"
          ariaLabel="ReviewHub hero section"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentyFive
          title="Powerful Features Built for Your Success"
          description="Everything you need to manage and display customer reviews seamlessly across your ecommerce platform."
          tag="Core Features"
          tagIcon={Zap}
          tagAnimation="slide-up"
          features={[
            {
              title: "One-Click Integration",              description: "Connect ReviewHub to your store in minutes with simple API integration or pre-built plugins for major platforms.",              icon: Plug,
              mediaItems: [
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/a-minimalist-illustration-showing-easy-i-1772475734331-ecd46dd4.png?_wi=2", imageAlt: "Easy integration workflow" },
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/an-interface-showing-a-review-management-1772475735921-211e41c1.png?_wi=2", imageAlt: "Review management dashboard" }
              ]
            },
            {
              title: "Smart Review Management",              description: "Moderate, organize, and display reviews with intelligent filtering, sorting, and curation tools.",              icon: Settings,
              mediaItems: [
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/an-interface-showing-a-review-management-1772475735921-211e41c1.png?_wi=3", imageAlt: "Review management dashboard" },
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/a-beautiful-ecommerce-dashboard-showing--1772475735543-287ea9c9.png?_wi=2", imageAlt: "ReviewHub Dashboard" }
              ]
            },
            {
              title: "Beautiful Display Widgets",              description: "Customizable review widgets that match your brand and increase customer trust on product pages.",              icon: Palette,
              mediaItems: [
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/a-beautiful-ecommerce-dashboard-showing--1772475735543-287ea9c9.png?_wi=3", imageAlt: "ReviewHub Dashboard" },
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/a-minimalist-illustration-showing-easy-i-1772475734331-ecd46dd4.png?_wi=3", imageAlt: "Easy integration workflow" }
              ]
            },
            {
              title: "Analytics & Insights",              description: "Track review metrics, customer sentiment, and conversion impact with detailed analytics dashboard.",              icon: TrendingUp,
              mediaItems: [
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/an-interface-showing-a-review-management-1772475735921-211e41c1.png?_wi=4", imageAlt: "Review management dashboard" },
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/a-beautiful-ecommerce-dashboard-showing--1772475735543-287ea9c9.png?_wi=4", imageAlt: "ReviewHub Dashboard" }
              ]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="ReviewHub features section"
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="About ReviewHub"
          tagIcon={Award}
          tagAnimation="slide-up"
          title="Reviews drive 4.5x more conversions and build lasting customer trust."
          description="Sarah Martinez"
          subdescription="Founder, Digital Store Collective"
          icon={Heart}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/a-professional-photo-of-a-smiling-busine-1772475734439-c0219600.png"
          imageAlt="Satisfied ecommerce store owner"
          mediaAnimation="slide-up"
          useInvertedBackground={false}
          ariaLabel="ReviewHub about section"
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Leading Ecommerce Platforms"
          description="ReviewHub integrates seamlessly with the platforms you already use."
          tag="Integrations"
          tagIcon={LinkIcon}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          logos={[
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/shopify-logo-icon-in-professional-style--1772475734342-289599b2.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/woocommerce-logo-in-professional-style-c-1772475733327-dddfc317.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/magento-logo-in-professional-style-recog-1772475734270-73e95fe5.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/bigcommerce-logo-in-professional-design--1772475734114-1c26134b.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/prestashop-logo-in-professional-style-re-1772475734388-7f88388b.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/squarespace-logo-in-professional-style-c-1772475738280-c2cd0c55.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/shopware-logo-in-professional-style-ecom-1772475733299-7ba2d962.png"
          ]}
          speed={40}
          showCard={true}
          ariaLabel="ReviewHub integration partners"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardThree
          title="Simple, Transparent Pricing"
          description="Choose the perfect plan for your business. All plans include core review features and support."
          tag="Pricing"
          tagIcon={DollarSign}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          plans={[
            {
              id: "starter",              price: "$29/mo",              name: "Starter",              buttons: [
                { text: "Get Started" },
                { text: "Contact Sales" }
              ],
              features: [
                "Up to 100 reviews",                "Basic widget customization",                "Email support",                "Monthly analytics"
              ]
            },
            {
              id: "professional",              price: "$79/mo",              name: "Professional",              badge: "Most Popular",              badgeIcon: Sparkles,
              buttons: [
                { text: "Get Started" },
                { text: "Contact Sales" }
              ],
              features: [
                "Unlimited reviews",                "Advanced customization",                "Priority email support",                "Real-time analytics",                "API access",                "Review automation"
              ]
            },
            {
              id: "enterprise",              price: "Custom",              name: "Enterprise",              buttons: [
                { text: "Contact Sales" },
                { text: "Book Demo" }
              ],
              features: [
                "Everything in Professional",                "Dedicated account manager",                "24/7 phone support",                "Custom integrations",                "White-label options",                "SLA guarantee"
              ]
            }
          ]}
          ariaLabel="ReviewHub pricing plans"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="Loved by Thousands of Sellers"
          description="See what real ecommerce entrepreneurs say about ReviewHub."
          tag="Customer Success"
          tagIcon={Users}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          testimonials={[
            {
              id: "1",              name: "Emma Johnson",              role: "Store Owner",              company: "EcoStyle Boutique",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/professional-portrait-photo-of-a-confide-1772475733516-724f7b4a.png",              imageAlt: "Emma Johnson"
            },
            {
              id: "2",              name: "Michael Chen",              role: "E-commerce Manager",              company: "Tech Gear Co",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/professional-portrait-photo-of-a-male-en-1772475734232-810a1d17.png",              imageAlt: "Michael Chen"
            },
            {
              id: "3",              name: "Jessica Williams",              role: "Marketing Director",              company: "Fashion Forward",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/professional-portrait-photo-of-a-confide-1772475734092-c9c1b2f4.png",              imageAlt: "Jessica Williams"
            },
            {
              id: "4",              name: "David Rodriguez",              role: "CEO",              company: "Home Essentials Plus",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOtubOrcODe6yZsJM8FClPVgEf/professional-portrait-photo-of-a-male-sm-1772475734314-8abfde8e.png",              imageAlt: "David Rodriguez"
            }
          ]}
          ariaLabel="Customer testimonials"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Find answers to common questions about ReviewHub and how it can help your business."
          tag="Help Center"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "How quickly can I get started?",              content: "Most stores are set up and collecting reviews within 15 minutes. Simply sign up, connect your ecommerce platform, and add the review widget to your product pages. We provide step-by-step guidance throughout the process."
            },
            {
              id: "2",              title: "Which platforms does ReviewHub support?",              content: "ReviewHub integrates with Shopify, WooCommerce, Magento, BigCommerce, PrestaShop, Squarespace, Shopware, and any custom ecommerce platform via our REST API. We're constantly adding new integrations."
            },
            {
              id: "3",              title: "Can I customize how reviews appear?",              content: "Absolutely! Our review widgets are fully customizable. You can adjust colors, fonts, layout, and positioning to match your brand perfectly. No coding required—use our visual customization tools."
            },
            {
              id: "4",              title: "How do I collect reviews from customers?",              content: "ReviewHub offers multiple collection methods: automated email invitations after purchase, incentivized review campaigns, QR codes, and manual review requests. Customize the timing and messaging to match your strategy."
            },
            {
              id: "5",              title: "Is customer data secure?",              content: "Yes, we use enterprise-grade encryption and comply with GDPR, CCPA, and other privacy regulations. All customer data is securely stored and never shared with third parties without explicit consent."
            },
            {
              id: "6",              title: "What kind of analytics do you provide?",              content: "Our analytics dashboard shows review volume trends, average ratings, customer sentiment analysis, conversion impact metrics, and more. Export reports and track how reviews affect your sales performance."
            }
          ]}
          ariaLabel="Frequently asked questions"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="ReviewHub"
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "#features" },
                { label: "Pricing", href: "#pricing" },
                { label: "Integrations", href: "#social-proof" },
                { label: "Security", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About", href: "#about" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Contact", href: "#" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Documentation", href: "#" },
                { label: "API Reference", href: "#" },
                { label: "Help Center", href: "#faq" },
                { label: "Status", href: "#" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookie Policy", href: "#" },
                { label: "Compliance", href: "#" }
              ]
            }
          ]}
          copyrightText="© 2025 ReviewHub. All rights reserved."
          ariaLabel="Site footer"
        />
      </div>
    </ThemeProvider>
  );
}
