"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="rounded"
        contentWidth="medium"
        sizing="largeSmallSizeLargeTitles"
        background="none"
        cardStyle="glass-depth"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="solid"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "About",
          id: "#about",
        },
        {
          name: "Portfolio",
          id: "#portfolio",
        },
        {
          name: "Services",
          id: "#services",
        },
        {
          name: "Contact",
          id: "#contact",
        },
      ]}
      brandName="UrbanBuild"
      button={{
        text: "Enquire Now",
        href: "#contact",
      }}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitKpi
      background={{
        variant: "plain",
      }}
      title="Crafting Exceptional Living Spaces"
      description="UrbanBuild creates premium residential and commercial projects with timeless design and uncompromising quality craftsmanship."
      kpis={[
        {
          value: "25+",
          label: "Years Experience",
        },
        {
          value: "150+",
          label: "Projects Completed",
        },
        {
          value: "100%",
          label: "Quality Assured",
        },
      ]}
      enableKpiAnimation={true}
      imageSrc="http://img.b2bpic.net/free-photo/beach-chair-resort_1150-17976.jpg"
      imageAlt="Luxury home exterior architectural design"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/full-shot-young-woman-stairs_23-2149204468.jpg",
          alt: "Full shot young woman on stairs",
        },
        {
          src: "http://img.b2bpic.net/free-photo/mosque-pictures-moroccan-wall-pattern_1203-5080.jpg",
          alt: "mosque pictures moroccan wall pattern",
        },
        {
          src: "http://img.b2bpic.net/free-photo/beautiful-streets-switzerland_8353-9666.jpg",
          alt: "Beautiful streets of Switzerland",
        },
        {
          src: "http://img.b2bpic.net/free-photo/nature-travel-blue-beauty-decoration_1203-4929.jpg",
          alt: "nature travel blue beauty decoration",
        },
        {
          src: "http://img.b2bpic.net/free-photo/entrepreneur-talking-about-investment-real-estate-office-space_482257-91171.jpg",
          alt: "Entrepreneur talking about an investment in real estate office space",
        },
      ]}
      avatarText="Trusted by 500+ clients"
      marqueeItems={[
        {
          type: "text",
          text: "Architectural Excellence",
        },
        {
          type: "text",
          text: "Sustainable Design",
        },
        {
          type: "text",
          text: "On-Time Delivery",
        },
        {
          type: "text",
          text: "Premium Materials",
        },
        {
          type: "text",
          text: "Quality Craftsmanship",
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MetricSplitMediaAbout
      useInvertedBackground={false}
      title="Building Legacies Since 1999"
      description="From bespoke residential homes to large-scale commercial developments, we blend innovative architecture with traditional building mastery."
      metrics={[
        {
          value: "500+",
          title: "Units Delivered",
        },
        {
          value: "30",
          title: "Award Wins",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/engineer-workspace-desk-background-top-view-with-copy-space_554837-884.jpg"
      imageAlt="Construction team reviewing blueprints"
      mediaAnimation="blur-reveal"
      metricsAnimation="slide-up"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardTwelve
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          id: "f1",
          label: "Residential",
          title: "Luxury Home Construction",
          items: [
            "Design & Build",
            "Custom Architectural Design",
            "Interior Finishings",
          ],
        },
        {
          id: "f2",
          label: "Commercial",
          title: "Commercial Development",
          items: [
            "Office Complexes",
            "Retail Spaces",
            "Adaptive Reuse",
          ],
        },
        {
          id: "f3",
          label: "Renovation",
          title: "Expert Renovation",
          items: [
            "Heritage Restoration",
            "Structural Upgrades",
            "Modernization",
          ],
        },
      ]}
      title="Comprehensive Building Services"
      description="Our expertise spans the entire development lifecycle."
    />
  </div>

  <div id="portfolio" data-section="portfolio">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="asymmetric-60-wide-40-narrow"
      useInvertedBackground={false}
      products={[
        {
          id: "p1",
          name: "The Pavilion Residence",
          price: "View Project",
          imageSrc: "http://img.b2bpic.net/free-photo/mix-minimal-nordic-interior-design-with-japanese-wabi-sabi-style_23-2151160111.jpg",
        },
        {
          id: "p2",
          name: "Horizon Heights Complex",
          price: "View Project",
          imageSrc: "http://img.b2bpic.net/free-photo/sunny-summer-morning-young-athletic-woman-doing-handstand-city-park-street-modern-urban-buildings-exercise-outdoors-healthy-lifestyle_146671-15176.jpg",
        },
        {
          id: "p3",
          name: "Urban Courtyard Lofts",
          price: "View Project",
          imageSrc: "http://img.b2bpic.net/free-photo/shot-apartment-building-with-glass-balconies-gershwinlaan-zuidas-amsterdam_181624-4887.jpg",
        },
        {
          id: "p4",
          name: "Heritage Row Townhomes",
          price: "View Project",
          imageSrc: "http://img.b2bpic.net/free-photo/parking-entrance_1150-10839.jpg",
        },
        {
          id: "p5",
          name: "Silicon Terrace Plaza",
          price: "View Project",
          imageSrc: "http://img.b2bpic.net/free-photo/light-wood-wall-design_53876-75115.jpg",
        },
        {
          id: "p6",
          name: "Alpine Ridge Manors",
          price: "View Project",
          imageSrc: "http://img.b2bpic.net/free-photo/architects-looking-plan-front-house_23-2147813100.jpg",
        },
      ]}
      title="Recent Landmark Projects"
      description="Discover the breadth of our design and construction portfolio."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardFourteen
      useInvertedBackground={false}
      title="Efficiency & Integrity"
      tag="Performance Metrics"
      metrics={[
        {
          id: "m1",
          value: "98%",
          description: "Client Satisfaction Rate",
        },
        {
          id: "m2",
          value: "12",
          description: "Average Projects/Year",
        },
        {
          id: "m3",
          value: "50+",
          description: "Certified Partners",
        },
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwo
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",
          name: "Jonathan Reed",
          role: "Property Investor",
          testimonial: "The precision and attention to detail from the team at UrbanBuild transformed our commercial investment into a true landmark.",
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-smiling-woman-with-green-patches-home-looking-camera_197531-32457.jpg",
        },
        {
          id: "t2",
          name: "Sarah Miller",
          role: "Homeowner",
          testimonial: "Building our custom family home was seamless. The professionalism throughout the entire build process exceeded our expectations.",
          imageSrc: "http://img.b2bpic.net/free-photo/group-people-teaming-up-work_23-2148816839.jpg",
        },
        {
          id: "t3",
          name: "David Chen",
          role: "CEO, TechInnovate",
          testimonial: "They delivered our new office campus ahead of schedule and under budget, without sacrificing quality. Exceptional partners.",
          imageSrc: "http://img.b2bpic.net/free-photo/expressive-senior-female-posing-indoor_344912-360.jpg",
        },
        {
          id: "t4",
          name: "Elena Rodriguez",
          role: "Urban Planner",
          testimonial: "Working alongside their team was a pleasure. Their dedication to sustainable building practices is second to none.",
          imageSrc: "http://img.b2bpic.net/free-photo/couple-interacting-color-swatch_1170-832.jpg",
        },
        {
          id: "t5",
          name: "Marcus Thorne",
          role: "Architect",
          testimonial: "As an architect, I rely on builders who respect the design vision. They are meticulous and truly care about the craft.",
          imageSrc: "http://img.b2bpic.net/free-photo/two-people-giving-fist-bump_53876-74889.jpg",
        },
      ]}
      title="What Clients Say"
      description="Building relationships as strong as our structures."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",
          title: "How do you ensure project quality?",
          content: "We maintain strict quality control standards at every phase, using premium materials and expert trade teams.",
        },
        {
          id: "q2",
          title: "Do you provide architectural services?",
          content: "Yes, we work with industry-leading architects or can integrate with your preferred architectural partners.",
        },
        {
          id: "q3",
          title: "What is your approach to sustainability?",
          content: "We prioritize energy-efficient designs, responsible sourcing of materials, and long-term environmental impact reduction.",
        },
      ]}
      title="Frequently Asked Questions"
      description="Common inquiries about our development and construction process."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "plain",
      }}
      tag="Get in Touch"
      title="Start Your Project"
      description="Ready to bring your vision to life? Contact our development team to discuss your next construction project."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoText="UrbanBuild"
      columns={[
        {
          title: "Company",
          items: [
            {
              label: "About Us",
              href: "#about",
            },
            {
              label: "Team",
              href: "#",
            },
            {
              label: "Careers",
              href: "#",
            },
          ],
        },
        {
          title: "Services",
          items: [
            {
              label: "Residential",
              href: "#services",
            },
            {
              label: "Commercial",
              href: "#services",
            },
            {
              label: "Renovation",
              href: "#services",
            },
          ],
        },
        {
          title: "Legal",
          items: [
            {
              label: "Privacy Policy",
              href: "#",
            },
            {
              label: "Terms of Service",
              href: "#",
            },
          ],
        },
      ]}
      copyrightText="© 2024 UrbanBuild Construction. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
