16 Commits

Author SHA1 Message Date
4c41b8b070 Merge version_3 into main
Merge version_3 into main
2026-06-10 05:03:34 +00:00
684c8478c8 Update src/app/properties/page.tsx 2026-06-10 05:03:31 +00:00
8852f9970f Update src/app/page.tsx 2026-06-10 05:03:31 +00:00
0b395633e3 Update src/app/booking/page.tsx 2026-06-10 05:03:30 +00:00
467ed31013 Merge version_2 into main
Merge version_2 into main
2026-06-10 05:02:15 +00:00
e9557ade89 Update src/app/properties/page.tsx 2026-06-10 05:02:12 +00:00
883407cccd Update src/app/page.tsx 2026-06-10 05:02:12 +00:00
e9e989d768 Update src/app/booking/page.tsx 2026-06-10 05:02:11 +00:00
39b82279b1 Merge version_2 into main
Merge version_2 into main
2026-06-10 05:01:51 +00:00
8fb5275e97 Update src/app/properties/page.tsx 2026-06-10 05:01:47 +00:00
2fc5f0955c Update src/app/page.tsx 2026-06-10 05:01:47 +00:00
1de3d37b3e Update src/app/booking/page.tsx 2026-06-10 05:01:47 +00:00
ddcba6e620 Merge version_2 into main
Merge version_2 into main
2026-06-10 05:00:59 +00:00
c56f0d95f0 Add src/app/properties/page.tsx 2026-06-10 05:00:56 +00:00
667e39eb98 Update src/app/page.tsx 2026-06-10 05:00:55 +00:00
f37ef9d32b Add src/app/booking/page.tsx 2026-06-10 05:00:55 +00:00
3 changed files with 305 additions and 200 deletions

75
src/app/booking/page.tsx Normal file
View File

