"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import { Award, Calendar, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="reveal-blur"
        borderRadius="rounded"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Services",
          id: "/services",
        },
        {
          name: "Gallery",
          id: "/gallery",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      brandName="High Rise Roofing"
    />
  </div>

  <div id="services-body" data-section="services-body">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      products={[
        {
          id: "p1",
          name: "Installation",
          price: "Get Quote",
          imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=3",
        },
        {
          id: "p2",
          name: "Repair",
          price: "Get Quote",
          imageSrc: "http://img.b2bpic.net/free-photo/i-phrase-embedded-grey-tissue_114579-18369.jpg?_wi=2",
        },
        {
          id: "p3",
          name: "Inspection",
          price: "Get Quote",
          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg?_wi=2",
        },
        {
          id: "p4",
          name: "Flat Roofs",
          price: "Get Quote",
          imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=4",
        },
        {
          id: "p5",
          name: "Skylights",
          price: "Get Quote",
          imageSrc: "http://img.b2bpic.net/free-photo/i-phrase-embedded-grey-tissue_114579-18369.jpg?_wi=3",
        },
        {
          id: "p6",
          name: "Ventilation",
          price: "Get Quote",
          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg?_wi=3",
        },
      ]}
      title="Comprehensive Roofing Services"
      description="Everything your property needs to stay protected and durable."
    />
  </div>

  <div id="about" data-section="about">
      <AboutMetric
      useInvertedBackground={false}
      title="Our Expertise"
      metrics={[
        {
          icon: Award,
          label: "Projects Completed",
          value: "800+",
        },
        {
          icon: Users,
          label: "Team Members",
          value: "25",
        },
        {
          icon: Calendar,
          label: "Operating Since",
          value: "2014",
        },
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="High Rise Roofing"
      columns={[
        {
          title: "Services",
          items: [
            {
              label: "Installation",
              href: "/services",
            },
            {
              label: "Repairs",
              href: "/services",
            },
            {
              label: "Inspections",
              href: "/services",
            },
          ],
        },
        {
          title: "Company",
          items: [
            {
              label: "About Us",
              href: "/about",
            },
            {
              label: "Our Work",
              href: "/gallery",
            },
            {
              label: "Contact",
              href: "/contact",
            },
          ],
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
