import { notFound } from "next/navigation"
import { getHomeworkSubmissionDetails } from "@/modules/homework/data-access"
import { HomeworkGradingView } from "@/modules/homework/components/homework-grading-view"
import { formatDate } from "@/shared/lib/utils"

export const dynamic = "force-dynamic"

export default async function HomeworkSubmissionGradingPage({ params }: { params: Promise<{ submissionId: string }> }) {
  const { submissionId } = await params
  const submission = await getHomeworkSubmissionDetails(submissionId)

  if (!submission) return notFound()

  return (
    <div className="flex h-full flex-col space-y-4 p-6">
      <div className="flex items-center justify-between">
        <div>
          <h2 className="text-2xl font-bold tracking-tight">{submission.assignmentTitle}</h2>
          <div className="flex items-center gap-4 text-sm text-muted-foreground mt-1">
            <span>
              Student: <span className="font-medium text-foreground">{submission.studentName}</span>
            </span>
            <span>•</span>
            <span>Submitted: {submission.submittedAt ? formatDate(submission.submittedAt) : "-"}</span>
            <span>•</span>
            <span className="capitalize">Status: {submission.status}</span>
          </div>
        </div>
      </div>

      <HomeworkGradingView
        submissionId={submission.id}
        studentName={submission.studentName}
        assignmentTitle={submission.assignmentTitle}
        submittedAt={submission.submittedAt}
        status={submission.status}
        totalScore={submission.totalScore}
        answers={submission.answers}
        prevSubmissionId={submission.prevSubmissionId}
        nextSubmissionId={submission.nextSubmissionId}
      />
    </div>
  )
}