@@ -0,0 +1,75 @@
"use client";
import ReactLenis from "lenis/react";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Facebook, Linkedin } from "lucide-react";
export default function BookingPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="solid"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/#about" },
{ name: "Services", id: "/#services" },
{ name: "Destinations", id: "/#destinations" },
{ name: "Properties", id: "/properties" },
{ name: "Reviews", id: "/#reviews" },
{ name: "Contact", id: "/#contact" },
{ name: "Booking", id: "/booking" }
]}
brandName="Luxuria"
button={{ text: "Plan Your Trip", href: "/booking" }}
/>
<div className="min-h-screen py-32 lg:py-40">
<ContactSplitForm
title="Book Your Exclusive Stay"
description="Fill out the form below, and our team will craft your perfect reservation."
useInvertedBackground={false}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero1.webp?_wi=2"
imageAlt="Luxury travel booking"
mediaPosition="left"
mediaAnimation="slide-up"
buttonText="Submit Reservation"
inputs={[
{ name: "fullName", type: "text", placeholder: "Full Name", required: true },
{ name: "email", type: "email", placeholder: "Email Address", required: true },
{ name: "phone", type: "tel", placeholder: "Phone Number" },
{ name: "propertyId", type: "text", placeholder: "Desired Property (Optional)" },
{ name: "checkInDate", type: "date", placeholder: "Check-in Date" },
{ name: "checkOutDate", type: "date", placeholder: "Check-out Date" },
{ name: "numGuests", type: "number", placeholder: "Number of Guests" },
]}
textarea={{
name: "specialRequests", placeholder: "Any special requests or preferences?", rows: 4,
}}
/>
</div>
<FooterCard
logoText="Luxuria"
copyrightText="© 2025 Luxuria Travel | Luxury Journeys Worldwide"
socialLinks={[
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
{ icon: Facebook, href: "#", ariaLabel: "Facebook" },
{ icon: Linkedin, href: "#", ariaLabel: "LinkedIn" },
]}
/>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -30,14 +30,17 @@ export default function LuxuryTravelAgencyTemplatePage() {
<ReactLenis root> <ReactLenis root>
<NavbarLayoutFloatingInline <NavbarLayoutFloatingInline
navItems={[ navItems={[
{ name: "About", id: "about" }, { name: "Home", id: "/" },
{ name: "Services", id: "services" }, { name: "About", id: "/#about" },
{ name: "Destinations", id: "destinations" }, { name: "Services", id: "/#services" },
{ name: "Reviews", id: "reviews" }, { name: "Destinations", id: "/#destinations" },
{ name: "Contact", id: "contact" }, { name: "Properties", id: "/properties" },
{ name: "Reviews", id: "/#reviews" },
{ name: "Contact", id: "/#contact" },
{ name: "Booking", id: "/booking" }
]} ]}
brandName="Luxuria" brandName="Luxuria"
button={{ text: "Plan Your Trip", href: "#contact" }} button={{ text: "Plan Your Trip", href: "/booking" }}
/> />
<HeroCarouselLogo <HeroCarouselLogo
logoText="Luxuria" logoText="Luxuria"
@@ -47,13 +50,14 @@ export default function LuxuryTravelAgencyTemplatePage() {
{ text: "Explore Destinations", href: "#destinations" }, { text: "Explore Destinations", href: "#destinations" },
]} ]}
slides={[ slides={[
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero1.webp", imageAlt: "Luxury resort" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero1.webp?_wi=1", imageAlt: "Luxury resort" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero2.webp", imageAlt: "Private yacht" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero2.webp", imageAlt: "Private yacht" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero3.jpg", imageAlt: "Private yacht" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero3.jpg", imageAlt: "Private yacht" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero4.jpg", imageAlt: "Private yacht" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/hero/hero4.jpg", imageAlt: "Private yacht" },
]} ]}
showDimOverlay={true} showDimOverlay={true}
/> />
<div id="about" data-section="about">
<InlineImageSplitTextAbout <InlineImageSplitTextAbout
className="pt-40" className="pt-40"
heading={[ heading={[
@@ -68,6 +72,8 @@ export default function LuxuryTravelAgencyTemplatePage() {
]} ]}
useInvertedBackground={false} useInvertedBackground={false}
/> />
</div>
<div id="services" data-section="services">
<FeatureCardOne <FeatureCardOne
tag="Services" tag="Services"
tagIcon={Sparkles} tagIcon={Sparkles}
@@ -80,37 +86,18 @@ export default function LuxuryTravelAgencyTemplatePage() {
useInvertedBackground={false} useInvertedBackground={false}
features={[ features={[
{ {
title: "Private Aviation", title: "Private Aviation", description: "Charter flights and private jet services to any destination worldwide.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service5.webp", imageAlt: "Private jet"},
description: "Charter flights and private jet services to any destination worldwide.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service5.webp",
imageAlt: "Private jet",
},
{ {
title: "Luxury Accommodations", title: "Luxury Accommodations", description: "Handpicked five-star hotels, villas, and exclusive resorts.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service1.webp", imageAlt: "Luxury hotel"},
description: "Handpicked five-star hotels, villas, and exclusive resorts.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service1.webp",
imageAlt: "Luxury hotel",
},
{ {
title: "Curated Experiences", title: "Curated Experiences", description: "Unique adventures and cultural immersions designed just for you.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service4.webp", imageAlt: "Experience"},
description: "Unique adventures and cultural immersions designed just for you.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service4.webp",
imageAlt: "Experience",
},
{ {
title: "Fine Dining", title: "Fine Dining", description: "Reservations at Michelin-starred restaurants and private chef services.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service3.webp", imageAlt: "Fine dining"},
description: "Reservations at Michelin-starred restaurants and private chef services.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service3.webp",
imageAlt: "Fine dining",
},
{ {
title: "Photography Tours", title: "Photography Tours", description: "Professional photographers to capture your once-in-a-lifetime moments.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service2.webp", imageAlt: "Photography"}
description: "Professional photographers to capture your once-in-a-lifetime moments.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/services/service2.webp",
imageAlt: "Photography",
}
]} ]}
/> />
</div>
<FeatureCardNine <FeatureCardNine
tag="How It Works" tag="How It Works"
tagIcon={Compass} tagIcon={Compass}
@@ -122,25 +109,20 @@ export default function LuxuryTravelAgencyTemplatePage() {
useInvertedBackground={false} useInvertedBackground={false}
features={[ features={[
{ {
title: "Share Your Vision", title: "Share Your Vision", description: "Tell us about your dream destination and travel preferences.", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone5.webp", imageAlt: "Consultation" },
description: "Tell us about your dream destination and travel preferences.",
phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone5.webp", imageAlt: "Consultation" },
phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone6.webp", imageAlt: "Planning" }, phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone6.webp", imageAlt: "Planning" },
}, },
{ {
title: "Custom Itinerary", title: "Custom Itinerary", description: "Receive a bespoke travel plan crafted by our expert advisors.", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone3.webp", imageAlt: "Itinerary" },
description: "Receive a bespoke travel plan crafted by our expert advisors.",
phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone3.webp", imageAlt: "Itinerary" },
phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone4.webp", imageAlt: "Details" }, phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone4.webp", imageAlt: "Details" },
}, },
{ {
title: "Seamless Experience", title: "Seamless Experience", description: "Enjoy your journey while we handle every detail behind the scenes.", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone1.webp", imageAlt: "Travel" },
description: "Enjoy your journey while we handle every detail behind the scenes.",
phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone1.webp", imageAlt: "Travel" },
phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone2.webp", imageAlt: "Experience" }, phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/phone/phone2.webp", imageAlt: "Experience" },
}, },
]} ]}
/> />
<div id="destinations" data-section="destinations">
<FeatureCardMedia <FeatureCardMedia
tag="Destinations" tag="Destinations"
tagIcon={Plane} tagIcon={Plane}
@@ -151,55 +133,21 @@ export default function LuxuryTravelAgencyTemplatePage() {
useInvertedBackground={false} useInvertedBackground={false}
features={[ features={[
{ {
id: "1", id: "1", title: "Maldives Private Island", description: "Exclusive overwater villas with direct lagoon access and private butler service.", tag: "Asia", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination6.webp?_wi=1", imageAlt: "Maldives"},
title: "Maldives Private Island",
description: "Exclusive overwater villas with direct lagoon access and private butler service.",
tag: "Asia",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination6.webp",
imageAlt: "Maldives",
},
{ {
id: "2", id: "2", title: "Swiss Alpine Retreat", description: "Secluded mountain chalets with panoramic views and world-class skiing.", tag: "Europe", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination5.webp?_wi=1", imageAlt: "Switzerland"},
title: "Swiss Alpine Retreat",
description: "Secluded mountain chalets with panoramic views and world-class skiing.",
tag: "Europe",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination5.webp",
imageAlt: "Switzerland",
},
{ {
id: "3", id: "3", title: "African Safari Lodge", description: "Intimate wildlife encounters in the heart of the Serengeti.", tag: "Africa", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination1.webp?_wi=1", imageAlt: "Safari"},
title: "African Safari Lodge",
description: "Intimate wildlife encounters in the heart of the Serengeti.",
tag: "Africa",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination1.webp",
imageAlt: "Safari",
},
{ {
id: "4", id: "4", title: "Amalfi Coast Villa", description: "Clifftop estates with Mediterranean views and private beach access.", tag: "Europe", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination4.webp?_wi=1", imageAlt: "Amalfi Coast"},
title: "Amalfi Coast Villa",
description: "Clifftop estates with Mediterranean views and private beach access.",
tag: "Europe",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination4.webp",
imageAlt: "Amalfi Coast",
},
{ {
id: "5", id: "5", title: "Kyoto Ryokan", description: "Traditional Japanese inns with zen gardens and kaiseki dining.", tag: "Asia", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination3.webp?_wi=1", imageAlt: "Kyoto"},
title: "Kyoto Ryokan",
description: "Traditional Japanese inns with zen gardens and kaiseki dining.",
tag: "Asia",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination3.webp",
imageAlt: "Kyoto",
},
{ {
id: "6", id: "6", title: "Patagonia Eco Lodge", description: "Remote wilderness retreats surrounded by glaciers and pristine nature.", tag: "South America", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination2.webp?_wi=1", imageAlt: "Patagonia"},
title: "Patagonia Eco Lodge",
description: "Remote wilderness retreats surrounded by glaciers and pristine nature.",
tag: "South America",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination2.webp",
imageAlt: "Patagonia",
},
]} ]}
/> />
</div>
<div id="reviews" data-section="reviews">
<TestimonialCardFive <TestimonialCardFive
tag="Reviews" tag="Reviews"
tagIcon={Sparkles} tagIcon={Sparkles}
@@ -209,43 +157,15 @@ export default function LuxuryTravelAgencyTemplatePage() {
useInvertedBackground={false} useInvertedBackground={false}
testimonials={[ testimonials={[
{ {
id: "1", id: "1", name: "Victoria Sterling", date: "December 2024", title: "An absolutely flawless experience from start to finish", quote: "Luxuria transformed our anniversary trip into something truly magical. Every detail was perfect, from the private transfers to the surprise sunset dinner on the beach. Their team anticipated our every need.", tag: "Maldives", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial1.webp", avatarAlt: "Victoria Sterling", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial1.webp", imageAlt: "Maldives trip"},
name: "Victoria Sterling",
date: "December 2024",
title: "An absolutely flawless experience from start to finish",
quote: "Luxuria transformed our anniversary trip into something truly magical. Every detail was perfect, from the private transfers to the surprise sunset dinner on the beach. Their team anticipated our every need.",
tag: "Maldives",
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial1.webp",
avatarAlt: "Victoria Sterling",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial1.webp",
imageAlt: "Maldives trip",
},
{ {
id: "2", id: "2", name: "James & Elizabeth Moore", date: "November 2024", title: "Beyond our wildest expectations", quote: "Our safari honeymoon was nothing short of extraordinary. The lodges were spectacular, the wildlife encounters unforgettable, and the attention to detail was impeccable throughout our journey.", tag: "Tanzania", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial2.webp", avatarAlt: "James & Elizabeth Moore", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial2.webp", imageAlt: "Safari experience"},
name: "James & Elizabeth Moore",
date: "November 2024",
title: "Beyond our wildest expectations",
quote: "Our safari honeymoon was nothing short of extraordinary. The lodges were spectacular, the wildlife encounters unforgettable, and the attention to detail was impeccable throughout our journey.",
tag: "Tanzania",
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial2.webp",
avatarAlt: "James & Elizabeth Moore",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial2.webp",
imageAlt: "Safari experience",
},
{ {
id: "3", id: "3", name: "Roberta Chen", date: "October 2024", title: "The definition of luxury travel", quote: "From the private jet charter to the exclusive vineyard tours, Luxuria curated an experience that exceeded all my expectations. Their network of contacts opened doors I never knew existed.", tag: "France", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial3.webp", avatarAlt: "Roberta Chen", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial3.webp", imageAlt: "France trip"},
name: "Roberta Chen",
date: "October 2024",
title: "The definition of luxury travel",
quote: "From the private jet charter to the exclusive vineyard tours, Luxuria curated an experience that exceeded all my expectations. Their network of contacts opened doors I never knew existed.",
tag: "France",
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial3.webp",
avatarAlt: "Roberta Chen",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial3.webp",
imageAlt: "France trip",
},
]} ]}
/> />
</div>
<div id="contact" data-section="contact">
<ContactSplitForm <ContactSplitForm
title="Plan Your Journey" title="Plan Your Journey"
description="Let us create your perfect luxury travel experience" description="Let us create your perfect luxury travel experience"
@@ -262,11 +182,10 @@ export default function LuxuryTravelAgencyTemplatePage() {
{ name: "destination", type: "text", placeholder: "Dream Destination" }, { name: "destination", type: "text", placeholder: "Dream Destination" },
]} ]}
textarea={{ textarea={{
name: "message", name: "message", placeholder: "Tell us about your ideal travel experience...", rows: 4,
placeholder: "Tell us about your ideal travel experience...",
rows: 4,
}} }}
/> />
</div>
<FooterCard <FooterCard
logoText="Luxuria" logoText="Luxuria"
copyrightText="© 2025 Luxuria Travel | Luxury Journeys Worldwide" copyrightText="© 2025 Luxuria Travel | Luxury Journeys Worldwide"

111
src/app/properties/page.tsx Normal file
View File

@@ -0,0 +1,111 @@
"use client";
import React, { useState } from "react";
import ReactLenis from "lenis/react";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ProductCatalog from "@/components/ecommerce/productCatalog/ProductCatalog";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Facebook, Linkedin } from "lucide-react";
const propertiesData = [
{
id: "1", category: "Villa", name: "Luxury Beachfront Villa", price: "$1,500/night", rating: 5,
reviewCount: "87 reviews", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination6.webp?_wi=2", imageAlt: "Beachfront Villa"},
{
id: "2", category: "Chalet", name: "Swiss Mountain Chalet", price: "$1,200/night", rating: 4,
reviewCount: "62 reviews", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination5.webp?_wi=2", imageAlt: "Mountain Chalet"},
{
id: "3", category: "Lodge", name: "Serengeti Safari Lodge", price: "$1,800/night", rating: 5,
reviewCount: "95 reviews", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination1.webp?_wi=2", imageAlt: "Safari Lodge"},
{
id: "4", category: "Estate", name: "Amalfi Coast Estate", price: "$2,000/night", rating: 5,
reviewCount: "78 reviews", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination4.webp?_wi=2", imageAlt: "Amalfi Estate"},
{
id: "5", category: "Ryokan", name: "Kyoto Traditional Ryokan", price: "$900/night", rating: 4,
reviewCount: "41 reviews", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination3.webp?_wi=2", imageAlt: "Kyoto Ryokan"},
{
id: "6", category: "Lodge", name: "Patagonia Wilderness Lodge", price: "$1,100/night", rating: 4,
reviewCount: "53 reviews", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/destination/destination2.webp?_wi=2", imageAlt: "Patagonia Lodge"},
];
export default function PropertiesPage() {
const [search, setSearch] = useState("");
const [locationFilter, setLocationFilter] = useState("All");
const [typeFilter, setTypeFilter] = useState("All");
const [priceFilter, setPriceFilter] = useState("All");
const filteredProperties = propertiesData.filter(property => {
const matchesSearch = property.name.toLowerCase().includes(search.toLowerCase());
const matchesLocation = locationFilter === "All" || property.imageAlt?.includes(locationFilter);
const matchesType = typeFilter === "All" || property.category === typeFilter;
const matchesPrice = priceFilter === "All" || (function() {
const price = parseFloat(property.price.replace(/[^0-9.-]+/g,""));
if (priceFilter === "$500-1000") return price >= 500 && price < 1000;
if (priceFilter === "$1000-1500") return price >= 1000 && price < 1500;
if (priceFilter === "$1500-2000") return price >= 1500 && price < 2000;
if (priceFilter === "2000+") return price >= 2000;
return true;
})();
return matchesSearch && matchesLocation && matchesType && matchesPrice;
});
const filters = [
{ label: "Location", options: ["All", "Maldives", "Switzerland", "Tanzania", "Amalfi Coast", "Kyoto", "Patagonia"], selected: locationFilter, onChange: setLocationFilter },
{ label: "Property Type", options: ["All", "Villa", "Chalet", "Lodge", "Estate", "Ryokan"], selected: typeFilter, onChange: setTypeFilter },
{ label: "Price Range", options: ["All", "$500-1000", "$1000-1500", "$1500-2000", "2000+"], selected: priceFilter, onChange: setPriceFilter },
];
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="solid"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/#about" },
{ name: "Services", id: "/#services" },
{ name: "Destinations", id: "/#destinations" },
{ name: "Properties", id: "/properties" },
{ name: "Reviews", id: "/#reviews" },
{ name: "Contact", id: "/#contact" },
{ name: "Booking", id: "/booking" }
]}
brandName="Luxuria"
button={{ text: "Plan Your Trip", href: "/booking" }}
/>
<div className="min-h-screen py-32 lg:py-40">
<ProductCatalog
layout="page"
products={filteredProperties}
searchValue={search}
onSearchChange={setSearch}
searchPlaceholder="Search properties..."
filters={filters}
emptyMessage="No properties match your criteria."
className="pt-12"
/>
</div>
<FooterCard
logoText="Luxuria"
copyrightText="© 2025 Luxuria Travel | Luxury Journeys Worldwide"
socialLinks={[
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
{ icon: Facebook, href: "#", ariaLabel: "Facebook" },
{ icon: Linkedin, href: "#", ariaLabel: "LinkedIn" },
]}
/>
</ReactLenis>
</ThemeProvider>
);
}