Update src/pages/HomePage.tsx
This commit is contained in:
@@ -4,243 +4,111 @@ import FaqTabbedAccordion from '@/components/sections/faq/FaqTabbedAccordion';
|
||||
import FeaturesDetailedCards from '@/components/sections/features/FeaturesDetailedCards';
|
||||
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
|
||||
import HeroBrand from '@/components/sections/hero/HeroBrand';
|
||||
import TestimonialRatingCardsOriginal from '@/components/sections/testimonial/TestimonialRatingCards';
|
||||
|
||||
type OriginalProps = Parameters<typeof TestimonialRatingCardsOriginal>[0];
|
||||
type OriginalTestimonial = NonNullable<OriginalProps['testimonials']>[0];
|
||||
|
||||
const TestimonialRatingCards = (
|
||||
props: Omit<OriginalProps, 'testimonials'> & {
|
||||
testimonials: (OriginalTestimonial & { id?: string | number })[]
|
||||
}
|
||||
) => <TestimonialRatingCardsOriginal {...(props as unknown as OriginalProps)} />;
|
||||
import TestimonialRatingCards from '@/components/sections/testimonial/TestimonialRatingCards';
|
||||
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">
|
||||
<HeroBrand
|
||||
brand="Mayl Cafe"
|
||||
description="Crafting artisanal moments through premium specialty coffee, sourced with integrity and brewed with passion."
|
||||
primaryButton={{
|
||||
text: "Discover Menu",
|
||||
href: "#menu",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Our Locations",
|
||||
href: "#contact",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cocktail-wooden-table-restaurant_23-2147936121.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
brand="Mayl Cafe"
|
||||
description="Crafting artisanal moments through premium specialty coffee, sourced with integrity and brewed with passion."
|
||||
primaryButton={{
|
||||
text: "Discover Menu", href: "#menu"}}
|
||||
secondaryButton={{
|
||||
text: "Our Locations", href: "#contact"}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cocktail-wooden-table-restaurant_23-2147936121.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutText
|
||||
title="The Art of Specialty Coffee"
|
||||
primaryButton={{
|
||||
text: "Read Our Story",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
title="The Art of Specialty Coffee"
|
||||
primaryButton={{
|
||||
text: "Read Our Story", href: "#"}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="menu" data-section="menu">
|
||||
<SectionErrorBoundary name="menu">
|
||||
<div id="menu" data-section="menu">
|
||||
<SectionErrorBoundary name="menu">
|
||||
<FeaturesImageBento
|
||||
tag="Our Menu"
|
||||
title="Artisanal Selection"
|
||||
description="A curated experience of flavors, textures, and craft."
|
||||
items={[
|
||||
{
|
||||
title: "Signature Latte",
|
||||
description: "Expertly steamed milk and rich espresso.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/aroma-background-love-house-taste_1232-3951.jpg",
|
||||
},
|
||||
{
|
||||
title: "Fresh Infusions",
|
||||
description: "Naturally healthy fruit-based refreshments.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-friends-with-sangria_23-2149426455.jpg",
|
||||
},
|
||||
{
|
||||
title: "Manual Brew",
|
||||
description: "Precision-poured specialty coffee beans.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/midsection-barista-making-coffee_1157-26588.jpg",
|
||||
},
|
||||
{
|
||||
title: "Fresh Pastries",
|
||||
description: "Daily baked goods to pair with your brew.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/drawings-near-pastry-hot-chocolate_23-2147817007.jpg",
|
||||
},
|
||||
{
|
||||
title: "Cold Brew",
|
||||
description: "12-hour steeped for maximum smoothness.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glass-coffee-drink-with-ice-garnished-with-toasted-marshmallow_140725-6028.jpg",
|
||||
},
|
||||
{
|
||||
title: "Matcha Ritual",
|
||||
description: "Ceremonial grade matcha whisked to perfection.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/green-tea-matcha-latte-white-cup_74190-7640.jpg",
|
||||
},
|
||||
{
|
||||
title: "Double Espresso",
|
||||
description: "Bold notes and intense aromatic character.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-aromatic-coffee-plate_23-2148349623.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Our Menu"
|
||||
title="Artisanal Selection"
|
||||
description="A curated experience of flavors, textures, and craft."
|
||||
items={[
|
||||
{ title: "Signature Latte", description: "Expertly steamed milk and rich espresso.", imageSrc: "http://img.b2bpic.net/free-photo/aroma-background-love-house-taste_1232-3951.jpg" },
|
||||
{ title: "Fresh Infusions", description: "Naturally healthy fruit-based refreshments.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-friends-with-sangria_23-2149426455.jpg" },
|
||||
{ title: "Manual Brew", description: "Precision-poured specialty coffee beans.", imageSrc: "http://img.b2bpic.net/free-photo/midsection-barista-making-coffee_1157-26588.jpg" },
|
||||
{ title: "Fresh Pastries", description: "Daily baked goods to pair with your brew.", imageSrc: "http://img.b2bpic.net/free-photo/drawings-near-pastry-hot-chocolate_23-2147817007.jpg" },
|
||||
{ title: "Cold Brew", description: "12-hour steeped for maximum smoothness.", imageSrc: "http://img.b2bpic.net/free-photo/glass-coffee-drink-with-ice-garnished-with-toasted-marshmallow_140725-6028.jpg" },
|
||||
{ title: "Matcha Ritual", description: "Ceremonial grade matcha whisked to perfection.", imageSrc: "http://img.b2bpic.net/free-photo/green-tea-matcha-latte-white-cup_74190-7640.jpg" },
|
||||
{ title: "Double Espresso", description: "Bold notes and intense aromatic character.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-aromatic-coffee-plate_23-2148349623.jpg" }
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="drinks" data-section="drinks">
|
||||
<SectionErrorBoundary name="drinks">
|
||||
<div id="drinks" data-section="drinks">
|
||||
<SectionErrorBoundary name="drinks">
|
||||
<FeaturesDetailedCards
|
||||
tag="Wellness"
|
||||
title="Healthy & Natural"
|
||||
description="Refreshing beverages designed for a balanced lifestyle."
|
||||
items={[
|
||||
{
|
||||
title: "Green Cleanse",
|
||||
description: "Cold-pressed juices with leafy greens.",
|
||||
tags: [
|
||||
"Natural",
|
||||
"Healthy",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/delicious-kombucha-bottles-peach_23-2149757687.jpg",
|
||||
},
|
||||
{
|
||||
title: "Hibiscus Chill",
|
||||
description: "Refreshing floral tea infusion.",
|
||||
tags: [
|
||||
"Refreshing",
|
||||
"Caffeine-free",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-coffee-machine-with-loads-cups_23-2148523034.jpg",
|
||||
},
|
||||
{
|
||||
title: "Almond Refresher",
|
||||
description: "House-made nut milk based elixir.",
|
||||
tags: [
|
||||
"Organic",
|
||||
"Nut-based",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-drinking-matcha-tea_23-2150163392.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Wellness"
|
||||
title="Healthy & Natural"
|
||||
description="Refreshing beverages designed for a balanced lifestyle."
|
||||
items={[
|
||||
{ title: "Green Cleanse", description: "Cold-pressed juices with leafy greens.", tags: ["Natural", "Healthy"], imageSrc: "http://img.b2bpic.net/free-photo/delicious-kombucha-bottles-peach_23-2149757687.jpg" },
|
||||
{ title: "Hibiscus Chill", description: "Refreshing floral tea infusion.", tags: ["Refreshing", "Caffeine-free"], imageSrc: "http://img.b2bpic.net/free-photo/front-view-coffee-machine-with-loads-cups_23-2148523034.jpg" },
|
||||
{ title: "Almond Refresher", description: "House-made nut milk based elixir.", tags: ["Organic", "Nut-based"], imageSrc: "http://img.b2bpic.net/free-photo/man-drinking-matcha-tea_23-2150163392.jpg" }
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialRatingCards
|
||||
tag="Reviews"
|
||||
title="Loved by the Community"
|
||||
description="Hear what our regulars have to say about their experience at Mayl Cafe."
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Ahmed",
|
||||
role: "Coffee Enthusiast",
|
||||
quote: "The most balanced flat white in the city. Truly artisanal.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-friends-having-laugh_23-2148395406.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Khalid Al-Omar",
|
||||
role: "Regular Visitor",
|
||||
quote: "Mayl Cafe's attention to detail in their manual brews is unmatched.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-asian-woman-with-tablet-standing-front-cafe-entrance-inviting-guests-customers_1258-199014.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Layla Nour",
|
||||
role: "Designer",
|
||||
quote: "My favorite creative space. The aesthetic and the coffee are perfect.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-making-coffee_23-2150354579.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Omar Fakhri",
|
||||
role: "Food Critic",
|
||||
quote: "A masterclass in specialty coffee sourcing.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-holding-tablet_23-2148968938.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Hana Sami",
|
||||
role: "Wellness Blogger",
|
||||
quote: "Their healthy infusions are exactly what I need on a busy afternoon.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-barista-black-apron-holding-coffee-cup-standing-yellow-background_1258-170856.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Reviews"
|
||||
title="Loved by the Community"
|
||||
description="Hear what our regulars have to say about their experience at Mayl Cafe."
|
||||
testimonials={[
|
||||
{ name: "Sarah Ahmed", role: "Coffee Enthusiast", quote: "The most balanced flat white in the city. Truly artisanal.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/low-angle-friends-having-laugh_23-2148395406.jpg" },
|
||||
{ name: "Khalid Al-Omar", role: "Regular Visitor", quote: "Mayl Cafe's attention to detail in their manual brews is unmatched.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-asian-woman-with-tablet-standing-front-cafe-entrance-inviting-guests-customers_1258-199014.jpg" },
|
||||
{ name: "Layla Nour", role: "Designer", quote: "My favorite creative space. The aesthetic and the coffee are perfect.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-making-coffee_23-2150354579.jpg" },
|
||||
{ name: "Omar Fakhri", role: "Food Critic", quote: "A masterclass in specialty coffee sourcing.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-holding-tablet_23-2148968938.jpg" },
|
||||
{ name: "Hana Sami", role: "Wellness Blogger", quote: "Their healthy infusions are exactly what I need on a busy afternoon.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-barista-black-apron-holding-coffee-cup-standing-yellow-background_1258-170856.jpg" }
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqTabbedAccordion
|
||||
tag="Support"
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about our cafe."
|
||||
categories={[
|
||||
{
|
||||
name: "General",
|
||||
items: [
|
||||
{
|
||||
question: "Are you open on weekends?",
|
||||
answer: "Yes, we are open 7 days a week from 7 AM to 12 AM.",
|
||||
},
|
||||
{
|
||||
question: "Do you offer delivery?",
|
||||
answer: "Yes, through our delivery app partners.",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: "Coffee",
|
||||
items: [
|
||||
{
|
||||
question: "Where are your beans sourced?",
|
||||
answer: "We work directly with farms to ensure ethical, high-quality sourcing.",
|
||||
},
|
||||
{
|
||||
question: "Can I buy beans at home?",
|
||||
answer: "Yes, check our retail section for fresh roasted bags.",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Support"
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about our cafe."
|
||||
categories={[
|
||||
{ name: "General", items: [{ question: "Are you open on weekends?", answer: "Yes, we are open 7 days a week from 7 AM to 12 AM." }, { question: "Do you offer delivery?", answer: "Yes, through our delivery app partners." }] },
|
||||
{ name: "Coffee", items: [{ question: "Where are your beans sourced?", answer: "We work directly with farms to ensure ethical, high-quality sourcing." }, { question: "Can I buy beans at home?", answer: "Yes, check our retail section for fresh roasted bags." }] }
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Visit Us"
|
||||
text="Visit us at our flagship cafe for an authentic specialty coffee experience."
|
||||
primaryButton={{
|
||||
text: "WhatsApp Us",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View on Maps",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Visit Us"
|
||||
text="Visit us at our flagship cafe for an authentic specialty coffee experience."
|
||||
primaryButton={{ text: "WhatsApp Us", href: "#" }}
|
||||
secondaryButton={{ text: "View on Maps", href: "#" }}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user