"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import { Calendar, DollarSign, MessageSquare, Users, Wrench } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="directional-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="small"
        sizing="mediumSizeLargeTitles"
        background="blurBottom"
        cardStyle="inset"
        primaryButtonStyle="flat"
        secondaryButtonStyle="glass"
        headingFontWeight="medium"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Acasă",          id: "/"},
        {
          name: "Programare VTP",          id: "/programare-vtp"},
        {
          name: "Intervenții",          id: "/interventii"},
        {
          name: "Centrale Termice",          id: "/centrale-termice"},
        {
          name: "ENA CONFORT",          id: "/ena-confort"},
        {
          name: "Contact",          id: "/#contact"},
      ]}
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex8KOdTiKTo6wVU9IBbBzQFXCf/uploaded-1781109072417-wp3t2fav.jpg"
      logoAlt="ENA INSTAL Logo"
      button={{
        text: "Login Admin",        href: "/admin"}}
      animateOnLoad={true}
    />
  </div>

  <div id="feature" data-section="feature">
      <FeatureCardNineteen
      textboxLayout="default"
      useInvertedBackground={false}
      title="Funcționalități Panou Admin"
      description="Gestionează eficient operațiunile ENA INSTAL cu instrumente avansate."
      features={[
        {
          tag: "Management",          title: "Administrare Programări",          subtitle: "Vezi și gestionează programările VTP",          description: "O interfață intuitivă pentru vizualizarea, editarea și confirmarea tuturor programărilor de verificare tehnică periodică.",          imageSrc: "http://img.b2bpic.net/free-photo/man-electrical-technician-working-switchboard-with-fuses-uses-tablet_169016-24154.jpg",          imageAlt: "Man an electrical technician working in a switchboard with fuses uses a tablet"},
        {
          tag: "Urmărire",          title: "Monitorizare Intervenții",          subtitle: "Status live pentru solicitările de intervenție",          description: "Urmărește statusul intervențiilor în timp real, de la solicitare până la finalizare, cu detalii despre tehnician și locație.",          imageSrc: "http://img.b2bpic.net/free-photo/hands-preparing-machine-scanning_23-2149341559.jpg",          imageAlt: "Hands preparing machine for scanning"},
        {
          tag: "Catalog",          title: "Gestionează Produse",          subtitle: "Actualizează ofertele de centrale termice",          description: "Adaugă, editează și elimină produse din catalogul de centrale termice, menținând informațiile la zi.",          imageSrc: "http://img.b2bpic.net/free-photo/woman-with-tomato-ktichen_23-2147782435.jpg",          imageAlt: "Woman with tomato in kitchen"},
        {
          tag: "Rapoarte",          title: "Statistici Performanță",          subtitle: "Analizează datele operaționale",          description: "Generează rapoarte detaliate despre volumul de lucru, performanța tehnicienilor și satisfacția clienților.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-heat-pump-outside-home_23-2149250259.jpg",          imageAlt: "Close up on heat pump outside home"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <AboutMetric
      useInvertedBackground={false}
      title="Prezentare Generală Sistem"
      metrics={[
        {
          icon: Calendar,
          label: "Programări Active",          value: "120+"},
        {
          icon: Wrench,
          label: "Intervenții În Curs",          value: "25"},
        {
          icon: Users,
          label: "Clienți Noi (lună)",          value: "45"},
        {
          icon: DollarSign,
          label: "Venit Estimat (lună)",          value: "XXXXX RON"},
        {
          icon: MessageSquare,
          label: "Feedback Nou",          value: "10+"},
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex8KOdTiKTo6wVU9IBbBzQFXCf/uploaded-1781109072417-wp3t2fav.jpg"
      logoAlt="ENA INSTAL Logo"
      logoText="ENA INSTAL"
      leftLink={{
        text: "Confidentialitate",        href: "#"}}
      rightLink={{
        text: "Termeni și Condiții",        href: "#"}}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}