Files
encoach_frontend_new_v3/src/pages/admin/AdminStudentProgress.tsx
Yamen Ahmad 88a385ed07 feat: initial frontend codebase — EnCoach v3
React 18 + TypeScript + Vite 5 + Tailwind CSS + shadcn/ui frontend:
- Multi-role auth: student, teacher, admin, corporate, agent, developer
- Student portal: dashboard, courses, adaptive learning, exams, placement
- Teacher portal: courses, assignments, grading, attendance, AI workbench
- Admin portal: 60+ management pages (LMS, exams, users, entities, AI)
- AI-powered features: study coach, generation page, gap analysis, TTS
- Exam system: session, auto-save, results, grading queue
- Full IELTS workflow: reading/listening/writing/speaking modules

Made-with: Cursor
2026-04-11 15:47:32 +04:00

71 lines
2.5 KiB
TypeScript

import { useState } from "react";
import { Card, CardContent } from "@/components/ui/card";
import { Input } from "@/components/ui/input";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
import { useStudentProgressList } from "@/hooks/queries";
import { Search, TrendingUp } from "lucide-react";
export default function AdminStudentProgress() {
const [search, setSearch] = useState("");
const { data, isLoading } = useStudentProgressList();
const items = data?.data ?? data?.items ?? [];
if (isLoading) {
return (
<div className="flex items-center justify-center min-h-[400px]">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-primary" />
</div>
);
}
const q = search.toLowerCase();
const filtered = items.filter((r) => r.student_name?.toLowerCase().includes(q));
return (
<div className="space-y-6">
<div>
<h1 className="text-2xl font-bold flex items-center gap-2">
<TrendingUp className="h-7 w-7" />
Student progress
</h1>
<p className="text-muted-foreground">Attendance, assignments, and marksheets per student.</p>
</div>
<div className="relative max-w-sm">
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
<Input
placeholder="Search students..."
value={search}
onChange={(e) => setSearch(e.target.value)}
className="pl-9"
/>
</div>
<Card>
<CardContent className="pt-6">
<Table>
<TableHeader>
<TableRow>
<TableHead>#</TableHead>
<TableHead>Student</TableHead>
<TableHead>Total Attendance</TableHead>
<TableHead>Total Assignments</TableHead>
<TableHead>Total Marksheets</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{filtered.map((r, i) => (
<TableRow key={r.id}>
<TableCell>{i + 1}</TableCell>
<TableCell className="font-medium">{r.student_name}</TableCell>
<TableCell>{r.total_attendance}</TableCell>
<TableCell>{r.total_assignment}</TableCell>
<TableCell>{r.total_marksheet_line}</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</CardContent>
</Card>
</div>
);
}