"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterCard from '@/components/sections/footer/FooterCard';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import SplitAbout from '@/components/sections/about/SplitAbout';
import { Clock, Facebook, Image, Instagram, MessageCircle, Palette, Wrench } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="large"
        background="fluid"
        cardStyle="glass-depth"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="layered"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Kitchens",
          id: "/kitchens",
        },
        {
          name: "Bathrooms",
          id: "/bathrooms",
        },
        {
          name: "Renovations",
          id: "/renovations",
        },
        {
          name: "Wardrobes",
          id: "/wardrobes",
        },
        {
          name: "Projects",
          id: "/projects",
        },
        {
          name: "About",
          id: "/about",
        },
      ]}
      brandName="Biotti"
      button={{
        text: "Book Consultation",
        href: "/contact",
      }}
    />
  </div>

  <div id="wardrobes-about" data-section="wardrobes-about">
      <SplitAbout
      textboxLayout="default"
      useInvertedBackground={true}
      imagePosition="right"
      title="Custom Wardrobes & Integrated Storage"
      description="Made-to-measure solutions tailored to your space, maximizing storage and enhancing your home's aesthetic with bespoke cabinetry and intelligent design."
      bulletPoints={[
        {
          title: "Space Optimization",
          description: "Designing custom storage that fits challenging layouts and maximizes every inch.",
        },
        {
          title: "Personalized Interiors",
          description: "Configuring drawers, shelves, and hanging spaces to suit your lifestyle.",
        },
        {
          title: "Exquisite Finishes",
          description: "A wide selection of luxury materials, from fine woods to mirrored panels.",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/3d-rendering-minimal-scandinavian-wood-walk-closet-with-wardrobe_105762-2300.jpg"
      imageAlt="Custom luxury walk-in closet design"
      mediaAnimation="opacity"
    />
  </div>

  <div id="wardrobes-features" data-section="wardrobes-features">
      <FeatureCardTen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "Integrated Lighting",
          description: "Motion-sensor lighting for effortless visibility and a touch of luxury.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/open-kitchen-drawer-with-dishes-inside-everyday-organization_169016-71087.jpg",
            imageAlt: "Wardrobe interior with clever organization",
          },
          items: [
            {
              icon: MessageCircle,
              text: "LED Strips",
            },
            {
              icon: ClipboardCheck,
              text: "Sensor Activation",
            },
          ],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/view-beautifully-decorated-round-table-with-natural-fir-branch-candle-two-flutes-plates-against-classic-sofa-modern-apartment_132075-11394.jpg?_wi=7",
          imageAlt: "wardrobe interior clever organization",
        },
        {
          title: "Customized Accessories",
          description: "Dedicated compartments for jewelry, ties, belts, and other personal items.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-shopping-mall_23-2150585908.jpg",
            imageAlt: "Wardrobe with sliding doors",
          },
          items: [
            {
              icon: DraftingCompass,
              text: "Drawer Organizers",
            },
            {
              icon: Palette,
              text: "Display Shelves",
            },
          ],
          reverse: true,
          imageSrc: "http://img.b2bpic.net/free-photo/realtor-clients-exploring-urban-property-financial-potential_482257-90954.jpg?_wi=5",
          imageAlt: "wardrobe interior clever organization",
        },
        {
          title: "Sliding & Hinged Doors",
          description: "A range of door styles, from sleek sliding panels to elegant hinged options, customized to your room's flow.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/customer-shop-assistant-meeting-fashion-store-sitting-together-using-tablet-discussing-clothes-purchases-consumerism-shopping-concept_74855-11657.jpg",
            imageAlt: "Bespoke wardrobe material samples",
          },
          items: [
            {
              icon: Wrench,
              text: "Mirrored Doors",
            },
            {
              icon: Clock,
              text: "Glass Panels",
            },
          ],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283288.jpg?_wi=5",
          imageAlt: "wardrobe interior clever organization",
        },
      ]}
      title="Bespoke Wardrobe Features"
      description="Discover the craftsmanship and intelligent storage solutions in our custom wardrobes, designed for ultimate organization and style."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoText="Biotti"
      copyrightText="© 2024 Biotti. All rights reserved."
      socialLinks={[
        {
          icon: Facebook,
          href: "#",
          ariaLabel: "Facebook",
        },
        {
          icon: Instagram,
          href: "#",
          ariaLabel: "Instagram",
        },
        {
          icon: Image,
          href: "#",
          ariaLabel: "Pinterest",
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
