127 lines
4.5 KiB
TypeScript
127 lines
4.5 KiB
TypeScript
import Link from "next/link"
|
|
|
|
import { EmptyState } from "@/shared/components/ui/empty-state"
|
|
import { Badge } from "@/shared/components/ui/badge"
|
|
import { Button } from "@/shared/components/ui/button"
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from "@/shared/components/ui/table"
|
|
import { formatDate } from "@/shared/lib/utils"
|
|
import { getDemoStudentUser, getStudentHomeworkAssignments } from "@/modules/homework/data-access"
|
|
import { Inbox } from "lucide-react"
|
|
|
|
export const dynamic = "force-dynamic"
|
|
|
|
const getStatusVariant = (status: string): "default" | "secondary" | "outline" => {
|
|
if (status === "graded") return "default"
|
|
if (status === "submitted") return "secondary"
|
|
if (status === "in_progress") return "secondary"
|
|
return "outline"
|
|
}
|
|
|
|
const getStatusLabel = (status: string) => {
|
|
if (status === "graded") return "Graded"
|
|
if (status === "submitted") return "Submitted"
|
|
if (status === "in_progress") return "In progress"
|
|
return "Not started"
|
|
}
|
|
|
|
const getActionLabel = (status: string) => {
|
|
if (status === "graded") return "Review"
|
|
if (status === "submitted") return "View"
|
|
if (status === "in_progress") return "Continue"
|
|
return "Start"
|
|
}
|
|
|
|
const getActionVariant = (status: string): "default" | "secondary" | "outline" => {
|
|
if (status === "graded" || status === "submitted") return "outline"
|
|
return "default"
|
|
}
|
|
|
|
export default async function StudentAssignmentsPage() {
|
|
const student = await getDemoStudentUser()
|
|
|
|
if (!student) {
|
|
return (
|
|
<div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
|
|
<div className="flex items-center justify-between space-y-2">
|
|
<div>
|
|
<h2 className="text-2xl font-bold tracking-tight">Assignments</h2>
|
|
<p className="text-muted-foreground">Your homework assignments.</p>
|
|
</div>
|
|
</div>
|
|
<EmptyState title="No user found" description="Create a student user to see assignments." icon={Inbox} />
|
|
</div>
|
|
)
|
|
}
|
|
|
|
const assignments = await getStudentHomeworkAssignments(student.id)
|
|
const hasAssignments = assignments.length > 0
|
|
|
|
return (
|
|
<div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
|
|
<div className="flex items-center justify-between space-y-2">
|
|
<div>
|
|
<h2 className="text-2xl font-bold tracking-tight">Assignments</h2>
|
|
<p className="text-muted-foreground">Your homework assignments.</p>
|
|
</div>
|
|
<Button asChild variant="outline">
|
|
<Link href="/student/dashboard">Back</Link>
|
|
</Button>
|
|
</div>
|
|
|
|
{!hasAssignments ? (
|
|
<EmptyState title="No assignments" description="You have no assigned homework right now." icon={Inbox} />
|
|
) : (
|
|
<div className="rounded-md border bg-card">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Title</TableHead>
|
|
<TableHead>Status</TableHead>
|
|
<TableHead>Due</TableHead>
|
|
<TableHead>Attempts</TableHead>
|
|
<TableHead>Score</TableHead>
|
|
<TableHead className="text-right">Action</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{assignments.map((a) => (
|
|
<TableRow key={a.id}>
|
|
<TableCell className="font-medium">
|
|
<Link href={`/student/learning/assignments/${a.id}`} className="hover:underline">
|
|
{a.title}
|
|
</Link>
|
|
</TableCell>
|
|
<TableCell>
|
|
<Badge variant={getStatusVariant(a.progressStatus)} className="capitalize">
|
|
{getStatusLabel(a.progressStatus)}
|
|
</Badge>
|
|
</TableCell>
|
|
<TableCell>{a.dueAt ? formatDate(a.dueAt) : "-"}</TableCell>
|
|
<TableCell className="tabular-nums text-muted-foreground">
|
|
{a.attemptsUsed}/{a.maxAttempts}
|
|
</TableCell>
|
|
<TableCell className="tabular-nums">{a.latestScore ?? "-"}</TableCell>
|
|
<TableCell className="text-right">
|
|
<Button asChild size="sm" variant={getActionVariant(a.progressStatus)}>
|
|
<Link href={`/student/learning/assignments/${a.id}`}>
|
|
{getActionLabel(a.progressStatus)}
|
|
</Link>
|
|
</Button>
|
|
</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|