Update src/pages/HomePage.tsx

This commit is contained in:
2026-06-14 14:34:10 +00:00
parent d6011f12c5
commit cc2cfeeb36

View File

@@ -13,323 +13,158 @@ import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function HomePage() {
return (
<>
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<HeroBillboardTiltedCarousel
tag="Visit Meru's Prime Hub"
title="Welcome to Meru Greenwood Park"
description="The ultimate destination for shopping, dining, and community gathering in the heart of Meru."
primaryButton={{
text: "Get Directions",
href: "#contact",
}}
secondaryButton={{
text: "Explore Shops",
href: "#products",
}}
items={[
{
imageSrc: "http://img.b2bpic.net/free-photo/asian-women-looking-something-phone_23-2149122959.jpg?_wi=1",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/people-walking-shopping-mall_1160-771.jpg?_wi=1",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/laughing-women-shopping_23-2147688258.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/three-elegant-women-with-shopping-bags-city_1157-38849.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/empty-floor-with-modern-business-office-building_1127-3065.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/window-shopping-with-best-friend_329181-7988.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
tag="Visit Meru's Prime Hub"
title="Welcome to Meru Greenwood Park"
description="The ultimate destination for shopping, dining, and community gathering in the heart of Meru."
primaryButton={{ text: "Get Directions", href: "#contact" }}
secondaryButton={{ text: "Explore Shops", href: "#products" }}
items={[
{ imageSrc: "http://img.b2bpic.net/free-photo/asian-women-looking-something-phone_23-2149122959.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/people-walking-shopping-mall_1160-771.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/laughing-women-shopping_23-2147688258.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/three-elegant-women-with-shopping-bags-city_1157-38849.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-floor-with-modern-business-office-building_1127-3065.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/window-shopping-with-best-friend_329181-7988.jpg" },
]}
/>
</SectionErrorBoundary>
</div>
<div id="about" data-section="about">
<SectionErrorBoundary name="about">
<div id="about" data-section="about">
<SectionErrorBoundary name="about">
<AboutMediaOverlay
tag="About Us"
title="A Community Landmark"
description="Meru Greenwood Park is a premier retail destination serving the vibrant community of Meru with a curated mix of shops, cafes, and services."
primaryButton={{
text: "Learn More",
href: "#",
}}
imageSrc="http://img.b2bpic.net/free-photo/pretty-girl-shopping-center_23-2147669894.jpg"
/>
</SectionErrorBoundary>
</div>
tag="About Us"
title="A Community Landmark"
description="Meru Greenwood Park is a premier retail destination serving the vibrant community of Meru with a curated mix of shops, cafes, and services."
primaryButton={{ text: "Learn More", href: "#" }}
imageSrc="http://img.b2bpic.net/free-photo/pretty-girl-shopping-center_23-2147669894.jpg"
/>
</SectionErrorBoundary>
</div>
<div id="features" data-section="features">
<SectionErrorBoundary name="features">
<div id="features" data-section="features">
<SectionErrorBoundary name="features">
<FeaturesBento
tag="Convenience First"
title="Designed for Your Needs"
description="Enjoy a hassle-free experience with modern amenities and diverse services at your fingertips."
features={[
{
title: "Secure Payments",
description: "Support for KCB, M-Pesa, Visa, and Mastercard.",
bentoComponent: "info-card-marquee",
infoCards: [
{
icon: CreditCard,
label: "Visa",
value: "Accepted",
},
{
icon: Smartphone,
label: "M-Pesa",
value: "Enabled",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/blurred-escalator-mall-view-from_1203-1298.jpg",
imageAlt: "shopping cart retail icon",
},
{
title: "Spacious Layout",
description: "Easy navigation throughout the mall.",
bentoComponent: "media-stack",
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-full-side-color-business-card_23-2151022832.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/african-american-customer-putting-credit-card-pos-terminal-paying-fashionable-clothes-counter-desk-modern-boutique-woman-shopper-buying-trendy-merchandise-clothing-store_482257-72466.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/confident-asian-helpline-customer-support-operator-wearing-headset-voicecall-with-client-talking-about-project-financial-risks-call-centre-telemarketer-wearing-headset-call-with-potential-buyer_482257-40174.jpg",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/asian-women-looking-something-phone_23-2149122959.jpg?_wi=2",
imageAlt: "shopping cart retail icon",
},
{
title: "Customer Support",
description: "We are here to assist you.",
bentoComponent: "checklist-timeline",
heading: "Our Services",
subheading: "Excellence in comfort",
checklistItems: [
{
label: "Concierge",
detail: "Available daily",
},
{
label: "Parking",
detail: "Secured spaces",
},
{
label: "WiFi",
detail: "High speed",
},
],
completedLabel: "Ready",
imageSrc: "http://img.b2bpic.net/free-photo/people-walking-shopping-mall_1160-771.jpg?_wi=2",
imageAlt: "shopping cart retail icon",
},
]}
/>
</SectionErrorBoundary>
</div>
tag="Convenience First"
title="Designed for Your Needs"
description="Enjoy a hassle-free experience with modern amenities and diverse services at your fingertips."
features={[
{
title: "Secure Payments", description: "Support for KCB, M-Pesa, Visa, and Mastercard.", bentoComponent: "info-card-marquee", infoCards: [
{ icon: "CreditCard", label: "Visa", value: "Accepted" },
{ icon: "Smartphone", label: "M-Pesa", value: "Enabled" },
],
},
{
title: "Spacious Layout", description: "Easy navigation throughout the mall.", bentoComponent: "media-stack", mediaItems: [
{ imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-full-side-color-business-card_23-2151022832.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/african-american-customer-putting-credit-card-pos-terminal-paying-fashionable-clothes-counter-desk-modern-boutique-woman-shopper-buying-trendy-merchandise-clothing-store_482257-72466.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/confident-asian-helpline-customer-support-operator-wearing-headset-voicecall-with-client-talking-about-project-financial-risks-call-centre-telemarketer-wearing-headset-call-with-potential-buyer_482257-40174.jpg" },
],
},
{
title: "Customer Support", description: "We are here to assist you.", bentoComponent: "checklist-timeline", heading: "Our Services", subheading: "Excellence in comfort", checklistItems: [
{ label: "Concierge", detail: "Available daily" },
{ label: "Parking", detail: "Secured spaces" },
{ label: "WiFi", detail: "High speed" },
],
completedLabel: "Ready"},
]}
/>
</SectionErrorBoundary>
</div>
<div id="products" data-section="products">
<SectionErrorBoundary name="products">
<div id="products" data-section="products">
<SectionErrorBoundary name="products">
<FeaturesRevealCardsBento
tag="Stores & Dining"
title="Everything Under One Roof"
description="Explore a wide variety of local and international brands tailored to your lifestyle."
items={[
{
title: "Fashion Boutiques",
description: "Latest trends for every season.",
href: "#",
imageSrc: "http://img.b2bpic.net/free-photo/blurred-background-store-shopping-mall-blur-background-with-bokeh-vintage-filtered-image_1253-1654.jpg",
},
{
title: "Casual Dining",
description: "Fresh meals and great coffee.",
href: "#",
imageSrc: "http://img.b2bpic.net/free-photo/friends-coffee-shop-with-orange-bag_23-2147705110.jpg",
},
{
title: "Supermarket",
description: "Daily essentials at great prices.",
href: "#",
imageSrc: "http://img.b2bpic.net/free-photo/woman-buying-vegetables-supermarket_342744-1106.jpg",
},
{
title: "Tech Hub",
description: "Your go-to spot for gadgets.",
href: "#",
imageSrc: "http://img.b2bpic.net/free-photo/defocused-airport-shop_1203-238.jpg",
},
{
title: "Beauty & Salon",
description: "Pamper yourself today.",
href: "#",
imageSrc: "http://img.b2bpic.net/free-photo/walking-professional-asian-city-women_1303-2309.jpg",
},
{
title: "Kids Zone",
description: "Fun for the whole family.",
href: "#",
imageSrc: "http://img.b2bpic.net/free-photo/girl-with-father-xmas_1098-14951.jpg",
},
{
title: "Local Artisans",
description: "Handcrafted products with care.",
href: "#",
imageSrc: "http://img.b2bpic.net/free-photo/silhouette-person-city_23-2149211282.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
tag="Stores & Dining"
title="Everything Under One Roof"
description="Explore a wide variety of local and international brands tailored to your lifestyle."
items={[
{ title: "Fashion Boutiques", description: "Latest trends for every season.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/blurred-background-store-shopping-mall-blur-background-with-bokeh-vintage-filtered-image_1253-1654.jpg" },
{ title: "Casual Dining", description: "Fresh meals and great coffee.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/friends-coffee-shop-with-orange-bag_23-2147705110.jpg" },
{ title: "Supermarket", description: "Daily essentials at great prices.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/woman-buying-vegetables-supermarket_342744-1106.jpg" },
{ title: "Tech Hub", description: "Your go-to spot for gadgets.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/defocused-airport-shop_1203-238.jpg" },
{ title: "Beauty & Salon", description: "Pamper yourself today.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/walking-professional-asian-city-women_1303-2309.jpg" },
{ title: "Kids Zone", description: "Fun for the whole family.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/girl-with-father-xmas_1098-14951.jpg" },
{ title: "Local Artisans", description: "Handcrafted products with care.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/silhouette-person-city_23-2149211282.jpg" },
]}
/>
</SectionErrorBoundary>
</div>
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsMediaCards
tag="Our Growth"
title="Serving the Community Daily"
description="We take pride in being a central part of Meru's commercial landscape."
metrics={[
{
value: "100+",
title: "Retail Units",
description: "Diverse businesses to explore.",
imageSrc: "http://img.b2bpic.net/free-vector/flat-infographic-element-collection_23-2148044163.jpg",
},
{
value: "4.4",
title: "Rating",
description: "Trusted by our visitors.",
imageSrc: "http://img.b2bpic.net/free-photo/excited-models-clothing-shop_23-2147669927.jpg",
},
{
value: "24/7",
title: "Support",
description: "We value your inquiries.",
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-female-friends-sitting-together-using-tablet-discussing-clothes-purchases-fashion-store-copy-space-consumerism-shopping-concept_74855-11590.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
tag="Our Growth"
title="Serving the Community Daily"
description="We take pride in being a central part of Meru's commercial landscape."
metrics={[
{ value: "100+", title: "Retail Units", description: "Diverse businesses to explore.", imageSrc: "http://img.b2bpic.net/free-vector/flat-infographic-element-collection_23-2148044163.jpg" },
{ value: "4.4", title: "Rating", description: "Trusted by our visitors.", imageSrc: "http://img.b2bpic.net/free-photo/excited-models-clothing-shop_23-2147669927.jpg" },
{ value: "24/7", title: "Support", description: "We value your inquiries.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-female-friends-sitting-together-using-tablet-discussing-clothes-purchases-fashion-store-copy-space-consumerism-shopping-concept_74855-11590.jpg" },
]}
/>
</SectionErrorBoundary>
</div>
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<TestimonialOverlayCards
tag="Community Voices"
title="What Our Shoppers Say"
description="Join our community of happy shoppers who make us their first choice."
testimonials={[
{
name: "Sarah Mutua",
role: "Resident",
company: "Meru",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/attractive-lady-with-shopping-bags-mall_23-2147950204.jpg",
},
{
name: "John Gitau",
role: "Entrepreneur",
company: "Meru Business",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/two-happy-shopaholics-having-great-time-shopping-mall_1262-13056.jpg",
},
{
name: "Anne Wanjiku",
role: "Visitor",
company: "Family",
rating: 4,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-teenage-girl-posing_23-2148672410.jpg",
},
{
name: "Brian Otieno",
role: "Student",
company: "Education",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/friends-shopping-second-hand-market_23-2149353755.jpg",
},
{
name: "Joyce Kendi",
role: "Local",
company: "Meru Central",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-excited-caucasian-guy-love-with-his-black-girlfriend_1262-20219.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
tag="Community Voices"
title="What Our Shoppers Say"
description="Join our community of happy shoppers who make us their first choice."
testimonials={[
{ name: "Sarah Mutua", role: "Resident", company: "Meru", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/attractive-lady-with-shopping-bags-mall_23-2147950204.jpg" },
{ name: "John Gitau", role: "Entrepreneur", company: "Meru Business", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/two-happy-shopaholics-having-great-time-shopping-mall_1262-13056.jpg" },
{ name: "Anne Wanjiku", role: "Visitor", company: "Family", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-teenage-girl-posing_23-2148672410.jpg" },
{ name: "Brian Otieno", role: "Student", company: "Education", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/friends-shopping-second-hand-market_23-2149353755.jpg" },
{ name: "Joyce Kendi", role: "Local", company: "Meru Central", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-excited-caucasian-guy-love-with-his-black-girlfriend_1262-20219.jpg" },
]}
/>
</SectionErrorBoundary>
</div>
<div id="social-proof" data-section="social-proof">
<SectionErrorBoundary name="social-proof">
<div id="social-proof" data-section="social-proof">
<SectionErrorBoundary name="social-proof">
<SocialProofMarquee
tag="Trusted Partners"
title="Our Network"
description="Proudly working with leading brands."
names={[
"KCB Bank",
"Visa",
"Mastercard",
"M-Pesa",
"Meru Retail Hub",
"Café Greenwood",
"Fashion Corner",
]}
/>
</SectionErrorBoundary>
</div>
tag="Trusted Partners"
title="Our Network"
description="Proudly working with leading brands."
names={["KCB Bank", "Visa", "Mastercard", "M-Pesa", "Meru Retail Hub", "Café Greenwood", "Fashion Corner"]}
/>
</SectionErrorBoundary>
</div>
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqSplitMedia
tag="FAQ"
title="Answers to Your Questions"
description="Everything you need to know about your next visit."
items={[
{
question: "Are you open on weekends?",
answer: "Yes, we are open seven days a week.",
},
{
question: "What payment methods do you accept?",
answer: "We support M-Pesa, KCB, Visa, and Mastercard at most stores.",
},
{
question: "Where is the mall located?",
answer: "We are centrally located in Meru, easily accessible by public transit.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/glass-structure_1127-2132.jpg"
/>
</SectionErrorBoundary>
</div>
tag="FAQ"
title="Answers to Your Questions"
description="Everything you need to know about your next visit."
items={[
{ question: "Are you open on weekends?", answer: "Yes, we are open seven days a week." },
{ question: "What payment methods do you accept?", answer: "We support M-Pesa, KCB, Visa, and Mastercard at most stores." },
{ question: "Where is the mall located?", answer: "We are centrally located in Meru, easily accessible by public transit." },
]}
imageSrc="http://img.b2bpic.net/free-photo/glass-structure_1127-2132.jpg"
/>
</SectionErrorBoundary>
</div>
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<ContactCta
tag="Connect With Us"
text="Need assistance or have a business inquiry? Contact us today."
primaryButton={{
text: "Call +254 724 776945",
href: "tel:+254724776945",
}}
secondaryButton={{
text: "WhatsApp Support",
href: "https://wa.me/254724776945",
}}
/>
</SectionErrorBoundary>
</div>
tag="Connect With Us"
text="Need assistance or have a business inquiry? Contact us today."
primaryButton={{ text: "Call +254 724 776945", href: "tel:+254724776945" }}
secondaryButton={{ text: "WhatsApp Support", href: "https://wa.me/254724776945" }}
/>
</SectionErrorBoundary>
</div>
</>
);
}