ea22c72d-bd2f-407e-b704-e70bc9326383/src/app/page.tsx

"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import { Clock, FileText, GraduationCap, Lightbulb, MessageCircle } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="directional-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="mediumLarge"
        sizing="largeSmall"
        background="none"
        cardStyle="gradient-radial"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarLayoutFloatingInline
            navItems={[
              { name: "الرئيسية", id: "hero" },
              { name: "عن التطبيق", id: "about" },
              { name: "المميزات", id: "features" },
              { name: "الأسئلة", id: "faq" }
            ]}
            brandName="النيلي"
            button={{ text: "ابدأ الآن", href: "#" }}
          />
        </div>

        <div id="hero" data-section="hero">
          <HeroSplit
            background={{ variant: "gradient-bars" }}
            title="مساعدك الذكي في المذاكرة"
            description="تطبيق النيلي يغير مفهوم دراستك، من تنظيم الملاحظات إلى تلخيص المحاضرات المعقدة باستخدام الذكاء الاصطناعي المتطور."
            buttons={[{ text: "ابدأ التجربة مجاناً", href: "#" }]}
            imageSrc="http://img.b2bpic.net/free-photo/world-mental-health-day-awareness-illustration_23-2151859110.jpg"
            mediaAnimation="slide-up"
            avatars={[
              { src: "http://img.b2bpic.net/free-photo/still-life-stacks-papers-documents_23-2151118326.jpg", alt: "student avatar 1" },
              { src: "http://img.b2bpic.net/free-photo/study-focus-with-bible-tabs-scripture-reading_169016-71394.jpg", alt: "student avatar 2" },
              { src: "http://img.b2bpic.net/free-photo/office-coffee-interior-design_23-2151909899.jpg", alt: "student avatar 3" },
              { src: "http://img.b2bpic.net/free-photo/student-holding-textbooks-texting-mates-phone-close-up-studio-background_482257-97642.jpg", alt: "student avatar 4" },
              { src: "http://img.b2bpic.net/free-photo/home-leisure-concept-portrait-beautiful-young-woman-reading-digital-tablet-sitting_1258-202097.jpg", alt: "student avatar 5" }
            ]}
            avatarText="ينضم إلينا آلاف الطلاب يومياً"
            marqueeItems={[
              { type: "text-icon", text: "تلخيص ذكي", icon: Lightbulb },
              { type: "text-icon", text: "تنظيم المحتوى", icon: FileText },
              { type: "text-icon", text: "إجابات فورية", icon: MessageCircle },
              { type: "text-icon", text: "دعم أكاديمي", icon: GraduationCap },
              { type: "text-icon", text: "متاح 24/7", icon: Clock }
            ]}
          />
        </div>

        <div id="about" data-section="about">
          <MetricSplitMediaAbout
            useInvertedBackground={true}
            title="صمم رحلتك الدراسية"
            description="نحن نؤمن بأن كل طالب يستحق أدوات تساعده على التفوق. النيلي يوفر لك منصة متكاملة تشبه notebook lm للتعامل مع وثائقك ومحاضراتك بذكاء."
            metrics={[
              { value: "50k+", title: "طالب يستخدم النيلي" },
              { value: "1M+", title: "ملاحظة تم تلخيصها" }
            ]}
            imageSrc="http://img.b2bpic.net/free-photo/still-life-office-desk-mess_23-2150164858.jpg"
            mediaBadge={{ text: "موثوق من قبل 50,000+ طالب" }}
            mediaAnimation="blur-reveal"
            metricsAnimation="slide-up"
          />
        </div>

        <div id="features" data-section="features">
          <FeatureCardSeven
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            features={[
              { title: "التلخيص التلقائي", description: "حوّل محاضراتك الطويلة إلى نقاط مفيدة.", imageSrc: "http://img.b2bpic.net/free-photo/entrepreneur-analyzing-architectural-sketches-blueprints-his-home_482257-90908.jpg", imageAlt: "AI Summarization" },
              { title: "تنظيم الملاحظات", description: "كل ملفاتك في مكان واحد، مرتبة ومنظمة.", imageSrc: "http://img.b2bpic.net/free-photo/contemporary-room-workplace-office-supplies-concept_53876-147673.jpg", imageAlt: "Notes Organization" },
              { title: "أسئلة وإجابات", description: "اسأل تطبيقك عن أي معلومة في ملفاتك.", imageSrc: "http://img.b2bpic.net/free-vector/gradient-3d-geometric-background_23-2149181500.jpg", imageAlt: "Q&A System" }
            ]}
            title="مميزات ذكية للمذاكرة"
            description="استكشف الأدوات التي ستغير إنتاجيتك الدراسية."
          />
        </div>

        <div id="metrics" data-section="metrics">
          <MetricCardFourteen
            useInvertedBackground={true}
            title="إنجازاتنا"
            tag="تأثيرنا على الطلاب"
            metrics={[
              { id: "m1", value: "90%", description: "تحسن في درجات الاختبارات" },
              { id: "m2", value: "85%", description: "توفير في وقت المذاكرة" },
              { id: "m3", value: "24/7", description: "متاح دائماً لدعمك" }
            ]}
          />
        </div>

        <div id="testimonials" data-section="testimonials">
          <TestimonialCardTen
            textboxLayout="split"
            useInvertedBackground={false}
            testimonials={[
              { id: "1", title: "مذهل", quote: "ساعدني النيلي في اجتياز الامتحانات النهائية بسهولة.", name: "أحمد علي", role: "طالب طب", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-pretty-blond-girl-smiling-camera-carry-backpack-notebooks-papers-studying-learni_1258-115843.jpg" },
              { id: "2", title: "توفير وقت", quote: "أفضل أداة للمذاكرة استخدمتها على الإطلاق.", name: "سارة محمد", role: "طالبة قانون", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-modern-woman-standing-kitchen-with-notebook-reading-documents-smiling_1258-201140.jpg" },
              { id: "3", title: "تنظيم", quote: "تخلصت من فوضى الملاحظات بفضل هذا التطبيق.", name: "خالد عمر", role: "طالب هندسة", imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-library-couch_273609-12733.jpg" },
              { id: "4", title: "ذكاء", quote: "تلخيص الذكاء الاصطناعي دقيق جداً.", name: "ليلى حسن", role: "طالبة علوم", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-daydreaming-library_329181-14852.jpg" },
              { id: "5", title: "توصية", quote: "أنصح به كل طالب يبحث عن تنظيم حياته.", name: "يوسف محمود", role: "طالب إدارة", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-lady-student-showing-thumbs-up_171337-14785.jpg" }
            ]}
            title="آراء طلاب النيلي"
            description="قصص نجاح من مستخدمينا في جميع أنحاء العالم."
          />
        </div>

        <div id="faq" data-section="faq">
          <FaqBase
            textboxLayout="default"
            useInvertedBackground={true}
            faqs={[
              { id: "f1", title: "هل التطبيق مجاني؟", content: "نعم، لدينا خطة أساسية مجانية متاحة لكل الطلاب." },
              { id: "f2", title: "هل يدعم اللغة العربية؟", content: "بالتأكيد، التطبيق مصمم ليدعم اللغة العربية بكفاءة عالية." },
              { id: "f3", title: "هل يمكنني ربط ملفاتي؟", content: "يمكنك رفع ملفات PDF، Word، وروابط الويب بسهولة." }
            ]}
            title="الأسئلة الشائعة"
            faqsAnimation="slide-up"
            description="كل ما تحتاج معرفته عن تطبيق النيلي."
          />
        </div>

        <div id="contact" data-section="contact">
          <ContactText
            useInvertedBackground={false}
            background={{ variant: "sparkles-gradient" }}
            text="هل لديك أي استفسار؟ تواصل معنا اليوم."
            buttons={[{ text: "راسلنا الآن", href: "mailto:hello@nilay.com" }]}
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterBaseReveal
            logoText="النيلي"
            columns={[
              { title: "التطبيق", items: [{ label: "عن التطبيق", href: "#about" }, { label: "المميزات", href: "#features" }] },
              { title: "الدعم", items: [{ label: "الأسئلة الشائعة", href: "#faq" }, { label: "اتصل بنا", href: "#contact" }] },
              { title: "قانوني", items: [{ label: "سياسة الخصوصية", href: "#" }, { label: "شروط الاستخدام", href: "#" }] }
            ]}
            copyrightText="© 2024 النيلي. جميع الحقوق محفوظة."
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}