import { getTranslations } from "next-intl/server"

import type { StudentDashboardProps } from "@/modules/dashboard/types"

import { DashboardSection } from "../dashboard-section"
import { StudentDashboardHeader } from "./student-dashboard-header"
import { StudentGradesCard } from "./student-grades-card"
import { StudentStatsGrid } from "./student-stats-grid"
import { StudentTodayScheduleCard } from "./student-today-schedule-card"
import { StudentUpcomingAssignmentsCard } from "./student-upcoming-assignments-card"

export async function StudentDashboard({
  studentName,
  enrolledClassCount,
  dueSoonCount,
  overdueCount,
  gradedCount,
  todayScheduleItems,
  upcomingAssignments,
  grades,
}: StudentDashboardProps) {
  const t = await getTranslations("dashboard")
  return (
    <div className="space-y-6">
      <header>
        <StudentDashboardHeader studentName={studentName} />
      </header>

      <DashboardSection variant="stats">
        <StudentStatsGrid
          enrolledClassCount={enrolledClassCount}
          dueSoonCount={dueSoonCount}
          overdueCount={overdueCount}
          gradedCount={gradedCount}
          ranking={grades.ranking}
        />
      </DashboardSection>

      <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
        <section
          aria-label={t("sections.upcomingAssignments")}
          className="lg:col-span-2 space-y-6"
        >
          <DashboardSection variant="list">
            <StudentUpcomingAssignmentsCard upcomingAssignments={upcomingAssignments} />
          </DashboardSection>
          <DashboardSection variant="card">
            <StudentGradesCard grades={grades} />
          </DashboardSection>
        </section>
        <aside aria-label={t("sections.todaySchedule")} className="space-y-6">
          <DashboardSection variant="card">
            <StudentTodayScheduleCard items={todayScheduleItems} />
          </DashboardSection>
        </aside>
      </div>
    </div>
  )
}