Compare commits
36 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 6346b6309a | |||
| 9f59eaeb81 | |||
| c9d5674194 | |||
| 270f0d2904 | |||
| f3bde3b17b | |||
| 50ab43af7f | |||
| 73faf10239 | |||
| 30c3afd075 | |||
| 2167664695 | |||
| 77c18a6fa9 | |||
| 6d3fe20f8d | |||
| cd37a4e186 | |||
| b353e16b83 | |||
| 7cbb6245a9 | |||
| b0a4cd6363 | |||
| efead8030b | |||
| 949d605c43 | |||
| b29b80c734 | |||
| 7b2740bacf | |||
| 6f9eec16fa | |||
| 8b8a6cb80f | |||
| 3b0e739d23 | |||
| 1eb3666c04 | |||
| 2987c63d9a | |||
| 9efb3a1173 | |||
| 5ef7bae8af | |||
| 96fad445cf | |||
| bb139dd84d | |||
| aecdc2bb6a | |||
| f241eb57b3 | |||
| 30f75babdc | |||
| c8b8b37130 | |||
| 42f3ca72db | |||
| a5be510ffd | |||
| 2e1c63fe73 | |||
| 9919bca1d1 |
152
src/app/admin-dashboard/page.tsx
Normal file
152
src/app/admin-dashboard/page.tsx
Normal file
@@ -0,0 +1,152 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useState, useMemo } from "react";
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||||
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||||
|
import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
|
||||||
|
|
||||||
|
export default function AdminDashboardPage() {
|
||||||
|
const [searchTerm, setSearchTerm] = useState("");
|
||||||
|
const [paymentFilter, setPaymentFilter] = useState("All");
|
||||||
|
|
||||||
|
const applicants = useMemo(() => [
|
||||||
|
{
|
||||||
|
id: "app-1", name: "John Doe", category: "Paid", price: "$100", // Application Fee
|
||||||
|
rating: 5, // Approval rating
|
||||||
|
reviewCount: "5 documents", imageSrc: "https://images.unsplash.com/photo-1535713875002-d1d0cfdce53c?auto=format&fit=crop&q=80&w=1780&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D", // Example profile pic
|
||||||
|
imageAlt: "John Doe profile", onProductClick: () => alert("Viewing John Doe's details"),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "app-2", name: "Jane Smith", category: "Pending", price: "$100", rating: 3,
|
||||||
|
reviewCount: "3 documents", imageSrc: "https://images.unsplash.com/photo-1544005313-94ddf0286df2?auto=format&fit=crop&q=80&w=1780&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D", imageAlt: "Jane Smith profile", onProductClick: () => alert("Viewing Jane Smith's details"),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "app-3", name: "Robert Brown", category: "Paid", price: "$100", rating: 4,
|
||||||
|
reviewCount: "4 documents", imageSrc: "https://images.unsplash.com/photo-1507003211169-e69fe254fe58?auto=format&fit=crop&q=80&w=1887&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D", imageAlt: "Robert Brown profile", onProductClick: () => alert("Viewing Robert Brown's details"),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "app-4", name: "Emily White", category: "Rejected", price: "$100", rating: 1,
|
||||||
|
reviewCount: "2 documents", imageSrc: "https://images.unsplash.com/photo-1580489944761-15a19d654956?auto=format&fit=crop&q=80&w=1961&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D", imageAlt: "Emily White profile", onProductClick: () => alert("Viewing Emily White's details"),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "app-5", name: "Michael Green", category: "Paid", price: "$100", rating: 5,
|
||||||
|
reviewCount: "6 documents", imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?auto=format&fit=crop&q=80&w=1887&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D", imageAlt: "Michael Green profile", onProductClick: () => alert("Viewing Michael Green's details"),
|
||||||
|
},
|
||||||
|
], []);
|
||||||
|
|
||||||
|
const filteredApplicants = useMemo(() => {
|
||||||
|
return applicants.filter((applicant) => {
|
||||||
|
const matchesSearch = applicant.name.toLowerCase().includes(searchTerm.toLowerCase());
|
||||||
|
const matchesFilter = paymentFilter === "All" || applicant.category === paymentFilter;
|
||||||
|
return matchesSearch && matchesFilter;
|
||||||
|
});
|
||||||
|
}, [applicants, searchTerm, paymentFilter]);
|
||||||
|
|
||||||
|
const navItems = [
|
||||||
|
{ name: "Properties", id: "properties" },
|
||||||
|
{ name: "About", id: "about" },
|
||||||
|
{ name: "Services", id: "services" },
|
||||||
|
{ name: "Team", id: "team" },
|
||||||
|
{ name: "Testimonials", id: "testimonials" },
|
||||||
|
{ name: "Contact", id: "contact" },
|
||||||
|
{ name: "Admin Dashboard", id: "/admin-dashboard" }
|
||||||
|
];
|
||||||
|
|
||||||
|
const footerColumns = [
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{ label: "About Us", href: "#about" },
|
||||||
|
{ label: "Our Services", href: "#services" },
|
||||||
|
{ label: "Executive Team", href: "#team" },
|
||||||
|
{ label: "Properties", href: "#properties" },
|
||||||
|
{ label: "Contact", href: "#contact" },
|
||||||
|
{ label: "Apply Now", href: "/application-form" },
|
||||||
|
{ label: "Admin Dashboard", href: "/admin-dashboard" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Resources", items: [
|
||||||
|
{ label: "Investment Guide", href: "#" },
|
||||||
|
{ label: "Market Reports", href: "#" },
|
||||||
|
{ label: "FAQ", href: "#" },
|
||||||
|
{ label: "Blog", href: "#" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Legal", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#" },
|
||||||
|
{ label: "Terms of Service", href: "#" },
|
||||||
|
{ label: "Cookie Policy", href: "#" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Connect", items: [
|
||||||
|
{ label: "LinkedIn", href: "#" },
|
||||||
|
{ label: "Instagram", href: "#" },
|
||||||
|
{ label: "WhatsApp", href: "#" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-magnetic"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="pill"
|
||||||
|
contentWidth="mediumSmall"
|
||||||
|
sizing="mediumLarge"
|
||||||
|
background="none"
|
||||||
|
cardStyle="glass-elevated"
|
||||||
|
primaryButtonStyle="primary-glow"
|
||||||
|
secondaryButtonStyle="radial-glow"
|
||||||
|
headingFontWeight="medium"
|
||||||
|
>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered
|
||||||
|
brandName="Luxe Properties"
|
||||||
|
navItems={navItems}
|
||||||
|
button={{ text: "Apply Now", href: "/application-form" }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="relative isolate min-h-screen py-10 lg:py-16">
|
||||||
|
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
|
||||||
|
<h1 className="mb-8 text-4xl font-bold tracking-tight lg:text-5xl">Admin Dashboard</h1>
|
||||||
|
<p className="mb-12 text-lg text-gray-600 dark:text-gray-400">
|
||||||
|
Manage applicants, view documents, and track payment statuses.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h2 className="mb-4 text-3xl font-bold tracking-tight lg:text-4xl">Applicant Overview</h2>
|
||||||
|
<p className="mb-8 text-lg text-gray-600 dark:text-gray-400">
|
||||||
|
Browse and filter applicants by name or payment status.
|
||||||
|
</p>
|
||||||
|
<ProductCatalog
|
||||||
|
layout="page"
|
||||||
|
products={filteredApplicants}
|
||||||
|
searchValue={searchTerm}
|
||||||
|
onSearchChange={setSearchTerm}
|
||||||
|
searchPlaceholder="Search applicants..."
|
||||||
|
filters={[
|
||||||
|
{
|
||||||
|
label: "Payment Status", options: ["All", "Paid", "Pending", "Rejected"],
|
||||||
|
selected: paymentFilter,
|
||||||
|
onChange: setPaymentFilter,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
emptyMessage="No applicants found matching your criteria."
|
||||||
|
className="pb-10" // Add some padding to the bottom
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterSimple
|
||||||
|
columns={footerColumns}
|
||||||
|
bottomLeftText="© 2025 Luxe Properties Dubai. All rights reserved."
|
||||||
|
bottomRightText="Luxury Real Estate Excellence"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
304
src/app/application-form/page.tsx
Normal file
304
src/app/application-form/page.tsx
Normal file
@@ -0,0 +1,304 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||||
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||||
|
|
||||||
|
export default function ApplicationFormPage() {
|
||||||
|
const handleSubmit = (e: React.FormEvent) => {
|
||||||
|
e.preventDefault();
|
||||||
|
// In a real application, you would send this data to a backend.
|
||||||
|
alert("Application Submitted! Redirecting to payment...");
|
||||||
|
// Simulate redirection to a payment gateway
|
||||||
|
setTimeout(() => {
|
||||||
|
console.log("Redirecting to payment for AED 500...");
|
||||||
|
// window.location.href = "/payment-gateway-url";
|
||||||
|
}, 1000);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Navigation items for NavbarStyleCentered, adjusted to link back to homepage sections
|
||||||
|
const applicationFormNavItems = [
|
||||||
|
{ name: "Properties", id: "/#properties" },
|
||||||
|
{ name: "About", id: "/#about" },
|
||||||
|
{ name: "Services", id: "/#services" },
|
||||||
|
{ name: "Team", id: "/#team" },
|
||||||
|
{ name: "Testimonials", id: "/#testimonials" },
|
||||||
|
{ name: "Contact", id: "/#contact" }
|
||||||
|
];
|
||||||
|
|
||||||
|
// Footer columns for FooterSimple, adjusted for consistency
|
||||||
|
const commonFooterColumns = [
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{ label: "About Us", href: "/#about" },
|
||||||
|
{ label: "Our Services", href: "/#services" },
|
||||||
|
{ label: "Executive Team", href: "/#team" },
|
||||||
|
{ label: "Properties", href: "/#properties" },
|
||||||
|
{ label: "Contact", href: "/#contact" },
|
||||||
|
{ label: "Apply Now", href: "/application-form" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Resources", items: [
|
||||||
|
{ label: "Investment Guide", href: "/#" },
|
||||||
|
{ label: "Market Reports", href: "/#" },
|
||||||
|
{ label: "FAQ", href: "/#" },
|
||||||
|
{ label: "Blog", href: "/#" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Legal", items: [
|
||||||
|
{ label: "Privacy Policy", href: "/#" },
|
||||||
|
{ label: "Terms of Service", href: "/#" },
|
||||||
|
{ label: "Cookie Policy", href: "/#" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Connect", items: [
|
||||||
|
{ label: "LinkedIn", href: "#" },
|
||||||
|
{ label: "Instagram", href: "#" },
|
||||||
|
{ label: "WhatsApp", href: "#" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-magnetic"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="pill"
|
||||||
|
contentWidth="mediumSmall"
|
||||||
|
sizing="mediumLarge"
|
||||||
|
background="none"
|
||||||
|
cardStyle="glass-elevated"
|
||||||
|
primaryButtonStyle="primary-glow"
|
||||||
|
secondaryButtonStyle="radial-glow"
|
||||||
|
headingFontWeight="medium"
|
||||||
|
>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered
|
||||||
|
brandName="Luxe Properties"
|
||||||
|
navItems={applicationFormNavItems}
|
||||||
|
button={{ text: "Schedule Viewing", href: "/#contact" }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<main className="relative z-10 py-20 px-4 sm:px-6 lg:px-8 bg-background min-h-[calc(100vh-6rem)]">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
<h1 className="text-5xl md:text-6xl font-extrabold text-center mb-6 leading-tight text-foreground">
|
||||||
|
Property Application Form
|
||||||
|
</h1>
|
||||||
|
<p className="text-center text-lg md:text-xl text-foreground/70 mb-12">
|
||||||
|
Complete the form below to apply for our exclusive properties.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="bg-card p-8 rounded-xl shadow-2xl space-y-8 border border-border">
|
||||||
|
<form onSubmit={handleSubmit} className="space-y-6">
|
||||||
|
{/* Personal Information */}
|
||||||
|
<div>
|
||||||
|
<h2 className="text-2xl font-semibold text-foreground mb-4">Personal Information</h2>
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||||
|
<div>
|
||||||
|
<label htmlFor="fullName" className="block text-sm font-medium text-foreground mb-2">Full Name</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="fullName"
|
||||||
|
name="fullName"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="emailAddress" className="block text-sm font-medium text-foreground mb-2">Email Address</label>
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
id="emailAddress"
|
||||||
|
name="emailAddress"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="phoneNumber" className="block text-sm font-medium text-foreground mb-2">Phone Number</label>
|
||||||
|
<input
|
||||||
|
type="tel"
|
||||||
|
id="phoneNumber"
|
||||||
|
name="phoneNumber"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="md:col-span-2"> {/* Street Address takes full width */}
|
||||||
|
<label htmlFor="streetAddress" className="block text-sm font-medium text-foreground mb-2">Street Address</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="streetAddress"
|
||||||
|
name="streetAddress"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="city" className="block text-sm font-medium text-foreground mb-2">City</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="city"
|
||||||
|
name="city"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="stateProvince" className="block text-sm font-medium text-foreground mb-2">State/Province</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="stateProvince"
|
||||||
|
name="stateProvince"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="postalCode" className="block text-sm font-medium text-foreground mb-2">Postal Code</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="postalCode"
|
||||||
|
name="postalCode"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="country" className="block text-sm font-medium text-foreground mb-2">Country</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="country"
|
||||||
|
name="country"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Employment Information */}
|
||||||
|
<div>
|
||||||
|
<h2 className="text-2xl font-semibold text-foreground mb-4">Employment Information</h2>
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||||
|
<div>
|
||||||
|
<label htmlFor="employmentStatus" className="block text-sm font-medium text-foreground mb-2">Employment Status</label>
|
||||||
|
<select
|
||||||
|
id="employmentStatus"
|
||||||
|
name="employmentStatus"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
>
|
||||||
|
<option value="">Select status</option>
|
||||||
|
<option value="employed">Employed</option>
|
||||||
|
<option value="self-employed">Self-employed</option>
|
||||||
|
<option value="unemployed">Unemployed</option>
|
||||||
|
<option value="student">Student</option>
|
||||||
|
<option value="retired">Retired</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="monthlyIncome" className="block text-sm font-medium text-foreground mb-2">Monthly Income (AED)</label>
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
id="monthlyIncome"
|
||||||
|
name="monthlyIncome"
|
||||||
|
required
|
||||||
|
min="0"
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="occupation" className="block text-sm font-medium text-foreground mb-2">Occupation</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="occupation"
|
||||||
|
name="occupation"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="employer" className="block text-sm font-medium text-foreground mb-2">Employer</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="employer"
|
||||||
|
name="employer"
|
||||||
|
required
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border focus:outline-none focus:ring-2 focus:ring-primary-cta"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Document Upload */}
|
||||||
|
<div>
|
||||||
|
<h2 className="text-2xl font-semibold text-foreground mb-4">Document Upload</h2>
|
||||||
|
<p className="text-sm text-foreground/80 mb-4">Please upload necessary documents (Max file size 5MB per file).</p>
|
||||||
|
<div className="space-y-4">
|
||||||
|
<div>
|
||||||
|
<label htmlFor="idDocument" className="block text-sm font-medium text-foreground mb-2">ID Document (e.g., Passport, Emirates ID)</label>
|
||||||
|
<input
|
||||||
|
type="file"
|
||||||
|
id="idDocument"
|
||||||
|
name="idDocument"
|
||||||
|
required
|
||||||
|
accept=".pdf,.jpg,.jpeg,.png"
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-primary-cta file:text-white hover:file:bg-primary-cta/90"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="proofOfIncome" className="block text-sm font-medium text-foreground mb-2">Proof of Income (e.g., Salary Certificate, Bank Statement)</label>
|
||||||
|
<input
|
||||||
|
type="file"
|
||||||
|
id="proofOfIncome"
|
||||||
|
name="proofOfIncome"
|
||||||
|
required
|
||||||
|
accept=".pdf,.doc,.docx,.jpg,.jpeg,.png"
|
||||||
|
className="w-full px-4 py-2 bg-background-accent text-foreground rounded-lg border border-border file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-primary-cta file:text-white hover:file:bg-primary-cta/90"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Application Fee Explanation */}
|
||||||
|
<div className="pt-4 border-t border-border">
|
||||||
|
<h3 className="text-xl font-semibold text-foreground mb-2">Application Fee</h3>
|
||||||
|
<p className="text-sm text-foreground/80">
|
||||||
|
A non-refundable application fee of <strong className="text-primary-cta">AED 500</strong> is required to process your application. This fee covers administrative costs and a comprehensive background check. You will be redirected to a secure payment gateway after submitting this form.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button
|
||||||
|
type="submit"
|
||||||
|
className="w-full py-3 px-6 bg-primary-cta text-white font-bold rounded-lg hover:bg-primary-cta/90 transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-primary-cta focus:ring-offset-2"
|
||||||
|
>
|
||||||
|
Submit Application
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
{/* Confirmation Text - Note: In a real app, this would be conditionally rendered after successful submission */}
|
||||||
|
<div className="text-center pt-8 border-t border-border ">
|
||||||
|
<h2 className="text-2xl font-semibold text-foreground mb-4">Thank You for Your Application!</h2>
|
||||||
|
<p className="text-foreground/80">
|
||||||
|
Your application has been received and is currently under review. Please check your email for a confirmation and further instructions regarding the payment of the application fee. We appreciate your patience.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterSimple
|
||||||
|
columns={commonFooterColumns}
|
||||||
|
bottomLeftText="© 2025 Luxe Properties Dubai. All rights reserved."
|
||||||
|
bottomRightText="Luxury Real Estate Excellence"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
107
src/app/confirmation/page.tsx
Normal file
107
src/app/confirmation/page.tsx
Normal file
@@ -0,0 +1,107 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||||
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||||
|
import ButtonBounceEffect from '@/components/button/ButtonBounceEffect/ButtonBounceEffect';
|
||||||
|
import { useRouter } from 'next/navigation';
|
||||||
|
import { CheckCircle } from "lucide-react";
|
||||||
|
|
||||||
|
export default function ConfirmationPage() {
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-magnetic"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="pill"
|
||||||
|
contentWidth="mediumSmall"
|
||||||
|
sizing="mediumLarge"
|
||||||
|
background="none"
|
||||||
|
cardStyle="glass-elevated"
|
||||||
|
primaryButtonStyle="primary-glow"
|
||||||
|
secondaryButtonStyle="radial-glow"
|
||||||
|
headingFontWeight="medium"
|
||||||
|
>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered
|
||||||
|
brandName="Luxe Properties"
|
||||||
|
navItems={[
|
||||||
|
{ name: "Properties", id: "properties" },
|
||||||
|
{ name: "About", id: "about" },
|
||||||
|
{ name: "Services", id: "services" },
|
||||||
|
{ name: "Team", id: "team" },
|
||||||
|
{ name: "Testimonials", id: "testimonials" },
|
||||||
|
{ name: "Contact", id: "contact" },
|
||||||
|
{ name: "Apply Now", id: "/application-form" },
|
||||||
|
{ name: "Payment", id: "/payment" },
|
||||||
|
{ name: "Confirmation", id: "/confirmation" }
|
||||||
|
]}
|
||||||
|
button={{ text: "Schedule Viewing", href: "contact" }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="min-h-[60vh] flex flex-col items-center justify-center py-16 px-4">
|
||||||
|
<div className="bg-card p-8 rounded-lg shadow-lg max-w-md w-full text-center">
|
||||||
|
<CheckCircle className="mx-auto h-16 w-16 text-green-500 mb-6" />
|
||||||
|
<h1 className="text-3xl font-bold mb-4">Payment Successful!</h1>
|
||||||
|
<p className="text-lg text-foreground mb-6">
|
||||||
|
Thank you for your payment. Your transaction has been completed, and a confirmation email has been sent to your registered address.
|
||||||
|
</p>
|
||||||
|
<p className="text-md text-gray-500 mb-8">
|
||||||
|
What's next? You can now explore more properties or schedule a viewing.
|
||||||
|
</p>
|
||||||
|
<ButtonBounceEffect
|
||||||
|
text="Return to Home"
|
||||||
|
onClick={() => router.push('/')}
|
||||||
|
className="w-full max-w-xs"
|
||||||
|
type="button"
|
||||||
|
ariaLabel="Return to home page"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterSimple
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{ label: "About Us", href: "#about" },
|
||||||
|
{ label: "Our Services", href: "#services" },
|
||||||
|
{ label: "Executive Team", href: "#team" },
|
||||||
|
{ label: "Properties", href: "#properties" },
|
||||||
|
{ label: "Contact", href: "#contact" },
|
||||||
|
{ label: "Apply Now", href: "/application-form" },
|
||||||
|
{ label: "Payment", href: "/payment" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Resources", items: [
|
||||||
|
{ label: "Investment Guide", href: "#" },
|
||||||
|
{ label: "Market Reports", href: "#" },
|
||||||
|
{ label: "FAQ", href: "#" },
|
||||||
|
{ label: "Blog", href: "#" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Legal", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#" },
|
||||||
|
{ label: "Terms of Service", href: "#" },
|
||||||
|
{ label: "Cookie Policy", href: "#" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Connect", items: [
|
||||||
|
{ label: "LinkedIn", href: "#" },
|
||||||
|
{ label: "Instagram", href: "#" },
|
||||||
|
{ label: "WhatsApp", href: "#" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]}
|
||||||
|
bottomLeftText="© 2025 Luxe Properties Dubai. All rights reserved."
|
||||||
|
bottomRightText="Luxury Real Estate Excellence"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
200
src/app/page.tsx
200
src/app/page.tsx
@@ -36,9 +36,10 @@ export default function LandingPage() {
|
|||||||
{ name: "Services", id: "services" },
|
{ name: "Services", id: "services" },
|
||||||
{ name: "Team", id: "team" },
|
{ name: "Team", id: "team" },
|
||||||
{ name: "Testimonials", id: "testimonials" },
|
{ name: "Testimonials", id: "testimonials" },
|
||||||
{ name: "Contact", id: "contact" }
|
{ name: "Contact", id: "contact" },
|
||||||
|
{ name: "Admin Dashboard", id: "/admin-dashboard" }
|
||||||
]}
|
]}
|
||||||
button={{ text: "Schedule Viewing", href: "contact" }}
|
button={{ text: "Apply Now", href: "/application-form" }}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -55,24 +56,19 @@ export default function LandingPage() {
|
|||||||
]}
|
]}
|
||||||
mediaItems={[
|
mediaItems={[
|
||||||
{
|
{
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/modern-spacious-room-with-large-panoramic-window_7502-7289.jpg",
|
imageSrc: "https://img.b2bpic.net/free-photo/modern-spacious-room-with-large-panoramic-window_7502-7289.jpg?_wi=1", imageAlt: "Luxury penthouse in Dubai Marina"
|
||||||
imageAlt: "Luxury penthouse in Dubai Marina"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg",
|
imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg?_wi=1", imageAlt: "Dubai skyline at night"
|
||||||
imageAlt: "Dubai skyline at night"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg",
|
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg?_wi=1", imageAlt: "Modern luxury exterior design"
|
||||||
imageAlt: "Modern luxury exterior design"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg",
|
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg?_wi=1", imageAlt: "Contemporary luxury architecture"
|
||||||
imageAlt: "Contemporary luxury architecture"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/modern-spacious-room-with-large-panoramic-window_7502-7289.jpg",
|
imageSrc: "https://img.b2bpic.net/free-photo/modern-spacious-room-with-large-panoramic-window_7502-7289.jpg?_wi=2", imageAlt: "Spacious modern interior with panoramic view"
|
||||||
imageAlt: "Spacious modern interior with panoramic view"
|
|
||||||
}
|
}
|
||||||
]}
|
]}
|
||||||
mediaAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
@@ -95,32 +91,16 @@ export default function LandingPage() {
|
|||||||
]}
|
]}
|
||||||
products={[
|
products={[
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1", name: "Palm Jumeirah Villa", price: "AED 12,500,000", variant: "5 Bed Villa | Beachfront", imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg?_wi=2", imageAlt: "Luxury villa on Palm Jumeirah", isFavorited: false,
|
||||||
name: "Palm Jumeirah Villa",
|
onProductClick: () => window.location.href = "/property/1"
|
||||||
price: "AED 12,500,000",
|
|
||||||
variant: "5 Bed Villa | Beachfront",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg",
|
|
||||||
imageAlt: "Luxury villa on Palm Jumeirah",
|
|
||||||
isFavorited: false,
|
|
||||||
onProductClick: () => window.location.href = "/property/palm-jumeirah-villa"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "2",
|
id: "2", name: "Downtown Dubai Penthouse", price: "AED 8,750,000", variant: "4 Bed Penthouse | City View", imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg?_wi=2", imageAlt: "Modern penthouse in Downtown Dubai", isFavorited: false,
|
||||||
name: "Downtown Dubai Penthouse",
|
onProductClick: () => window.location.href = "/property/2"
|
||||||
price: "AED 8,750,000",
|
|
||||||
variant: "4 Bed Penthouse | City View",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg",
|
|
||||||
imageAlt: "Modern penthouse in Downtown Dubai",
|
|
||||||
isFavorited: false
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "3",
|
id: "3", name: "Emirates Hills Townhouse", price: "AED 6,200,000", variant: "4 Bed Townhouse | Golf View", imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg?_wi=2", imageAlt: "Contemporary townhouse in Emirates Hills", isFavorited: false,
|
||||||
name: "Emirates Hills Townhouse",
|
onProductClick: () => window.location.href = "/property/3"
|
||||||
price: "AED 6,200,000",
|
|
||||||
variant: "4 Bed Townhouse | Golf View",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg",
|
|
||||||
imageAlt: "Contemporary townhouse in Emirates Hills",
|
|
||||||
isFavorited: false
|
|
||||||
}
|
}
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
@@ -131,7 +111,7 @@ export default function LandingPage() {
|
|||||||
title="Your Trusted Dubai Real Estate Partner"
|
title="Your Trusted Dubai Real Estate Partner"
|
||||||
description="With over 15 years of excellence in Dubai's luxury real estate market, we have established ourselves as the premier boutique agency for discerning international clientele. Our expert team specializes in sourcing and curating the finest properties across Dubai's most exclusive communities. We combine market mastery with personalized service, ensuring every transaction is seamless and satisfying."
|
description="With over 15 years of excellence in Dubai's luxury real estate market, we have established ourselves as the premier boutique agency for discerning international clientele. Our expert team specializes in sourcing and curating the finest properties across Dubai's most exclusive communities. We combine market mastery with personalized service, ensuring every transaction is seamless and satisfying."
|
||||||
tag="About Us"
|
tag="About Us"
|
||||||
imageSrc="https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg"
|
imageSrc="https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg?_wi=3"
|
||||||
imageAlt="Luxe Properties Dubai team"
|
imageAlt="Luxe Properties Dubai team"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
buttons={[
|
buttons={[
|
||||||
@@ -153,46 +133,22 @@ export default function LandingPage() {
|
|||||||
carouselMode="buttons"
|
carouselMode="buttons"
|
||||||
features={[
|
features={[
|
||||||
{
|
{
|
||||||
id: "01",
|
id: "01", title: "Property Selection", description: "Exclusive access to off-market and hand-selected luxury properties", imageSrc: "https://img.b2bpic.net/free-photo/modern-spacious-room-with-large-panoramic-window_7502-7289.jpg?_wi=3", imageAlt: "Property selection"
|
||||||
title: "Property Selection",
|
|
||||||
description: "Exclusive access to off-market and hand-selected luxury properties",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/modern-spacious-room-with-large-panoramic-window_7502-7289.jpg",
|
|
||||||
imageAlt: "Property selection"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "02",
|
id: "02", title: "Investment Advisory", description: "Expert insights into market trends and investment opportunities", imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg?_wi=3", imageAlt: "Investment advisory"
|
||||||
title: "Investment Advisory",
|
|
||||||
description: "Expert insights into market trends and investment opportunities",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg",
|
|
||||||
imageAlt: "Investment advisory"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "03",
|
id: "03", title: "Negotiation & Closing", description: "Strategic negotiation and seamless transaction management", imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg?_wi=4", imageAlt: "Negotiation and closing"
|
||||||
title: "Negotiation & Closing",
|
|
||||||
description: "Strategic negotiation and seamless transaction management",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg",
|
|
||||||
imageAlt: "Negotiation and closing"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "04",
|
id: "04", title: "Legal Compliance", description: "Full support with documentation, permits, and regulatory compliance", imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg?_wi=3", imageAlt: "Legal compliance"
|
||||||
title: "Legal Compliance",
|
|
||||||
description: "Full support with documentation, permits, and regulatory compliance",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg",
|
|
||||||
imageAlt: "Legal compliance"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "05",
|
id: "05", title: "Property Management", description: "Professional management services for rental income optimization", imageSrc: "https://img.b2bpic.net/free-photo/modern-spacious-room-with-large-panoramic-window_7502-7289.jpg?_wi=4", imageAlt: "Property management"
|
||||||
title: "Property Management",
|
|
||||||
description: "Professional management services for rental income optimization",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/modern-spacious-room-with-large-panoramic-window_7502-7289.jpg",
|
|
||||||
imageAlt: "Property management"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "06",
|
id: "06", title: "Concierge Services", description: "White-glove concierge support for renovations and lifestyle services", imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg?_wi=4", imageAlt: "Concierge services"
|
||||||
title: "Concierge Services",
|
|
||||||
description: "White-glove concierge support for renovations and lifestyle services",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg",
|
|
||||||
imageAlt: "Concierge services"
|
|
||||||
}
|
}
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
@@ -209,25 +165,13 @@ export default function LandingPage() {
|
|||||||
gridVariant="uniform-all-items-equal"
|
gridVariant="uniform-all-items-equal"
|
||||||
members={[
|
members={[
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1", name: "Hassan Al-Maktoum", role: "Chief Executive Officer", imageSrc: "https://img.b2bpic.net/free-photo/business-people-using-digital-tablet-airport_107420-95868.jpg", imageAlt: "Hassan Al-Maktoum"
|
||||||
name: "Hassan Al-Maktoum",
|
|
||||||
role: "Chief Executive Officer",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/business-people-using-digital-tablet-airport_107420-95868.jpg",
|
|
||||||
imageAlt: "Hassan Al-Maktoum"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "2",
|
id: "2", name: "Layla Al-Mansoori", role: "Chief Operating Officer", imageSrc: "https://img.b2bpic.net/free-photo/attractive-satisfied-young-female-entrepreneur-standing-proud-smiling-with-crossed-hands-confident_197531-23012.jpg?id=13871705", imageAlt: "Layla Al-Mansoori"
|
||||||
name: "Layla Al-Mansoori",
|
|
||||||
role: "Chief Operating Officer",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/attractive-satisfied-young-female-entrepreneur-standing-proud-smiling-with-crossed-hands-confident_197531-23012.jpg?id=13871705",
|
|
||||||
imageAlt: "Layla Al-Mansoori"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "3",
|
id: "3", name: "Marcus Wellington", role: "Chief Investment Officer", imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-with-clipboard_1098-602.jpg", imageAlt: "Marcus Wellington"
|
||||||
name: "Marcus Wellington",
|
|
||||||
role: "Chief Investment Officer",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-with-clipboard_1098-602.jpg",
|
|
||||||
imageAlt: "Marcus Wellington"
|
|
||||||
}
|
}
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
@@ -244,28 +188,20 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
metrics={[
|
metrics={[
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1", icon: Home,
|
||||||
icon: Home,
|
title: "Properties Sold", value: "450+"
|
||||||
title: "Properties Sold",
|
|
||||||
value: "450+"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "2",
|
id: "2", icon: Users,
|
||||||
icon: Users,
|
title: "Satisfied Clients", value: "650+"
|
||||||
title: "Satisfied Clients",
|
|
||||||
value: "650+"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "3",
|
id: "3", icon: DollarSign,
|
||||||
icon: DollarSign,
|
title: "Total Value", value: "$2.3B"
|
||||||
title: "Total Value",
|
|
||||||
value: "$2.3B"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "4",
|
id: "4", icon: TrendingUp,
|
||||||
icon: TrendingUp,
|
title: "International", value: "45 Countries"
|
||||||
title: "International",
|
|
||||||
value: "45 Countries"
|
|
||||||
}
|
}
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
@@ -281,64 +217,22 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
testimonials={[
|
testimonials={[
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1", name: "Ahmed Al Mansouri, Real Estate Investor", date: "Date: September 2024", title: "Exceptional Service & Market Expertise", quote: "The team at Luxe Properties demonstrated outstanding knowledge of the Dubai market. Their negotiation skills saved me significant time and money. I would not hesitate to recommend them for any luxury property transaction.", tag: "Premium Portfolio", avatarSrc: "https://img.b2bpic.net/free-photo/business-people-using-digital-tablet-airport_107420-95868.jpg", imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg?_wi=5"
|
||||||
name: "Ahmed Al Mansouri, Real Estate Investor",
|
|
||||||
date: "Date: September 2024",
|
|
||||||
title: "Exceptional Service & Market Expertise",
|
|
||||||
quote: "The team at Luxe Properties demonstrated outstanding knowledge of the Dubai market. Their negotiation skills saved me significant time and money. I would not hesitate to recommend them for any luxury property transaction.",
|
|
||||||
tag: "Premium Portfolio",
|
|
||||||
avatarSrc: "https://img.b2bpic.net/free-photo/business-people-using-digital-tablet-airport_107420-95868.jpg",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "2",
|
id: "2", name: "Sarah Johnson, CEO - Tech Corp", date: "Date: August 2024", title: "A Smooth & Sophisticated Experience", quote: "Finding a penthouse that matched my exacting standards seemed impossible, yet within weeks, the team presented three exceptional options. Their professionalism and attention to detail were impeccable throughout.", tag: "Penthouse Collection", avatarSrc: "https://img.b2bpic.net/free-photo/attractive-satisfied-young-female-entrepreneur-standing-proud-smiling-with-crossed-hands-confident_197531-23012.jpg?id=13871705", imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg?_wi=5"
|
||||||
name: "Sarah Johnson, CEO - Tech Corp",
|
|
||||||
date: "Date: August 2024",
|
|
||||||
title: "A Smooth & Sophisticated Experience",
|
|
||||||
quote: "Finding a penthouse that matched my exacting standards seemed impossible, yet within weeks, the team presented three exceptional options. Their professionalism and attention to detail were impeccable throughout.",
|
|
||||||
tag: "Penthouse Collection",
|
|
||||||
avatarSrc: "https://img.b2bpic.net/free-photo/attractive-satisfied-young-female-entrepreneur-standing-proud-smiling-with-crossed-hands-confident_197531-23012.jpg?id=13871705",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "3",
|
id: "3", name: "Michael Chen, International Investor", date: "Date: July 2024", title: "Trusted Partner for International Clients", quote: "As a foreign investor, I appreciated the comprehensive legal and financial guidance. The team navigated complex regulations effortlessly, allowing me to invest with complete confidence.", tag: "Investment Advisory", avatarSrc: "https://img.b2bpic.net/free-photo/young-businessman-with-clipboard_1098-602.jpg", imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg?_wi=4"
|
||||||
name: "Michael Chen, International Investor",
|
|
||||||
date: "Date: July 2024",
|
|
||||||
title: "Trusted Partner for International Clients",
|
|
||||||
quote: "As a foreign investor, I appreciated the comprehensive legal and financial guidance. The team navigated complex regulations effortlessly, allowing me to invest with complete confidence.",
|
|
||||||
tag: "Investment Advisory",
|
|
||||||
avatarSrc: "https://img.b2bpic.net/free-photo/young-businessman-with-clipboard_1098-602.jpg",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "4",
|
id: "4", name: "Fatima Al-Serkal, Luxury Lifestyle", date: "Date: June 2024", title: "Impeccable Taste & Attention to Detail", quote: "Beyond finding properties, they understand lifestyle. The concierge services and interior design recommendations have transformed my new home into a personal sanctuary.", tag: "Concierge Services", avatarSrc: "https://img.b2bpic.net/free-photo/executive-paying-attention-his-partner_1098-4058.jpg", imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg?_wi=6"
|
||||||
name: "Fatima Al-Serkal, Luxury Lifestyle",
|
|
||||||
date: "Date: June 2024",
|
|
||||||
title: "Impeccable Taste & Attention to Detail",
|
|
||||||
quote: "Beyond finding properties, they understand lifestyle. The concierge services and interior design recommendations have transformed my new home into a personal sanctuary.",
|
|
||||||
tag: "Concierge Services",
|
|
||||||
avatarSrc: "https://img.b2bpic.net/free-photo/executive-paying-attention-his-partner_1098-4058.jpg",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/shanghai-night-china_1127-3170.jpg"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "5",
|
id: "5", name: "David Martinez, Corporate Executive", date: "Date: May 2024", title: "Seamless Relocation Experience", quote: "Moving to Dubai for business, I needed a quick turnaround. Their efficient process and white-glove service made the transition seamless and stress-free.", tag: "Corporate Solutions", avatarSrc: "https://img.b2bpic.net/free-photo/smiling-team-leader-looking-camera-group-corporate-meeting_1163-3920.jpg", imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg?_wi=6"
|
||||||
name: "David Martinez, Corporate Executive",
|
|
||||||
date: "Date: May 2024",
|
|
||||||
title: "Seamless Relocation Experience",
|
|
||||||
quote: "Moving to Dubai for business, I needed a quick turnaround. Their efficient process and white-glove service made the transition seamless and stress-free.",
|
|
||||||
tag: "Corporate Solutions",
|
|
||||||
avatarSrc: "https://img.b2bpic.net/free-photo/smiling-team-leader-looking-camera-group-corporate-meeting_1163-3920.jpg",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg"
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "6",
|
id: "6", name: "James Richardson, Family Relocation", date: "Date: April 2024", title: "Perfect Home for Family Living", quote: "They truly understood what our family needed. The search process was collaborative and transparent, resulting in finding our perfect family home in Emirates Hills.", tag: "Family Properties", avatarSrc: "https://img.b2bpic.net/free-photo/cheerful-businessman-eyeglasses-office_1262-3710.jpg", imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg?_wi=5"
|
||||||
name: "James Richardson, Family Relocation",
|
|
||||||
date: "Date: April 2024",
|
|
||||||
title: "Perfect Home for Family Living",
|
|
||||||
quote: "They truly understood what our family needed. The search process was collaborative and transparent, resulting in finding our perfect family home in Emirates Hills.",
|
|
||||||
tag: "Family Properties",
|
|
||||||
avatarSrc: "https://img.b2bpic.net/free-photo/cheerful-businessman-eyeglasses-office_1262-3710.jpg",
|
|
||||||
imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg"
|
|
||||||
}
|
}
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
@@ -353,7 +247,7 @@ export default function LandingPage() {
|
|||||||
background={{ variant: "sparkles-gradient" }}
|
background={{ variant: "sparkles-gradient" }}
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
buttons={[
|
buttons={[
|
||||||
{ text: "Schedule Consultation", href: "#" },
|
{ text: "Get Expert Guidance Now", href: "#" },
|
||||||
{ text: "Browse Listings", href: "#properties" }
|
{ text: "Browse Listings", href: "#properties" }
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
@@ -363,18 +257,18 @@ export default function LandingPage() {
|
|||||||
<FooterSimple
|
<FooterSimple
|
||||||
columns={[
|
columns={[
|
||||||
{
|
{
|
||||||
title: "Company",
|
title: "Company", items: [
|
||||||
items: [
|
|
||||||
{ label: "About Us", href: "#about" },
|
{ label: "About Us", href: "#about" },
|
||||||
{ label: "Our Services", href: "#services" },
|
{ label: "Our Services", href: "#services" },
|
||||||
{ label: "Executive Team", href: "#team" },
|
{ label: "Executive Team", href: "#team" },
|
||||||
{ label: "Properties", href: "#properties" },
|
{ label: "Properties", href: "#properties" },
|
||||||
{ label: "Contact", href: "#contact" }
|
{ label: "Contact", href: "#contact" },
|
||||||
|
{ label: "Apply Now", href: "/application-form" },
|
||||||
|
{ label: "Admin Dashboard", href: "/admin-dashboard" }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Resources",
|
title: "Resources", items: [
|
||||||
items: [
|
|
||||||
{ label: "Investment Guide", href: "#" },
|
{ label: "Investment Guide", href: "#" },
|
||||||
{ label: "Market Reports", href: "#" },
|
{ label: "Market Reports", href: "#" },
|
||||||
{ label: "FAQ", href: "#" },
|
{ label: "FAQ", href: "#" },
|
||||||
@@ -382,16 +276,14 @@ export default function LandingPage() {
|
|||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Legal",
|
title: "Legal", items: [
|
||||||
items: [
|
|
||||||
{ label: "Privacy Policy", href: "#" },
|
{ label: "Privacy Policy", href: "#" },
|
||||||
{ label: "Terms of Service", href: "#" },
|
{ label: "Terms of Service", href: "#" },
|
||||||
{ label: "Cookie Policy", href: "#" }
|
{ label: "Cookie Policy", href: "#" }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Connect",
|
title: "Connect", items: [
|
||||||
items: [
|
|
||||||
{ label: "LinkedIn", href: "#" },
|
{ label: "LinkedIn", href: "#" },
|
||||||
{ label: "Instagram", href: "#" },
|
{ label: "Instagram", href: "#" },
|
||||||
{ label: "WhatsApp", href: "#" }
|
{ label: "WhatsApp", href: "#" }
|
||||||
|
|||||||
117
src/app/payment/page.tsx
Normal file
117
src/app/payment/page.tsx
Normal file
@@ -0,0 +1,117 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||||
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||||
|
import ButtonBounceEffect from '@/components/button/ButtonBounceEffect/ButtonBounceEffect';
|
||||||
|
import { useRouter } from 'next/navigation';
|
||||||
|
import { Lock, CreditCard } from "lucide-react";
|
||||||
|
|
||||||
|
export default function PaymentPage() {
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
const handlePayment = () => {
|
||||||
|
// Simulate Flutterwave payment processing
|
||||||
|
alert('Processing payment via Flutterwave...');
|
||||||
|
// On successful payment, redirect to confirmation page
|
||||||
|
router.push('/confirmation');
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-magnetic"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="pill"
|
||||||
|
contentWidth="mediumSmall"
|
||||||
|
sizing="mediumLarge"
|
||||||
|
background="none"
|
||||||
|
cardStyle="glass-elevated"
|
||||||
|
primaryButtonStyle="primary-glow"
|
||||||
|
secondaryButtonStyle="radial-glow"
|
||||||
|
headingFontWeight="medium"
|
||||||
|
>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered
|
||||||
|
brandName="Luxe Properties"
|
||||||
|
navItems={[
|
||||||
|
{ name: "Properties", id: "properties" },
|
||||||
|
{ name: "About", id: "about" },
|
||||||
|
{ name: "Services", id: "services" },
|
||||||
|
{ name: "Team", id: "team" },
|
||||||
|
{ name: "Testimonials", id: "testimonials" },
|
||||||
|
{ name: "Contact", id: "contact" },
|
||||||
|
{ name: "Apply Now", id: "/application-form" },
|
||||||
|
{ name: "Payment", id: "/payment" },
|
||||||
|
{ name: "Confirmation", id: "/confirmation" }
|
||||||
|
]}
|
||||||
|
button={{ text: "Schedule Viewing", href: "contact" }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="min-h-[60vh] flex flex-col items-center justify-center py-16 px-4">
|
||||||
|
<div className="bg-card p-8 rounded-lg shadow-lg max-w-md w-full text-center">
|
||||||
|
<Lock className="mx-auto h-12 w-12 text-primary-cta mb-4" />
|
||||||
|
<h1 className="text-3xl font-bold mb-4">Secure Payment</h1>
|
||||||
|
<p className="text-lg text-foreground mb-6">
|
||||||
|
Complete your payment securely via Flutterwave. A fee of <span className="font-semibold text-primary-cta">$60</span> will be applied.
|
||||||
|
</p>
|
||||||
|
<div className="flex flex-col items-center space-y-4 mb-6">
|
||||||
|
<ButtonBounceEffect
|
||||||
|
text="Pay $60 Securely"
|
||||||
|
onClick={handlePayment}
|
||||||
|
className="w-full max-w-xs"
|
||||||
|
type="button"
|
||||||
|
ariaLabel="Pay 60 dollars securely"
|
||||||
|
/>
|
||||||
|
<p className="text-sm text-gray-500 flex items-center justify-center">
|
||||||
|
<CreditCard className="h-4 w-4 mr-1" />
|
||||||
|
Your transaction is secured with 256-bit encryption.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterSimple
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{ label: "About Us", href: "#about" },
|
||||||
|
{ label: "Our Services", href: "#services" },
|
||||||
|
{ label: "Executive Team", href: "#team" },
|
||||||
|
{ label: "Properties", href: "#properties" },
|
||||||
|
{ label: "Contact", href: "#contact" },
|
||||||
|
{ label: "Apply Now", href: "/application-form" },
|
||||||
|
{ label: "Payment", href: "/payment" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Resources", items: [
|
||||||
|
{ label: "Investment Guide", href: "#" },
|
||||||
|
{ label: "Market Reports", href: "#" },
|
||||||
|
{ label: "FAQ", href: "#" },
|
||||||
|
{ label: "Blog", href: "#" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Legal", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#" },
|
||||||
|
{ label: "Terms of Service", href: "#" },
|
||||||
|
{ label: "Cookie Policy", href: "#" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Connect", items: [
|
||||||
|
{ label: "LinkedIn", href: "#" },
|
||||||
|
{ label: "Instagram", href: "#" },
|
||||||
|
{ label: "WhatsApp", href: "#" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]}
|
||||||
|
bottomLeftText="© 2025 Luxe Properties Dubai. All rights reserved."
|
||||||
|
bottomRightText="Luxury Real Estate Excellence"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user