Files
e6915d06-7d4b-40c0-ad00-02b…/src/app/page.tsx
2026-03-02 18:25:52 +00:00

302 lines
18 KiB
TypeScript

"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}
names={["Shopify", "WooCommerce", "Magento", "BigCommerce", "PrestaShop", "Squarespace", "Shopware"]}
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>
);
}