bender/7ee1c946-e64d-48c2-83cc-b05a1ab28959
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-03-10 09:31:17 +00:00
parent e0df42db6a
commit 2f3caab644
1 changed files with 58 additions and 227 deletions
Download Patch File Download Diff File Expand all files Collapse all files

285
src/app/page.tsx
View File

@@ -62,7 +62,7 @@ export default function HomePage() {
borderRadius="pill"
contentWidth="mediumLarge"
sizing="largeSizeMediumTitles"
background="noise"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="radial-glow"
@@ -76,9 +76,7 @@ export default function HomePage() {
id: item.id,
}))}
button={{
text: "Get Started",
href: "#contact",
}}
text: "Get Started", href: "#contact"}}
animateOnLoad={true}
/>
</div>
@@ -88,37 +86,26 @@ export default function HomePage() {
title="Automate Payment Thank-Yous With WhatsApp"
description="PayWhatsApp helps small shops in India automatically send thank-you messages via WhatsApp after successful payments. Integrate with Razorpay, accept UPI payments, and build customer relationships effortlessly."
background={{
variant: "noise",
}}
variant: "sparkles-gradient"}}
tag="For Small Indian Businesses"
tagIcon={Sparkles}
tagAnimation="slide-up"
buttons={[
{
text: "Start Free Trial",
href: "#contact",
},
text: "Start Free Trial", href: "#contact"},
{
text: "Watch Demo",
href: "https://www.youtube.com",
},
text: "Watch Demo", href: "https://www.youtube.com"},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-modern-saas-dashboard-interface-showin-1773134907913-db021c34.png"
imageAlt="PayWhatsApp Dashboard Preview"
mediaAnimation="slide-up"
avatars={[
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-male--1773134907301-6bd41aef.png",
alt: "Shop Owner 1",
},
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-male--1773134907301-6bd41aef.png", alt: "Shop Owner 1"},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-femal-1773134907275-c7203bd2.png",
alt: "Salon Owner",
},
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-femal-1773134907275-c7203bd2.png", alt: "Salon Owner"},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-casual-professional-portrait-of-a-male-1773134907196-5e28a633.png",
alt: "Cafe Owner",
},
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-casual-professional-portrait-of-a-male-1773134907196-5e28a633.png", alt: "Cafe Owner"},
]}
avatarText="Trusted by 500+ Indian small business owners"
ariaLabel="Hero section - PayWhatsApp automated payment system"
@@ -133,29 +120,11 @@ export default function HomePage() {
tagIcon={Zap}
features={[
{
id: "1",
title: "Customer Scans QR Code",
description: "Your customer scans the unique QR code displayed at your shop. The payment page opens on their phone automatically.",
tag: "Step 1",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-mobile-phone-displaying-a-qr-code-paym-1773134909527-501e32d0.png?_wi=1",
imageAlt: "QR Code Payment Interface",
},
id: "1", title: "Customer Scans QR Code", description: "Your customer scans the unique QR code displayed at your shop. The payment page opens on their phone automatically.", tag: "Step 1", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-mobile-phone-displaying-a-qr-code-paym-1773134909527-501e32d0.png", imageAlt: "QR Code Payment Interface"},
{
id: "2",
title: "Payment Processing",
description: "Customer enters their phone number and completes payment through their preferred UPI app like PhonePe, Paytm, or Google Pay.",
tag: "Step 2",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-visual-flowchart-showing-the-payment-p-1773134907058-be15f1fb.png?_wi=1",
imageAlt: "Payment Processing Flow",
},
id: "2", title: "Payment Processing", description: "Customer enters their phone number and completes payment through their preferred UPI app like PhonePe, Paytm, or Google Pay.", tag: "Step 2", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-visual-flowchart-showing-the-payment-p-1773134907058-be15f1fb.png", imageAlt: "Payment Processing Flow"},
{
id: "3",
title: "Automatic WhatsApp Message",
description: "Payment confirmation triggers an automatic thank-you message on WhatsApp, building customer loyalty and repeat visits.",
tag: "Step 3",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-whatsapp-conversation-thread-showing-a-1773134906944-6c044559.png?_wi=1",
imageAlt: "WhatsApp Automation",
},
id: "3", title: "Automatic WhatsApp Message", description: "Payment confirmation triggers an automatic thank-you message on WhatsApp, building customer loyalty and repeat visits.", tag: "Step 3", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-whatsapp-conversation-thread-showing-a-1773134906944-6c044559.png", imageAlt: "WhatsApp Automation"},
]}
animationType="slide-up"
textboxLayout="default"
@@ -170,53 +139,17 @@ export default function HomePage() {
description="Everything you need to manage payments and customer communication in one platform"
features={[
{
id: "1",
title: "QR Code Payment Generator",
description: "Create unique payment QR codes instantly. Each shop gets its own branded QR code for easy customer payments.",
tag: "Payment",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-close-up-view-of-a-generated-upi-qr-co-1773134911582-422a69dd.png?_wi=1",
imageAlt: "QR Code Generation",
},
id: "1", title: "QR Code Payment Generator", description: "Create unique payment QR codes instantly. Each shop gets its own branded QR code for easy customer payments.", tag: "Payment", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-close-up-view-of-a-generated-upi-qr-co-1773134911582-422a69dd.png", imageAlt: "QR Code Generation"},
{
id: "2",
title: "Real-Time Webhook Processing",
description: "Razorpay webhooks instantly notify our system of successful payments. No delays, no manual intervention required.",
tag: "Integration",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-technical-diagram-showing-razorpay-pay-1773134908586-23562a19.png?_wi=1",
imageAlt: "Webhook Integration",
},
id: "2", title: "Real-Time Webhook Processing", description: "Razorpay webhooks instantly notify our system of successful payments. No delays, no manual intervention required.", tag: "Integration", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-technical-diagram-showing-razorpay-pay-1773134908586-23562a19.png", imageAlt: "Webhook Integration"},
{
id: "3",
title: "Automated WhatsApp Messages",
description: "Customizable thank-you messages sent automatically via WhatsApp Business API after payment confirmation.",
tag: "Messaging",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-whatsapp-conversation-thread-showing-a-1773134906944-6c044559.png?_wi=2",
imageAlt: "Automated Messages",
},
id: "3", title: "Automated WhatsApp Messages", description: "Customizable thank-you messages sent automatically via WhatsApp Business API after payment confirmation.", tag: "Messaging", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-whatsapp-conversation-thread-showing-a-1773134906944-6c044559.png", imageAlt: "Automated Messages"},
{
id: "4",
title: "Customer Database",
description: "All customer phone numbers, purchase amounts, and transaction dates stored securely. Build your customer relationship database.",
tag: "CRM",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-customer-database-interface-showing-a--1773134922819-d6f96fe5.png?_wi=1",
imageAlt: "Customer Database",
},
id: "4", title: "Customer Database", description: "All customer phone numbers, purchase amounts, and transaction dates stored securely. Build your customer relationship database.", tag: "CRM", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-customer-database-interface-showing-a--1773134922819-d6f96fe5.png", imageAlt: "Customer Database"},
{
id: "5",
title: "Transaction History & Export",
description: "Complete transaction records with filtering, search, and export options. Access your business data anytime.",
tag: "Analytics",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-detailed-transaction-history-report-sh-1773134909092-6ee1cac8.png?_wi=1",
imageAlt: "Transaction History",
},
id: "5", title: "Transaction History & Export", description: "Complete transaction records with filtering, search, and export options. Access your business data anytime.", tag: "Analytics", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-detailed-transaction-history-report-sh-1773134909092-6ee1cac8.png", imageAlt: "Transaction History"},
{
id: "6",
title: "Business Analytics Dashboard",
description: "Track daily revenue, customer count, popular services, and message delivery rates. Make data-driven decisions.",
tag: "Dashboard",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/an-analytics-dashboard-showing-key-metri-1773134908005-9e89ec84.png?_wi=1",
imageAlt: "Analytics Dashboard",
},
id: "6", title: "Business Analytics Dashboard", description: "Track daily revenue, customer count, popular services, and message delivery rates. Make data-driven decisions.", tag: "Dashboard", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/an-analytics-dashboard-showing-key-metri-1773134908005-9e89ec84.png", imageAlt: "Analytics Dashboard"},
]}
animationType="slide-up"
textboxLayout="default"
@@ -236,52 +169,19 @@ export default function HomePage() {
useInvertedBackground={false}
plans={[
{
id: "starter",
badge: "Popular",
badgeIcon: Star,
price: "₹499/month",
subtitle: "Perfect for single shop owners",
features: [
"1 shop account",
"Unlimited payments",
"100 WhatsApp messages/month",
"Basic analytics",
"Email support",
"7-day transaction history",
],
id: "starter", badge: "Popular", badgeIcon: Star,
price: "₹499/month", subtitle: "Perfect for single shop owners", features: [
"1 shop account", "Unlimited payments", "100 WhatsApp messages/month", "Basic analytics", "Email support", "7-day transaction history"],
},
{
id: "professional",
badge: "Best Value",
badgeIcon: Zap,
price: "₹1,299/month",
subtitle: "Ideal for growing businesses",
features: [
"3 shop accounts",
"Unlimited payments",
"1,000 WhatsApp messages/month",
"Advanced analytics",
"Priority email & phone support",
"90-day transaction history",
"Custom message templates",
],
id: "professional", badge: "Best Value", badgeIcon: Zap,
price: "₹1,299/month", subtitle: "Ideal for growing businesses", features: [
"3 shop accounts", "Unlimited payments", "1,000 WhatsApp messages/month", "Advanced analytics", "Priority email & phone support", "90-day transaction history", "Custom message templates"],
},
{
id: "enterprise",
badge: "Custom",
badgeIcon: Crown,
price: "Custom pricing",
subtitle: "For established businesses",
features: [
"Unlimited shops",
"Unlimited payments & messages",
"Premium analytics & reporting",
"24/7 dedicated support",
"Unlimited transaction history",
"API access",
"Custom integrations",
"Team management",
],
id: "enterprise", badge: "Custom", badgeIcon: Crown,
price: "Custom pricing", subtitle: "For established businesses", features: [
"Unlimited shops", "Unlimited payments & messages", "Premium analytics & reporting", "24/7 dedicated support", "Unlimited transaction history", "API access", "Custom integrations", "Team management"],
},
]}
ariaLabel="PayWhatsApp pricing plans"
@@ -300,53 +200,23 @@ export default function HomePage() {
showRating={true}
testimonials={[
{
id: "1",
name: "Raj Patel",
handle: "@rajpatel_barber",
testimonial: "PayWhatsApp increased my repeat customer visits by 35%! The automatic thank-you messages make customers feel valued. Easy setup, amazing support.",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-male--1773134907301-6bd41aef.png?_wi=1",
},
id: "1", name: "Raj Patel", handle: "@rajpatel_barber", testimonial: "PayWhatsApp increased my repeat customer visits by 35%! The automatic thank-you messages make customers feel valued. Easy setup, amazing support.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-male--1773134907301-6bd41aef.png"},
{
id: "2",
name: "Priya Sharma",
handle: "@priya_salon",
testimonial: "Running my salon became so much easier. Customers love getting instant WhatsApp confirmations. Highly recommended for all beauty professionals!",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-femal-1773134907275-c7203bd2.png?_wi=1",
},
id: "2", name: "Priya Sharma", handle: "@priya_salon", testimonial: "Running my salon became so much easier. Customers love getting instant WhatsApp confirmations. Highly recommended for all beauty professionals!", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-femal-1773134907275-c7203bd2.png"},
{
id: "3",
name: "Arjun Singh",
handle: "@arjun_cafe",
testimonial: "The integration with my UPI payments was seamless. No technical knowledge needed. My cafe's customer engagement doubled within 2 months.",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-casual-professional-portrait-of-a-male-1773134907196-5e28a633.png",
},
id: "3", name: "Arjun Singh", handle: "@arjun_cafe", testimonial: "The integration with my UPI payments was seamless. No technical knowledge needed. My cafe's customer engagement doubled within 2 months.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-casual-professional-portrait-of-a-male-1773134907196-5e28a633.png"},
{
id: "4",
name: "Meena Nair",
handle: "@meena_grocery",
testimonial: "Excellent customer support team. They helped me set everything up in 30 minutes. Now I track all my sales and customers in one place!",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-of-a-female-groc-1773134909131-8043f933.png",
},
id: "4", name: "Meena Nair", handle: "@meena_grocery", testimonial: "Excellent customer support team. They helped me set everything up in 30 minutes. Now I track all my sales and customers in one place!", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-of-a-female-groc-1773134909131-8043f933.png"},
{
id: "5",
name: "Vikram Kumar",
handle: "@vikram_retail",
testimonial: "The best investment for my retail shop. Payment processing is secure, messages are personalized, and reporting helps me understand my business better.",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-male--1773134907301-6bd41aef.png?_wi=2",
},
id: "5", name: "Vikram Kumar", handle: "@vikram_retail", testimonial: "The best investment for my retail shop. Payment processing is secure, messages are personalized, and reporting helps me understand my business better.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-male--1773134907301-6bd41aef.png"},
{
id: "6",
name: "Anjali Desai",
handle: "@anjali_boutique",
testimonial: "As a woman entrepreneur, I appreciate how easy PayWhatsApp is to use. My boutique now has professional payment processing and customer communication!",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-femal-1773134907275-c7203bd2.png?_wi=2",
},
id: "6", name: "Anjali Desai", handle: "@anjali_boutique", testimonial: "As a woman entrepreneur, I appreciate how easy PayWhatsApp is to use. My boutique now has professional payment processing and customer communication!", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkPebCR6RE3JHXw1pk25xuQoyu/a-professional-portrait-photo-of-a-femal-1773134907275-c7203bd2.png"},
]}
ariaLabel="Customer testimonials and reviews"
/>
@@ -356,20 +226,14 @@ export default function HomePage() {
<InlineImageSplitTextAbout
heading={[
{
type: "text",
content: "Your Business Dashboard In One Place",
},
type: "text", content: "Your Business Dashboard In One Place"},
]}
useInvertedBackground={false}
buttons={[
{
text: "View Full Dashboard",
href: "/dashboard",
},
text: "View Full Dashboard", href: "/dashboard"},
{
text: "Learn More",
href: "#features",
},
text: "Learn More", href: "#features"},
]}
buttonAnimation="slide-up"
ariaLabel="Dashboard preview and overview"
@@ -383,8 +247,7 @@ export default function HomePage() {
title="Ready to Boost Your Business?"
description="Join 500+ small business owners in India using PayWhatsApp. Start your free trial today. No credit card required."
background={{
variant: "sparkles-gradient",
}}
variant: "sparkles-gradient"}}
useInvertedBackground={false}
inputPlaceholder="Enter your email address"
buttonText="Start Free Trial"
@@ -400,81 +263,49 @@ export default function HomePage() {
{
items: [
{
label: "Features",
href: "#features",
},
label: "Features", href: "#features"},
{
label: "How It Works",
href: "#how-it-works",
},
label: "How It Works", href: "#how-it-works"},
{
label: "Pricing",
href: "#pricing",
},
label: "Pricing", href: "#pricing"},
{
label: "Dashboard",
href: "#dashboard",
},
label: "Dashboard", href: "#dashboard"},
],
},
{
items: [
{
label: "About Us",
href: "#",
},
label: "About Us", href: "#"},
{
label: "Blog",
href: "#",
},
label: "Blog", href: "#"},
{
label: "Case Studies",
href: "#",
},
label: "Case Studies", href: "#"},
{
label: "Contact",
href: "#contact",
},
label: "Contact", href: "#contact"},
],
},
{
items: [
{
label: "Privacy Policy",
href: "#",
},
label: "Privacy Policy", href: "#"},
{
label: "Terms of Service",
href: "#",
},
label: "Terms of Service", href: "#"},
{
label: "Security",
href: "#",
},
label: "Security", href: "#"},
{
label: "Status",
href: "#",
},
label: "Status", href: "#"},
],
},
{
items: [
{
label: "Twitter",
href: "https://twitter.com",
},
label: "Twitter", href: "https://twitter.com"},
{
label: "LinkedIn",
href: "https://linkedin.com",
},
label: "LinkedIn", href: "https://linkedin.com"},
{
label: "Instagram",
href: "https://instagram.com",
},
label: "Instagram", href: "https://instagram.com"},
{
label: "GitHub",
href: "https://github.com",
},
label: "GitHub", href: "https://github.com"},
],
},
]}