"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
import TeamCardFive from "@/components/sections/team/TeamCardFive";
import FaqBase from "@/components/sections/faq/FaqBase";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { TrendingUp, Users, Clock, Target } from "lucide-react";

export default function DashboardPage() {
  const navItems = [
    { name: "Ana Sayfa", id: "/" },
    { name: "Öğretmenler", id: "/teachers" },
    { name: "Etkinlikler", id: "events" },
    { name: "Çalışma Programı", id: "schedule" },
    { name: "Dashboard", id: "/dashboard" },
  ];

  // Target tracking metrics
  const targetMetrics = [
    {
      id: "1",      value: "85",      title: "%",      description: "Haftalık Hedef İlerleme",      icon: Target,
    },
    {
      id: "2",      value: "12",      title: "Saat",      description: "Bu Ay Ders Saati",      icon: Clock,
    },
    {
      id: "3",      value: "4.8",      title: "/5",      description: "Ortalama Performans",      icon: TrendingUp,
    },
  ];

  // Upcoming lessons
  const upcomingLessons = [
    {
      title: "Matematik - Kalkülüs Temelleri",      description: "Diferansiyel ve integral hesaplamalar üzerine odaklanmış dersin temellerini öğrenin.",      imageSrc: "http://img.b2bpic.net/free-vector/modern-background-with-geometric-shapes_23-2147546962.jpg",      imageAlt: "mathematics calculus lesson",      button: { text: "Derse Katıl", href: "#" },
    },
    {
      title: "İngilizce - Akademik Yazı",      description: "İngilizce akademik yazı ve essay yazma tekniklerini geliştiriniz.",      imageSrc: "http://img.b2bpic.net/free-vector/language-concept-background_23-2147872796.jpg",      imageAlt: "english writing lesson",      button: { text: "Derse Katıl", href: "#" },
    },
    {
      title: "Fizik - Kuantum Mekaniklerine Giriş",      description: "Kuantum fiziğinin temel prensipleri ve uygulamaları.",      imageSrc: "http://img.b2bpic.net/free-photo/crop-men-discussing-graph-tablet_23-2147785037.jpg",      imageAlt: "physics quantum lesson",      button: { text: "Derse Katıl", href: "#" },
    },
    {
      title: "Kimya - Organik Kimya Temelleri",      description: "Organik kimyada karbon bileşikleri ve reaksiyonları.",      imageSrc: "http://img.b2bpic.net/free-photo/close-up-laboratory-test-tubes_23-2148891898.jpg",      imageAlt: "chemistry organic lesson",      button: { text: "Derse Katıl", href: "#" },
    },
  ];

  // Recommended teachers
  const recommendedTeachers = [
    {
      id: "1",      name: "Dr. Ahmet Kara",      role: "Matematik Öğretmeni",      imageSrc: "http://img.b2bpic.net/free-photo/portrait-businessman-office-3_1262-1489.jpg",      imageAlt: "Dr. Ahmet Kara"},
    {
      id: "2",      name: "Prof. Elif Yılmaz",      role: "İngilizce Uzmanı",      imageSrc: "http://img.b2bpic.net/free-photo/young-female-glasses-workplace_1301-980.jpg",      imageAlt: "Prof. Elif Yılmaz"},
    {
      id: "3",      name: "Yrd. Doç. Mustafa Şahin",      role: "Fizik Profesörü",      imageSrc: "http://img.b2bpic.net/free-photo/young-man-wearing-blue-outfit-looking-satisfied_1298-169.jpg",      imageAlt: "Yrd. Doç. Mustafa Şahin"},
    {
      id: "4",      name: "Doç. Dr. Ziya Demir",      role: "Kimya Öğretmeni",      imageSrc: "http://img.b2bpic.net/free-photo/woman-posing-with-books_23-2148680219.jpg",      imageAlt: "Doç. Dr. Ziya Demir"},
  ];

  // Weekly progress data
  const weeklyProgressItems = [
    {
      title: "Pazartesi",      description: "Matematik dersi tamamlandı - 95% başarı oranı",      imageSrc: "http://img.b2bpic.net/free-vector/modern-background-with-geometric-shapes_23-2147546962.jpg",      imageAlt: "Monday progress"},
    {
      title: "Salı",      description: "İngilizce konuşma alıştırması - 88% başarı oranı",      imageSrc: "http://img.b2bpic.net/free-vector/language-concept-background_23-2147872796.jpg",      imageAlt: "Tuesday progress"},
    {
      title: "Çarşamba",      description: "Fizik laboratuvarı deneyi - 92% başarı oranı",      imageSrc: "http://img.b2bpic.net/free-photo/crop-men-discussing-graph-tablet_23-2147785037.jpg",      imageAlt: "Wednesday progress"},
    {
      title: "Perşembe",      description: "Kimya uygulaması tamamlandı - 90% başarı oranı",      imageSrc: "http://img.b2bpic.net/free-photo/close-up-laboratory-test-tubes_23-2148891898.jpg",      imageAlt: "Thursday progress"},
  ];

  const faqData = [
    {
      id: "1",      title: "Dersi nasıl kaydedebilirim?",      content: "Yaklaşan dersler bölümünde istediğiniz dersi bulun ve 'Derse Katıl' düğmesine tıklayın. Sistem sizi otomatik olarak kayıt edecektir."},
    {
      id: "2",      title: "Öğretmeni nasıl değiştirebilirim?",      content: "Ayarlar bölümünden 'Profil' seçeneğine gidin ve 'Tercih Edilen Öğretmen' değişikliğini yapın. Yeni öğretmen size yakında iletişim kuracaktır."},
    {
      id: "3",      title: "Haftalık ilerlememizi nasıl izlerim?",      content: "Dashboard'da 'Haftalık İlerleme' kartını kontrol edin. Günlük aktiviteleriniz ve başarı oranlarınız otomatik olarak güncellenir."},
    {
      id: "4",      title: "Hedefimi nasıl ayarlayabilirim?",      content: "Ana sayfada 'Hedef Ayarla' düğmesine tıklayın ve haftalık öğrenme hedeflerinizi belirleyin. İlerlemeniz gerçek zamanlı olarak izlenecektir."},
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="mediumSizeLargeTitles"
      background="circleGradient"
      cardStyle="layered-gradient"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="layered"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={navItems}
          brandName="Öğretmen Platformu"
          bottomLeftText="Öğrenci Dashboard"
          bottomRightText="dashboard@platform.com"
        />
      </div>

      {/* Target Tracking Card */}
      <div id="targets" data-section="targets">
        <MetricCardOne
          metrics={targetMetrics}
          title="Haftalık Hedef Takibi"
          description="Öğrenme hedefleriniz ve ilerlemeniz"
          gridVariant="uniform-all-items-equal"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
        />
      </div>

      {/* Upcoming Lessons Calendar */}
      <div id="lessons" data-section="lessons">
        <FeatureCardOne
          features={upcomingLessons}
          title="Yaklaşan Dersler"
          description="Planlanmış dersleri görmek ve derse katılmak için tıklayın"
          textboxLayout="default"
          gridVariant="two-columns-alternating-heights"
          animationType="slide-up"
          useInvertedBackground={false}
          carouselMode="buttons"
        />
      </div>

      {/* Recommended Teachers Section */}
      <div id="teachers" data-section="teachers">
        <TeamCardFive
          team={recommendedTeachers}
          title="Tavsiye Edilen Öğretmenler"
          description="Sizin için seçilen deneyimli eğitim uzmanları"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
        />
      </div>

      {/* Weekly Progress Report */}
      <div id="progress" data-section="progress">
        <FeatureCardOne
          features={weeklyProgressItems}
          title="Haftalık İlerleme Raporu"
          description="Bu hafkası hatta adımlarınızı ve başarılarını görmek"
          textboxLayout="default"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          useInvertedBackground={false}
          carouselMode="buttons"
        />
      </div>

      {/* FAQ Section */}
      <div id="faq" data-section="faq">
        <FaqBase
          faqs={faqData}
          title="Sıkça Sorulan Sorular"
          description="Dashboard hakkında sorularınızın cevaplarını bulun"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="Öğretmen Platformu"
          leftLink={{
            text: "Gizlilik Politikası",            href: "#"}}
          rightLink={{
            text: "Kullanım Şartları",            href: "#"}}
        />
      </div>
    </ThemeProvider>
  );
}
