"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import ProductCardSeven from '@/components/sections/product/ProductCardSeven';
import AboutPhoneTimeline from '@/components/sections/about/AboutPhoneTimeline';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
import { Phone, Mail, MapPin, Globe } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="medium"
      sizing="mediumLargeSizeMediumTitles"
      background="none"
      cardStyle="outline"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline 
          navItems={[
            { name: "Properties", id: "properties" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" },
            { name: "FAQ", id: "faq" }
          ]}
          brandName="Dubai Realty Premium"
          button={{
            text: "Schedule Viewing",
            href: "#contact"
          }}
        />
      </div>
      
      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit 
          logoText="DUBAI REALTY"
          description="Discover premium properties in Dubai's most sought-after locations. From luxury villas to modern apartments, find your perfect investment or dream home."
          buttons={[
            { text: "View Properties", href: "#properties" },
            { text: "Schedule Tour", href: "#contact" }
          ]}
          layoutOrder="default"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677281862-wrg59rzg.jpg"
          imageAlt="Dubai modern skyline with luxury development"
          frameStyle="browser"
        />
      </div>
      
      <div id="properties" data-section="properties">
        <ProductCardSeven 
          title="Featured Properties"
          description="Explore our premium selection of residential and commercial properties in Dubai"
          products={[
            {
              id: "1",
              name: "Luxury Marina Apartment",
              price: "AED 2.5M",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677283454-saiau266.jpg",
              imageAlt: "Luxury Marina apartment with sea view"
            },
            {
              id: "2",
              name: "Private Villa Marina Heights",
              price: "AED 4.8M",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677284138-zvo3uevt.jpg",
              imageAlt: "Private villa with modern architecture"
            },
            {
              id: "3",
              name: "Downtown Studio Penthouse",
              price: "AED 1.2M",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677284768-9vqpeu11.jpg",
              imageAlt: "Modern penthouse with city views"
            },
            {
              id: "4",
              name: "Contemporary Townhouse",
              price: "AED 3.1M",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677285397-72fbvxql.jpg",
              imageAlt: "Contemporary townhouse design"
            },
            {
              id: "5",
              name: "Dreamy Luxury Villa",
              price: "AED 6.2M",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677281862-wrg59rzg.jpg",
              imageAlt: "Dreamy luxury villa with premium finishes"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          tag="Premium Selection"
          carouselMode="buttons"
        />
      </div>
      
      <div id="about" data-section="about">
        <AboutPhoneTimeline 
          title="Our Mission"
          description="We believe in creating experiences that inspire, empower, and transform. Our team is dedicated to building solutions that make a real difference in people's lives."
          tag="About Us"
          phoneOne={{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677283454-saiau266.jpg", imageAlt: "Dashboard view" }}
          phoneTwo={{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677284138-zvo3uevt.jpg", imageAlt: "Product demo view" }}
          textboxLayout="default"
          buttons={[
            { text: "Learn More", href: "#contact" },
            { text: "Contact Team", href: "#contact" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="metrics" data-section="metrics">
        <MetricCardTwo 
          title="Our Track Record"
          description="Proven success in Dubai's competitive real estate market"
          metrics={[
            { id: "1", value: "500+", description: "Properties Successfully Sold" },
            { id: "2", value: "AED 3.2B", description: "Total Transaction Value" },
            { id: "3", value: "98%", description: "Client Satisfaction Rate" },
            { id: "4", value: "15+", description: "Years Market Experience" }
          ]}
          gridVariant="uniform-all-items-equal"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardEight 
          title="What Our Clients Say"
          description="Real stories from satisfied property buyers and investors in Dubai"
          testimonials={[
            {
              id: "1",
              name: "Ahmed Al Mansouri",
              role: "Property Investor",
              company: "Emirates Group",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766490270889-y1dksta5.jpg",
              imageAlt: "Ahmed Al Mansouri"
            },
            {
              id: "2",
              name: "Fatima Hassan",
              role: "Business Owner",
              company: "Dubai Ventures",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677288932-62ftilm2.jpg",
              imageAlt: "Fatima Hassan"
            },
            {
              id: "3",
              name: "Mohammed Khan",
              role: "CEO",
              company: "Tech Solutions UAE",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677289682-2j1sn7zj.jpg",
              imageAlt: "Mohammed Khan"
            },
            {
              id: "4",
              name: "Layla Al Qassimi",
              role: "Entrepreneur",
              company: "Luxury Brands",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766161716897-3ct4uqsh.jpg",
              imageAlt: "Layla Al Qassimi"
            },
            {
              id: "5",
              name: "Hassan Al Maktoum",
              role: "Finance Director",
              company: "Investment Holdings",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766490272198-yzkfctxq.jpg",
              imageAlt: "Hassan Al Maktoum"
            },
            {
              id: "6",
              name: "Noor Al Mansouri",
              role: "Marketing Executive",
              company: "Global Services",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677290236-r70bi93h.jpg",
              imageAlt: "Noor Al Mansouri"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          tag="Client Reviews"
        />
      </div>
      
      <div id="faq" data-section="faq">
        <FaqSplitMedia 
          title="Frequently Asked Questions"
          description="Find answers to common questions about buying, selling, and investing in Dubai real estate"
          faqs={[
            {
              id: "1",
              title: "What is the process of buying property in Dubai?",
              content: "The property purchase process in Dubai involves several steps: viewing properties, making an offer, signing a preliminary agreement, obtaining mortgage approval if needed, conducting property inspection, and completing the final handover. Our team guides you through each step to ensure a smooth transaction."
            },
            {
              id: "2",
              title: "Are there restrictions on foreign property ownership?",
              content: "Yes, foreign nationals can own freehold property in designated areas of Dubai such as Emirates Hills, Downtown Dubai, Dubai Marina, Palm Jumeirah, and other approved zones. We specialize in advising clients on eligible areas and investment opportunities."
            },
            {
              id: "3",
              title: "What are the current market trends in Dubai?",
              content: "Dubai's real estate market continues to show strong growth with high demand for luxury properties, sustainable developments, and commercial spaces. Prices remain competitive, and properties appreciate consistently. Our market analysis helps investors identify the best opportunities."
            },
            {
              id: "4",
              title: "What are the financing options available?",
              content: "Multiple financing options are available including traditional bank mortgages with competitive rates, developer financing, and off-plan purchase plans. Most UAE banks offer 80% financing for qualified buyers. We connect clients with trusted financial partners."
            },
            {
              id: "5",
              title: "How long does the property transaction take?",
              content: "The typical timeline for property purchase is 2-3 months from agreement to final handover, depending on financing requirements and regulatory approvals. Our experienced team works to expedite the process while ensuring all legal requirements are met."
            }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677282559-pxzgrl4w.jpg"
          imageAlt="Dubai real estate office"
          mediaPosition="right"
          useInvertedBackground="noInvert"
          animationType="smooth"
          textboxLayout="default"
        />
      </div>
      
      <div id="contact" data-section="contact">
        <ContactSplitForm 
          title="Get in Touch"
          description="Ready to find your perfect property or discuss your real estate investment? Contact our expert team today for personalized guidance."
          inputs={[
            { name: "fullName", type: "text", placeholder: "Your Full Name", required: true },
            { name: "email", type: "email", placeholder: "Your Email Address", required: true },
            { name: "phone", type: "tel", placeholder: "Phone Number", required: true },
            { name: "propertyType", type: "text", placeholder: "Property Type (Villa, Apartment, etc.)", required: false }
          ]}
          textarea={{
            name: "message",
            placeholder: "Tell us about your property needs and budget...",
            rows: 5,
            required: true
          }}
          buttonText="Schedule Consultation"
          useInvertedBackground="noInvert"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766677282559-pxzgrl4w.jpg"
          imageAlt="Dubai real estate office interior"
          mediaPosition="left"
        />
      </div>
      
      <div id="footer" data-section="footer">
        <FooterBaseSocial 
          description="Dubai's premier real estate company specializing in luxury properties, investments, and commercial spaces. Trusted by thousands of satisfied clients across the emirate."
          logoText="Dubai Realty Premium"
          copyrightText="© 2025 Dubai Realty Premium. All rights reserved."
          columns={[
            {
              title: "Company",
              items: [
                { label: "About Us", href: "about" },
                { label: "Our Team", href: "about" },
                { label: "Market News", href: "#" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              title: "Properties",
              items: [
                { label: "Featured Listings", href: "properties" },
                { label: "By Location", href: "#" },
                { label: "By Type", href: "#" },
                { label: "Investment Guide", href: "#" }
              ]
            },
            {
              title: "Support",
              items: [
                { label: "Contact Us", href: "contact" },
                { label: "FAQ", href: "faq" },
                { label: "Buying Guide", href: "#" },
                { label: "Selling Guide", href: "#" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Disclaimer", href: "#" }
              ]
            }
          ]}
          socialLinks={[
            { icon: Phone, href: "tel:+971123456789", ariaLabel: "Call us" },
            { icon: Mail, href: "mailto:info@dubaireal.ae", ariaLabel: "Email us" },
            { icon: MapPin, href: "#", ariaLabel: "Visit us" },
            { icon: Globe, href: "#", ariaLabel: "Website" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}