import React from 'react'; import { Head, usePage } from '@inertiajs/react'; import { Trophy, Target, Clock, Repeat, Download } from 'lucide-react'; import AuthenticatedLayout from '@/layouts/AuthenticatedLayout'; import { cn } from '@/lib/utils'; import type { PageProps } from '@/types'; interface LeaderboardEntry { rank: number; student_name: string; grade: number; points: number; attempt_number: number; time_taken_seconds: number; } interface QuizLeaderboardProps extends PageProps { assignment: { id: number; title: string; classes?: Array<{ id: number; name: string }>; material: { title: string; classes?: Array<{ id: number; name: string }>; synced_class: { id: number; name: string } | null; }; }; leaderboard: LeaderboardEntry[]; totalParticipants: number; averageGrade: number; } export default function QuizLeaderboard() { const { assignment, leaderboard, totalParticipants, averageGrade } = usePage().props; const classNames = assignment.classes?.length ? assignment.classes.map((classItem) => classItem.name).join(', ') : assignment.material.classes?.length ? assignment.material.classes.map((classItem) => classItem.name).join(', ') : assignment.material.synced_class?.name ?? '-'; const formatTime = (seconds: number) => { const m = Math.floor(seconds / 60); const s = seconds % 60; return `${m}m ${s}s`; }; const getRankBadge = (rank: number) => { if (rank === 1) return 'bg-yellow-500/20 text-yellow-400 border-yellow-500/30'; if (rank === 2) return 'bg-slate-400/20 text-slate-300 border-slate-400/30'; if (rank === 3) return 'bg-amber-700/20 text-amber-600 border-amber-700/30'; return 'bg-surface border-border/50 text-text-muted'; }; return (
{/* Header */}

{assignment.material.title} • Kelas {classNames}

{totalParticipants}

Peserta

{averageGrade}%

Rata-rata

{/* Leaderboard Table */}
{leaderboard.length > 0 ? ( leaderboard.map((entry) => ( )) ) : ( )}
# Nama Siswa Nilai Attempt Waktu Poin
{entry.rank}
{entry.student_name} {entry.grade}% {entry.attempt_number} {formatTime(entry.time_taken_seconds)} {entry.points.toLocaleString()}

Belum ada peserta.
); }