"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="mediumLarge"
        sizing="medium"
        background="noise"
        cardStyle="outline"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="layered"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "الرئيسية",
          id: "hero",
        },
        {
          name: "خدماتنا",
          id: "services",
        },
        {
          name: "معرض الأعمال",
          id: "gallery",
        },
        {
          name: "تواصل معنا",
          id: "contact",
        },
      ]}
      brandName="ورشة الألمنيوم"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboard
      background={{
        variant: "gradient-bars",
      }}
      title="حلول الألمنيوم العصرية لمنزلك"
      description="نقدم خدمات تصنيع وتركيب النوافذ والأبواب والمطابخ والواجهات بأعلى معايير الجودة والاحترافية لتضفي على منشأتك لمسة من الفخامة."
      buttons={[
        {
          text: "اطلب استشارة مجانية",
          href: "#contact",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/experienced-worker-is-repairing-metal-parts-machine-tool-busy-factory_613910-5507.jpg?_wi=1"
      imageAlt="ورشة تصنيع ألمنيوم"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/portrait-young-business-woman-talking-phone-while-standing-outside-office-buildings-business-success-concept_58466-12283.jpg",
          alt: "عميلة سعيدة",
        },
        {
          src: "http://img.b2bpic.net/free-photo/beautiful-young-african-american-woman-smiling-cheerful-friendly-face-laughing-confident_839833-29956.jpg",
          alt: "عميلة راضية",
        },
        {
          src: "http://img.b2bpic.net/free-photo/portrait-man-working-office_23-2150771045.jpg",
          alt: "مهندس معماري",
        },
        {
          src: "http://img.b2bpic.net/free-photo/architect-smiling-while-looking-camera_23-2148242957.jpg",
          alt: "خبير فني",
        },
        {
          src: "http://img.b2bpic.net/free-photo/couple-holding-house-sign-made-measuring-tape_329181-9317.jpg",
          alt: "زوجان مسروران",
        },
      ]}
      avatarText="موثوقون من قبل أكثر من 500 عميل"
      marqueeItems={[
        {
          type: "text",
          text: "جودة عالية",
        },
        {
          type: "text",
          text: "دقة في المواعيد",
        },
        {
          type: "text",
          text: "تصاميم مخصصة",
        },
        {
          type: "text",
          text: "ضمان حقيقي",
        },
        {
          type: "text",
          text: "خامات عالمية",
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MetricSplitMediaAbout
      useInvertedBackground={true}
      title="جودة لا تضاهى في صناعة الألمنيوم"
      description="تأسست ورشتنا لتلبية احتياجات السوق من الأبواب والنوافذ والواجهات المعدنية، ونحن نعتمد في عملنا على أفضل الخامات التقنية وأحدث أساليب التصنيع."
      metrics={[
        {
          value: "15+",
          title: "سنوات خبرة",
        },
        {
          value: "500+",
          title: "مشروع مكتمل",
        },
        {
          value: "100%",
          title: "رضا العملاء",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/workman-wearing-har-hat-with-measuring-ruler-factory_1303-26637.jpg?_wi=1"
      imageAlt="صناعة ألمنيوم دقيقة"
      mediaAnimation="slide-up"
      metricsAnimation="slide-up"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardTwelve
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          id: "1",
          label: "نوافذ",
          title: "نوافذ ألمنيوم عازلة",
          items: [
            "تصاميم عصرية",
            "عزل حراري وصوتي",
            "إطار قوي ومتين",
          ],
        },
        {
          id: "2",
          label: "أبواب",
          title: "أبواب مداخل فاخرة",
          items: [
            "أقفال أمان عالية",
            "ألوان متعددة",
            "تصاميم مخصصة",
          ],
        },
        {
          id: "3",
          label: "مطابخ",
          title: "مطابخ ألمنيوم",
          items: [
            "مقاوم للصدأ",
            "سهل التنظيف",
            "مساحات تنظيم ذكية",
          ],
        },
      ]}
      title="خدماتنا المتخصصة"
      description="نقدم حلولاً متكاملة لكافة أعمال الألمنيوم والزجاج لتناسب ذوقك واحتياجاتك الخاصة."
    />
  </div>

  <div id="gallery" data-section="gallery">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      products={[
        {
          id: "1",
          name: "واجهات زجاجية",
          price: "طلبات مخصصة",
          variant: "مشروع فيلا",
          imageSrc: "http://img.b2bpic.net/free-photo/metallic-background-old-stainless-wall_23-2148744338.jpg",
        },
        {
          id: "2",
          name: "قسم داخلي",
          price: "طلبات مخصصة",
          variant: "مكتب أعمال",
          imageSrc: "http://img.b2bpic.net/free-photo/people-relaxing-their-wooden-home_23-2151335790.jpg",
        },
        {
          id: "3",
          name: "درابزين ألمنيوم",
          price: "طلبات مخصصة",
          variant: "عمارة سكنية",
          imageSrc: "http://img.b2bpic.net/free-photo/side-view-fashionable-woman-moving-down-staircase_23-2147925324.jpg",
        },
        {
          id: "4",
          name: "نافذة سحاب",
          price: "طلبات مخصصة",
          variant: "شقة",
          imageSrc: "http://img.b2bpic.net/free-photo/home-still-life-family-paper-cut-concept_23-2148780673.jpg?_wi=1",
        },
        {
          id: "5",
          name: "باب جرار",
          price: "طلبات مخصصة",
          variant: "مطعم",
          imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-businessman_23-2148102454.jpg?_wi=1",
        },
        {
          id: "6",
          name: "خزانة مطبخ",
          price: "طلبات مخصصة",
          variant: "منزل عائلي",
          imageSrc: "http://img.b2bpic.net/free-photo/pullout-drawer-modern-kitchen-led-lighting_169016-69290.jpg?_wi=1",
        },
      ]}
      title="معرض أعمالنا"
      description="شاهد نماذج من أعمالنا المنجزة التي تعكس دقة التنفيذ والتصميم."
    />
  </div>

  <div id="socialProof" data-section="socialProof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "مؤسسة الألمنيوم",
        "مجموعة الزجاج العالمية",
        "حلول البناء",
        "مصانع المعادن المبتكرة",
        "شركات الإنشاءات المحدودة",
        "اتحاد المهندسين",
        "مجموعة التطوير العمراني",
      ]}
      title="شركاؤنا في الجودة"
      description="نحن نعمل مع أفضل الموردين والشركاء لضمان حصولك على منتج يدوم طويلاً."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "1",
          name: "أحمد السعد",
          date: "يناير 2024",
          title: "صاحب فيلا",
          quote: "خدمة ممتازة، التزام تام بالمواعيد ودقة عالية في التركيب.",
          tag: "ممتاز",
          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-smiling-stylish-hipster-lambersexual-model_158538-17986.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/experienced-worker-is-repairing-metal-parts-machine-tool-busy-factory_613910-5507.jpg?_wi=2",
          imageAlt: "portrait happy customer residential building",
        },
        {
          id: "2",
          name: "مها خالد",
          date: "ديسمبر 2023",
          title: "مصممة ديكور",
          quote: "أفضل ورشة تعاملت معها، تشطيبات احترافية جداً.",
          tag: "رائع",
          avatarSrc: "http://img.b2bpic.net/free-photo/male-analyst-looking-his-wristwatch_482257-115129.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/workman-wearing-har-hat-with-measuring-ruler-factory_1303-26637.jpg?_wi=2",
          imageAlt: "portrait happy customer residential building",
        },
        {
          id: "3",
          name: "عمر علي",
          date: "نوفمبر 2023",
          title: "صاحب مطعم",
          quote: "نوافذ الألمنيوم أضافت لمسة جمالية وعزل مثالي للمكان.",
          tag: "محترف",
          avatarSrc: "http://img.b2bpic.net/free-photo/creative-workers-standing-near-work-table-being-happy-finish-their-work_273609-14159.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/home-still-life-family-paper-cut-concept_23-2148780673.jpg?_wi=2",
          imageAlt: "portrait happy customer residential building",
        },
        {
          id: "4",
          name: "سارة ناصر",
          date: "أكتوبر 2023",
          title: "مهندسة معمارية",
          quote: "أعمالهم دقيقة جداً، والالتزام بالتصاميم المحددة كان ممتازاً.",
          tag: "جودة",
          avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-with-helmet_23-2148921381.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-businessman_23-2148102454.jpg?_wi=2",
          imageAlt: "portrait happy customer residential building",
        },
        {
          id: "5",
          name: "خالد المنصور",
          date: "سبتمبر 2023",
          title: "صاحب عمارة",
          quote: "تجربة ممتازة، سأتعامل معهم في المشاريع القادمة بالتأكيد.",
          tag: "مميز",
          avatarSrc: "http://img.b2bpic.net/free-photo/construction-worker-is-ready-start-day-work_329181-11777.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/pullout-drawer-modern-kitchen-led-lighting_169016-69290.jpg?_wi=2",
          imageAlt: "portrait happy customer residential building",
        },
      ]}
      title="ماذا يقول عملاؤنا"
      description="رأي العملاء هو وسامنا، نحن نفخر بتقديم أفضل الخدمات لعملائنا."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "1",
          title: "كم يستغرق تنفيذ المشروع؟",
          content: "يعتمد الوقت على حجم المشروع والتصاميم المطلوبة، ولكننا دائماً نلتزم بجدول زمني دقيق.",
        },
        {
          id: "2",
          title: "هل تقدمون ضماناً على الأعمال؟",
          content: "نعم، نقدم ضماناً كاملاً على جميع أعمال الألمنيوم والتركيب لضمان جودة المنتج.",
        },
        {
          id: "3",
          title: "هل يمكن عمل تصاميم خاصة؟",
          content: "بالتأكيد، لدينا فريق تقني متخصص لتصميم وتنفيذ أي فكرة ترغب بها بدقة عالية.",
        },
      ]}
      title="أسئلة شائعة"
      description="كل ما تحتاج معرفته عن خدماتنا وعمليات التصنيع."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={true}
      background={{
        variant: "gradient-bars",
      }}
      tag="تواصل معنا"
      title="جاهز للبدء في مشروعك القادم؟"
      description="يسعدنا الاستماع لمتطلباتك وتصميم الحل الأمثل لمنشأتك."
      inputPlaceholder="أدخل رقم هاتفك أو واتساب"
      buttonText="تواصل عبر واتساب"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "الشركة",
          items: [
            {
              label: "من نحن",
              href: "#about",
            },
            {
              label: "خدماتنا",
              href: "#services",
            },
          ],
        },
        {
          title: "تواصل",
          items: [
            {
              label: "واتساب",
              href: "#contact",
            },
            {
              label: "موقعنا",
              href: "#",
            },
          ],
        },
        {
          title: "قانوني",
          items: [
            {
              label: "سياسة الخصوصية",
              href: "#",
            },
          ],
        },
      ]}
      bottomLeftText="© 2024 ورشة الألمنيوم"
      bottomRightText="جميع الحقوق محفوظة"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
