"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import FooterCard from '@/components/sections/footer/FooterCard';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import { Facebook, Film, Instagram, Linkedin } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="soft"
        contentWidth="medium"
        sizing="large"
        background="blurBottom"
        cardStyle="glass-elevated"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="layered"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "About Us",
          id: "/about",
        },
        {
          name: "Personal Leasing",
          id: "/personal-leasing",
        },
        {
          name: "Business Leasing",
          id: "/business-leasing",
        },
        {
          name: "Electric Vehicles",
          id: "/electric-vehicles",
        },
        {
          name: "Special Offers",
          id: "/special-offers",
        },
        {
          name: "Vehicle Search",
          id: "/vehicle-search",
        },
        {
          name: "Reviews",
          id: "/reviews",
        },
        {
          name: "FAQ",
          id: "/faq",
        },
        {
          name: "Blog",
          id: "/blog",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      brandName="LINGsCARS"
    />
  </div>

  <div id="ev-showcase" data-section="ev-showcase">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="one-large-left-three-stacked-right"
      useInvertedBackground={false}
      products={[
        {
          id: "ev-product-1",
          name: "Tesla Model 3",
          price: "£499 / month",
          imageSrc: "http://img.b2bpic.net/free-photo/man-white-shirt-is-sitting-hood-car_72229-148.jpg",
          imageAlt: "Tesla Model 3",
        },
        {
          id: "ev-product-2",
          name: "Polestar 2",
          price: "£529 / month",
          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-mean-transportation-ultra-modern-city_23-2151065380.jpg",
          imageAlt: "Polestar 2",
        },
        {
          id: "ev-product-3",
          name: "Hyundai IONIQ 5",
          price: "£479 / month",
          imageSrc: "http://img.b2bpic.net/free-photo/woman-call-glass-phone-booth-with-reflection-car-street_181624-18189.jpg",
          imageAlt: "Hyundai IONIQ 5",
        },
        {
          id: "ev-product-4",
          name: "Kia EV6",
          price: "£489 / month",
          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-couple-spend-time-summer-park_1157-19693.jpg",
          imageAlt: "Kia EV6",
        },
        {
          id: "ev-product-5",
          name: "BMW i4",
          price: "£619 / month",
          imageSrc: "http://img.b2bpic.net/free-photo/attractive-girl-black-dress-standing-outside_23-2147652188.jpg",
          imageAlt: "BMW i4",
        },
        {
          id: "ev-product-6",
          name: "Audi Q4 e-tron",
          price: "£579 / month",
          imageSrc: "http://img.b2bpic.net/free-photo/woman-with-smartphone-beverage-street_23-2147765337.jpg",
          imageAlt: "Audi Q4 e-tron",
        },
      ]}
      title="Electrify Your Drive"
      description="Explore the future of motoring with our extensive range of cutting-edge electric vehicles. Sustainable, silent, and simply superb."
    />
  </div>

  <div id="ev-benefits" data-section="ev-benefits">
      <FeatureCardEight
      textboxLayout="default"
      useInvertedBackground={true}
      features={[
        {
          title: "Lower Running Costs",
          description: "Benefit from cheaper fuel (electricity) and reduced maintenance, saving you money every month.",
          imageSrc: "http://img.b2bpic.net/free-photo/electric-car-charging-sign-low-angle_23-2149530084.jpg",
          imageAlt: "Lower Costs Icon",
        },
        {
          title: "Eco-Friendly Driving",
          description: "Contribute to a greener planet with zero tailpipe emissions, making your commute cleaner and quieter.",
          imageSrc: "http://img.b2bpic.net/free-vector/nfc-technology-use-flat-vector-banner-template_81522-1325.jpg",
          imageAlt: "Eco-Friendly Icon",
        },
        {
          title: "Government Incentives",
          description: "Take advantage of various grants, tax benefits, and lower Benefit-in-Kind (BIK) rates for EVs.",
          imageSrc: "http://img.b2bpic.net/free-photo/mid-section-man-using-digital-tablet-mobile-phone-while-charging-electric-car_107420-94882.jpg",
          imageAlt: "Incentives Icon",
        },
      ]}
      title="The Perks of Electric Car Leasing"
      description="Switching to an EV isn't just a trend; it's a smart move for your wallet and the planet. Discover the electric advantage!"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoSrc="http://img.b2bpic.net/free-vector/abstract-background-design_1040-584.jpg"
      logoAlt="LINGsCARS Logo"
      logoText="LINGsCARS"
      copyrightText="© 2024 LINGsCARS. All rights reserved."
      socialLinks={[
        {
          icon: Facebook,
          href: "https://facebook.com/lingscars",
          ariaLabel: "Facebook",
        },
        {
          icon: Instagram,
          href: "https://instagram.com/lingscars",
          ariaLabel: "Instagram",
        },
        {
          icon: Linkedin,
          href: "https://linkedin.com/company/lingscars",
          ariaLabel: "LinkedIn",
        },
        {
          icon: Film,
          href: "https://youtube.com/lingscars",
          ariaLabel: "YouTube",
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
