import { Link, Head, router } from '@inertiajs/react';
import { useState } from 'react';
import { CheckSquare, AlertCircle, Clock, FileSignature, Download, Search, School, BookOpen, User, Filter } from 'lucide-react';
import AuthenticatedLayout from '@/layouts/AuthenticatedLayout';
import PeriodSelector from '@/components/PeriodSelector';
import SubjectFilter from '@/components/SubjectFilter';
import { formatDate, cn } from '@/lib/utils';
import { evaluateKktp } from '@/lib/kktp';
import type { PageProps, AcademicYearWithSemesters } from '@/types';
interface Submission {
id: number;
assignment_id: number;
student_id: number;
status: string;
submitted_at: string;
class_name: string;
is_late: boolean;
student: {
id: number;
full_name: string; // Fixed bug from student.name to student.full_name
};
assignment: {
id: number;
title: string;
due_date: string;
material: {
title: string;
subject: {
name: string;
} | null;
synced_class: {
name: string;
} | null;
};
};
}
interface SyncedClass {
id: number;
name: string;
}
interface Subject {
id: number;
name: string;
}
interface SyncedStudent {
id: number;
nisn: string;
full_name: string;
gender: string;
}
interface SimpleAssignment {
id: number;
title: string;
max_points: number;
}
interface SubmissionRecord {
assignment_id: number;
student_id: number;
status: string;
grade: number | null;
is_late: boolean;
}
interface RecapData {
students: SyncedStudent[];
assignments: SimpleAssignment[];
submissions: SubmissionRecord[];
}
interface Props extends PageProps {
submissions: Submission[];
classes: SyncedClass[];
subjects: Subject[];
recapData: RecapData | null;
filters: {
class_id: string | null;
subject_id: string | null;
};
periods?: AcademicYearWithSemesters[];
selectedPeriod?: number | null;
pendingSubjects: Subject[];
selectedPendingSubject: number | null;
}
export default function GradeIndex({ submissions, classes, subjects, recapData, filters, periods, selectedPeriod, pendingSubjects, selectedPendingSubject }: Props) {
const [activeTab, setActiveTab] = useState<'pending' | 'recap'>(filters.class_id ? 'recap' : 'pending');
const [selectedClass, setSelectedClass] = useState(filters.class_id || '');
const [selectedSubject, setSelectedSubject] = useState(filters.subject_id || '');
const getStatusLabel = (status: string, isLate = false, compact = false) => {
switch (status) {
case 'pending':
return {compact ? 'Menunggu' : 'Menunggu Penilaian'}{isLate ? ' ยท Terlambat' : ''};
case 'late':
return {compact ? 'Terlambat' : 'Terlambat (Belum Dinilai)'};
case 'physical_submitted':
return {compact ? 'Tugas Fisik' : 'Tugas Fisik (Belum Dinilai)'};
default:
return {status};
}
};
const handleFilter = (e: React.FormEvent) => {
e.preventDefault();
router.get('/grades', {
class_id: selectedClass,
subject_id: selectedSubject,
academic_year_id: selectedPeriod || '',
pending_subject_id: selectedPendingSubject ?? '',
}, {
preserveState: true,
only: ['recapData', 'filters']
});
};
// Helper to find submission grade/status in matrix
const getGradeCell = (studentId: number, assignmentId: number) => {
if (!recapData) return '-';
const sub = recapData.submissions.find(s => s.student_id === studentId && s.assignment_id === assignmentId);
if (!sub) return -;
if (sub.status === 'graded') {
const kktp = evaluateKktp(sub.grade);
return (
{sub.grade}
);
}
// Status pending/late/physical
if (sub.status === 'physical_submitted') return Fisik;
return Kumpul;
};
// Calculate student average
const getStudentAverage = (studentId: number) => {
if (!recapData || recapData.assignments.length === 0) return '-';
const studentSubs = recapData.submissions.filter(s => s.student_id === studentId && s.status === 'graded');
if (studentSubs.length === 0) return '-';
const sum = studentSubs.reduce((acc, curr) => acc + (curr.grade || 0), 0);
const avg = sum / studentSubs.length;
const kktp = evaluateKktp(avg);
return (
{avg.toFixed(1)}
);
};
return (
<>