c01d1ff5-bcc4-4e1d-8729-86656d903d78/src/app/page.tsx

"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import Link from "next/link";
import { BookOpen, FileText, Users, Send, Heart, Search } from "lucide-react";

export default function HomePage() {
  const navItems = [
    { name: "الرئيسية", id: "home" },
    { name: "الأساتذة", id: "teachers" },
    { name: "المنهج", id: "videos" },
    { name: "الشيتات", id: "sheets" },
    { name: "التليجرام", id: "channels" },
    { name: "مكتبتي", id: "favorites" },
  ];

  const navItemsForFooter = [
    { label: "الرئيسية", href: "/" },
    { label: "الأساتذة", href: "#teachers-featured" },
    { label: "المنهج", href: "/videos" },
    { label: "الشيتات", href: "/sheets" },
    { label: "التليجرام", href: "#channels" },
    { label: "مكتبتي", href: "#favorites" },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="mediumLarge"
      sizing="mediumSizeLargeTitles"
      background="blurBottom"
      cardStyle="glass-depth"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="bold"
    >
      {/* Navbar */}
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="أوائل الشهادة"
          navItems={navItems}
          button={{
            text: "تسجيل دخول",
            href: "/login",
          }}
        />
      </div>

      {/* Hero Section */}
      <div id="hero" data-section="hero">
        <HeroOverlay
          title="أوائل الشهادة"
          description="منصة تعليمية شاملة لطلاب الثانوية العامة توفر شروحات منهجية، أوراق دراسية، قنوات تليجرام تعليمية وتواصل مباشر مع أفضل الأساتذة"
          tag="التعليم الإلكتروني"
          imageSrc="http://img.b2bpic.net/free-photo/joyful-african-american-student-sitting-wooden-table-cafe-surrounded-with-books-exercise-books-laptop-holding-cell-phone-hand-looking-gladly_273609-7477.jpg?_wi=1"
          imageAlt="منصة تعليمية أوائل الشهادة"
          textPosition="bottom-left"
          showBlur={true}
          showDimOverlay={true}
          buttons={[
            {
              text: "ابدأ الآن",
              href: "#teachers-featured",
            },
            {
              text: "تعرف أكثر",
              href: "#about",
            },
          ]}
        />
      </div>

      {/* About Section */}
      <div id="about" data-section="about">
        <TextSplitAbout
          title="عن المنصة"
          description={[
            "أوائل الشهادة هي منصة تعليمية حديثة مصممة خصيصاً لطلاب الثانوية العامة، توفر محتوى تعليمي شامل من أفضل المعلمين المتخصصين في المملكة.",
            "نحن نجمع بين أحدث تقنيات التعليم الإلكتروني والمحتوى التعليمي عالي الجودة لضمان تجربة تعليمية فعالة وممتعة.",
            "من خلال منصتنا، يمكنك الوصول إلى شروحات فيديو متقنة، أوراق دراسية شاملة، قنوات تليجرام متخصصة، والتواصل المباشر مع معلميك المفضلين."
          ]}
          useInvertedBackground={false}
          showBorder={true}
          buttons={[
            {
              text: "اكتشف الأساتذة",
              href: "#teachers-featured",
            },
          ]}
        />
      </div>

      {/* Features Section */}
      <div id="features" data-section="features">
        <FeatureBorderGlow
          title="المميزات الرئيسية"
          description="استكتشف ما يجعل أوائل الشهادة المنصة الأفضل للتعليم الإلكتروني"
          features={[
            {
              icon: BookOpen,
              title: "شروحات المنهج",
              description: "فيديوهات تعليمية عالية الجودة تغطي كل أجزاء المنهج الدراسي بشكل مفصل وسهل الفهم"
            },
            {
              icon: FileText,
              title: "أوراق دراسية",
              description: "ملخصات وملاحظات تفصيلية قابلة للتحميل لمساعدتك على المراجعة والتحضير للاختبارات"
            },
            {
              icon: Users,
              title: "أساتذة متخصصون",
              description: "تواصل مباشر مع أفضل المعلمين المتخصصين في مختلف المواد الدراسية"
            },
            {
              icon: Send,
              title: "قنوات تليجرام",
              description: "انضم إلى قنوات تليجرام متخصصة للحصول على تحديثات يومية ومحتوى حصري"
            },
            {
              icon: Heart,
              title: "المكتبة الشخصية",
              description: "احفظ المحتوى المفضل لديك في مكتبتك الشخصية للعودة إليه في أي وقت"
            },
            {
              icon: Search,
              title: "بحث ذكي",
              description: "ابحث بسهولة عن المحتوى التعليمي الذي تحتاجه بسرعة وكفاءة"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      {/* Teachers Section */}
      <div id="teachers-featured" data-section="teachers-featured">
        <TeamCardSix
          title="الأساتذة المتميزون"
          description="تعرف على أفضل المعلمين المتخصصين في منصتنا"
          tag="فريق التدريس"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          members={[
            {
              id: "1",
              name: "د. أحمد محمود",
              role: "متخصص الرياضيات",
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-man-casual-business-clothes_114579-79355.jpg?_wi=1",
              imageAlt: "د. أحمد محمود"
            },
            {
              id: "2",
              name: "أ. فاطمة السديري",
              role: "متخصصة اللغة العربية",
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-blonde-hair-elegant-employee_1262-2809.jpg?_wi=1",
              imageAlt: "أ. فاطمة السديري"
            },
            {
              id: "3",
              name: "د. محمد الحسن",
              role: "متخصص الفيزياء",
              imageSrc: "http://img.b2bpic.net/free-photo/aged-math-teacher-thinking-chalkboard_23-2148201009.jpg?_wi=1",
              imageAlt: "د. محمد الحسن"
            }
          ]}
        />
      </div>

      {/* Testimonials Section */}
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="تقييمات الطلاب"
          description="اقرأ تجارب الطلاب الحقيقية مع منصة أوائل الشهادة"
          tag="آراء الطلاب"
          textboxLayout="default"
          useInvertedBackground={true}
          testimonials={[
            {
              id: "1",
              name: "محمد علي، طالب الثانوية العامة",
              date: "Date: 15 يناير 2025",
              title: "تحسن ملحوظ في درجاتي",
              quote: "منصة أوائل الشهادة ساعدتني كثيراً في فهم المناهج الصعبة، خاصة مع شرح د. أحمد الممتاز. ارتفعت درجاتي بشكل ملحوظ هذا الفصل.",
              tag: "رياضيات",
              avatarSrc: "http://img.b2bpic.net/free-photo/pretty-young-lady-student-wearing-glasses-with-backpack_171337-14793.jpg",
              imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-lady-student-wearing-glasses-with-backpack_171337-14793.jpg",
              imageAlt: "محمد علي"
            },
            {
              id: "2",
              name: "سارة محمد، طالبة الثانوية العامة",
              date: "Date: 10 يناير 2025",
              title: "المنصة تغيّر طريقة تعليمي",
              quote: "أحب كيف يقدم المعلمون المحتوى هنا بطريقة واضحة وسهلة الفهم. الأوراق الدراسية رائعة جداً والقنوات التليجرام مفيدة جداً.",
              tag: "لغة عربية",
              avatarSrc: "http://img.b2bpic.net/free-photo/thumbs-up_329181-14856.jpg",
              imageSrc: "http://img.b2bpic.net/free-photo/thumbs-up_329181-14856.jpg",
              imageAlt: "سارة محمد"
            },
            {
              id: "3",
              name: "فيصل خالد، طالب الثانوية العامة",
              date: "Date: 5 يناير 2025",
              title: "أفضل منصة تعليمية استخدمتها",
              quote: "جودة الفيديوهات عالية جداً والأساتذة متخصصون وذوي خبرة كبيرة. أنصح جميع أصدقائي باستخدام هذه المنصة.",
              tag: "فيزياء",
              avatarSrc: "http://img.b2bpic.net/free-photo/closeup-photo-young-students-wearing-graduation-cap-holding-tea-cup_114579-92488.jpg",
              imageSrc: "http://img.b2bpic.net/free-photo/closeup-photo-young-students-wearing-graduation-cap-holding-tea-cup_114579-92488.jpg",
              imageAlt: "فيصل خالد"
            },
            {
              id: "4",
              name: "ليلى عبدالله، طالبة الثانوية العامة",
              date: "Date: 1 يناير 2025",
              title: "تجربة تعليمية رائعة",
              quote: "المنصة سهلة الاستخدام والمحتوى منظم بطريقة جيدة جداً. وفرت لي الكثير من الوقت والجهد في البحث عن شروحات جودة.",
              tag: "كيمياء",
              avatarSrc: "http://img.b2bpic.net/free-photo/expressive-student-looking-up_23-2147655911.jpg",
              imageSrc: "http://img.b2bpic.net/free-photo/expressive-student-looking-up_23-2147655911.jpg",
              imageAlt: "ليلى عبدالله"
            }
          ]}
        />
      </div>

      {/* CTA Section */}
      <div id="cta" data-section="cta">
        <ContactSplit
          tag="ابدأ رحلتك التعليمية"
          title="انضم إلى آلاف الطلاب الناجحين"
          description="تسجيل مجاني الآن والوصول الفوري إلى جميع المحتوى التعليمي والأوراق الدراسية والقنوات التليجرام المتخصصة"
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/joyful-african-american-student-sitting-wooden-table-cafe-surrounded-with-books-exercise-books-laptop-holding-cell-phone-hand-looking-gladly_273609-7477.jpg?_wi=2"
          mediaAnimation="slide-up"
          mediaPosition="left"
          inputPlaceholder="أدخل رقم هاتفك"
          buttonText="تسجيل"
          termsText="بالنقر على تسجيل، أنت توافق على شروط استخدام أوائل الشهادة"
          background={{
            variant: "sparkles-gradient"
          }}
        />
      </div>

      {/* Footer */}
      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="http://img.b2bpic.net/free-vector/digital-scientific-technology-banner-design_1055-8058.jpg?_wi=1"
          imageAlt="خلفية تذييل الموقع"
          logoText="أوائل الشهادة"
          copyrightText="© 2025 أوائل الشهادة. جميع الحقوق محفوظة"
          columns={[
            {
              title: "المحتوى",
              items: [
                { label: "الشروحات", href: "/videos" },
                { label: "الأوراق الدراسية", href: "/sheets" },
                { label: "قنوات التليجرام", href: "#channels" },
                { label: "الأساتذة", href: "#teachers-featured" }
              ]
            },
            {
              title: "الحساب",
              items: [
                { label: "تسجيل دخول", href: "/login" },
                { label: "إنشاء حساب", href: "/signup" },
                { label: "مكتبتي", href: "#favorites" },
                { label: "إعدادات الحساب", href: "/settings" }
              ]
            },
            {
              title: "عام",
              items: [
                { label: "عن المنصة", href: "#about" },
                { label: "سياسة الخصوصية", href: "#privacy" },
                { label: "شروط الاستخدام", href: "#terms" },
                { label: "اتصل بنا", href: "#cta" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}