"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Leaf, Sparkles, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="expand-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="large"
      background="noiseDiagonalGradient"
      cardStyle="solid"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          brandName="De Leon Landscaping"
          navItems={[
            { name: "Home", id: "#hero" },
            { name: "About", id: "#about" },
            { name: "Services", id: "#services" },
            { name: "Packages", id: "#packages" },
            { name: "Testimonials", id: "#testimonials" },
            { name: "Contact", id: "#contact" },
          ]}
        />
      </div>
      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Your Dream Yard Starts Here"
          description="De Leon Landscaping provides exceptional landscape design, installation, and maintenance services to transform your outdoor space into a beautiful oasis."
          background={{ variant: "downward-rays-static-grid" }}
          tag="Expert Landscaping"
          buttons={[
            { text: "Get a Free Estimate", href: "#contact" },
            { text: "View Our Services", href: "#services" },
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/wooden-house-grassy-field-surrounded-by-plants-flowers_181624-13500.jpg"
          imageAlt="luxurious garden design with patio"
        />
      </div>
      <div id="about" data-section="about">
        <MetricSplitMediaAbout
          title="Crafting Beautiful Landscapes Since 2005"
          description="At De Leon Landscaping, we're passionate about creating stunning outdoor environments. Our experienced team delivers personalized service, combining creativity with precision to bring your vision to life. From initial design to meticulous maintenance, we ensure every detail is perfect."
          metrics={[
            { value: "15+", title: "Years Experience" },
            { value: "200+", title: "Projects Completed" },
            { value: "98%", title: "Client Satisfaction" },
          ]}
          useInvertedBackground={true}
          tag="Our Story"
          imageSrc="http://img.b2bpic.net/free-photo/people-helping-neighbors-with-grass-lawn_23-2149139731.jpg"
          imageAlt="landscaping team working on garden"
          mediaAnimation="slide-up"
          metricsAnimation="blur-reveal"
        />
      </div>
      <div id="services" data-section="services">
        <FeatureCardOne
          title="Comprehensive Landscaping Solutions"
          description="We offer a full spectrum of services to keep your property looking its best year-round. Discover how we can enhance your outdoor living experience."
          features={[
            {
              title: "Lawn Care & Maintenance",              description: "From mowing and fertilization to weed control, we keep your lawn healthy and vibrant.",              imageSrc: "http://img.b2bpic.net/free-photo/confident-female-working-with-wheelbarrow-farm_181624-27163.jpg",              imageAlt: "perfectly manicured green lawn"},
            {
              title: "Landscape Design & Installation",              description: "Transform your vision into reality with our custom designs and expert planting services.",              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-man-working-eco-friendly-wind-power-project-with-papers-pencil_23-2148847791.jpg",              imageAlt: "landscape design planning outdoor"},
            {
              title: "Tree & Shrub Care",              description: "Ensure the longevity and beauty of your trees and shrubs with our professional pruning and health services.",              imageSrc: "http://img.b2bpic.net/free-photo/pink-petals-are-covered-with-ground_1372-389.jpg",              imageAlt: "healthy tree and shrub care"},
            {
              title: "Irrigation Systems",              description: "Efficient watering solutions designed to conserve water and promote optimal plant health.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-gardener-watering-plants-with-sprinkler_23-2148396765.jpg",              imageAlt: "automatic irrigation system lawn"},
          ]}
          gridVariant="two-columns-alternating-heights"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          tag="Our Expertise"
        />
      </div>
      <div id="packages" data-section="packages">
        <ProductCardFour
          title="Popular Service Packages"
          description="Explore our curated service packages designed to meet common landscaping needs for every season."
          products={[
            {
              id: "seasonal-cleanup",              name: "Seasonal Cleanup",              price: "$250+",              variant: "Per Season",              imageSrc: "http://img.b2bpic.net/free-photo/view-robot-tending-maintaining-gardens_23-2151803955.jpg",              imageAlt: "seasonal garden cleanup autumn leaves"},
            {
              id: "garden-installation",              name: "Custom Garden Installation",              price: "Starting at $800",              variant: "Project Based",              imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-material-pieces-wooden-boxes_181624-18062.jpg",              imageAlt: "flower garden installation vibrant plants"},
            {
              id: "patio-walkway-design",              name: "Patio & Walkway Design",              price: "Starting at $1,200",              variant: "Project Based",              imageSrc: "http://img.b2bpic.net/free-photo/stepping-stone-garden-path_1252-1027.jpg",              imageAlt: "modern patio design outdoor living"},
            {
              id: "deck-construction",              name: "Deck Construction",              price: "Starting at $2,000",              variant: "Custom Build",              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-holding-crayon_23-2149394464.jpg",              imageAlt: "wooden deck construction backyard"},
            {
              id: "fence-installation",              name: "Fence Installation",              price: "Starting at $900",              variant: "Per Linear Foot",              imageSrc: "http://img.b2bpic.net/free-photo/wooden-fence-garden-full-trees_181624-27357.jpg",              imageAlt: "wooden fence installation garden"},
            {
              id: "lighting-installation",              name: "Landscape Lighting",              price: "Starting at $600",              variant: "Per Fixture",              imageSrc: "http://img.b2bpic.net/free-photo/light-post-with-spiderweb-halloween_53876-138109.jpg",              imageAlt: "outdoor landscape lighting installation"},
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          tag="Tailored Offerings"
        />
      </div>
      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="Our Commitment to Excellence"
          description="We pride ourselves on delivering outstanding results and building lasting relationships with our clients."
          metrics={[
            { id: "m1", icon: Sparkles, title: "Award-Winning Designs", value: "10+" },
            { id: "m2", icon: Users, title: "Happy Clients Annually", value: "500+" },
            { id: "m3", icon: Leaf, title: "Eco-Friendly Practices", value: "100%" },
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          tag="Why Choose Us"
        />
      </div>
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What Our Clients Say"
          description="Hear directly from homeowners who trusted De Leon Landscaping to transform their outdoor spaces."
          testimonials={[
            {
              id: "1",              name: "Damon Butler",              role: "Homeowner",              company: "Local Resident",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/young-family-enjoying-trip_23-2149176465.jpg",              imageAlt: "happy man smiling in garden"},
            {
              id: "2",              name: "Sarah Johnson",              role: "Garden Enthusiast",              company: "Community Member",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/women-taking-care-their-plants-greenhouse_23-2149037249.jpg",              imageAlt: "smiling woman in blooming garden"},
            {
              id: "3",              name: "Michael Chen",              role: "Property Manager",              company: "Estate Solutions",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/old-man-practicing-outdoor-sports_23-2148297544.jpg",              imageAlt: "senior couple enjoying garden"},
            {
              id: "4",              name: "Emily Rodriguez",              role: "New Homeowner",              company: "Residential Client",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/happy-young-smiling-friends-sitting-park-using-smartphones-man-woman-having-fun-together_285396-8880.jpg",              imageAlt: "young couple relaxing in garden"},
            {
              id: "5",              name: "David Kim",              role: "Business Owner",              company: "Local Business",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/blonde-summer-city-with-cup-coffee_1157-35380.jpg",              imageAlt: "professional woman in outdoor setting"},
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          tag="Client Feedback"
        />
      </div>
      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Homeowners and Businesses Alike"
          description="We are proud to serve a diverse clientele across the region, delivering exceptional landscaping services that exceed expectations."
          names={[
            "Residential Estates",            "Local Businesses",            "Community Parks",            "Property Developers",            "HOA Management",            "Commercial Properties",            "School Districts"]}
          textboxLayout="default"
          useInvertedBackground={false}
          tag="Our Valued Partnerships"
        />
      </div>
      <div id="contact" data-section="contact">
        <ContactCTA
          tag="Ready for a Beautiful Yard?"
          title="Let's Create Your Perfect Outdoor Space"
          description="Contact us today for a free consultation and estimate. Our team is ready to answer your questions and help you envision your dream landscape."
          buttons={[{ text: "Get Your Free Estimate", href: "tel:4694092233" }]}
          background={{ variant: "radial-gradient" }}
          useInvertedBackground={true}
        />
      </div>
      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="http://img.b2bpic.net/free-photo/cafe-terrace-overlooking-sea-cloudy-weather_169016-29078.jpg"
          imageAlt="lush green lawn evening light"
          logoText="De Leon Landscaping"
          columns={[
            {
              title: "Services",              items: [
                { label: "Lawn Care", href: "#services" },
                { label: "Design & Install", href: "#services" },
                { label: "Tree & Shrub", href: "#services" },
                { label: "Irrigation", href: "#services" },
              ],
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Testimonials", href: "#testimonials" },
                { label: "Contact", href: "#contact" },
              ],
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
              ],
            },
          ]}
          copyrightText="© 2024 De Leon Landscaping. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}
