import type { JSX } from "react"
import { notFound } from "next/navigation"
import { Stethoscope } from "lucide-react"
import { getAuthContext } from "@/shared/lib/auth-guard"
import {
  getStudentMasterySummary,
  getKnowledgePointStats,
} from "@/modules/diagnostic/data-access"
import { getDiagnosticReports } from "@/modules/diagnostic/data-access-reports"
import { StudentDiagnosticView } from "@/modules/diagnostic/components/student-diagnostic-view"
import type { MasteryRadarPoint } from "@/modules/diagnostic/types"

export const dynamic = "force-dynamic"

export default async function StudentDiagnosticPage({
  params,
}: {
  params: Promise<{ studentId: string }>
}): Promise<JSX.Element> {
  const { studentId } = await params
  const ctx = await getAuthContext()

  // DataScope 二次校验：学生只能看自己，家长只能看子女
  if (ctx.dataScope.type === "class_members" && ctx.userId !== studentId) {
    notFound()
  }
  if (ctx.dataScope.type === "children" && !ctx.dataScope.childrenIds.includes(studentId)) {
    notFound()
  }

  const [summary, reports, classStats] = await Promise.all([
    getStudentMasterySummary(studentId),
    getDiagnosticReports({ studentId }),
    getKnowledgePointStats(),
  ])

  // 班级平均掌握度（用于雷达图对比）
  let classAverageMastery: MasteryRadarPoint[] | undefined
  if (summary) {
    classAverageMastery = classStats.map((k) => ({
      knowledgePoint: k.knowledgePointName,
      student: 0,
      classAverage: k.averageMastery,
    }))
  }

  return (
    <div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
      <div>
        <h1 className="flex items-center gap-2 text-2xl font-bold tracking-tight">
          <Stethoscope className="h-6 w-6" aria-hidden="true" />
          Student Diagnostic
        </h1>
        <p className="text-muted-foreground">
          Knowledge point mastery analysis and diagnostic reports.
        </p>
      </div>
      <StudentDiagnosticView
        summary={summary}
        reports={reports}
        classAverageMastery={classAverageMastery}
      />
    </div>
  )
}