feat: implement structured grading system with predefined assessment types
- Add structured grading policy with predefined types (Continuous Assessment, Midterm, Final Test, Exam) - Replace free-text category input with combobox selection in Grading Policy page - Update Lesson Editor to use dropdown selector for grading category assignment - Fix create_grading_category handler to capture organization context - Fix update_course handler to set audit context in database transaction - Implement getImageUrl helper for proper asset path resolution - Add unoptimized prop to organization logo images to bypass Next.js optimization - Add database migrations for organization_id in content tables - Seed default tutorial courses for Admin, Instructor, and Student roles - Fix audit log constraints and content schema issues
This commit is contained in:
@@ -5,9 +5,6 @@ import { useParams, useRouter } from "next/navigation";
|
||||
import { cmsApi, Course, AdvancedAnalytics } from "@/lib/api";
|
||||
import { useAuth } from "@/context/AuthContext";
|
||||
import {
|
||||
LineChart,
|
||||
BarChart3,
|
||||
Users,
|
||||
TrendingUp,
|
||||
ArrowLeft,
|
||||
Layers,
|
||||
@@ -35,9 +32,10 @@ export default function AdvancedAnalyticsPage() {
|
||||
]);
|
||||
setCourse(courseData);
|
||||
setAnalytics(advancedData);
|
||||
} catch (err: any) {
|
||||
} catch (err: unknown) {
|
||||
const message = err instanceof Error ? err.message : "Failed to load data";
|
||||
console.error("Failed to load advanced analytics", err);
|
||||
setError(err.message || "Failed to load data");
|
||||
setError(message);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -170,8 +168,8 @@ export default function AdvancedAnalyticsPage() {
|
||||
<div className="h-4 w-full bg-white/5 rounded-lg overflow-hidden border border-white/5">
|
||||
<div
|
||||
className={`h-full transition-all duration-1000 ${percentage > 80 ? 'bg-indigo-500' :
|
||||
percentage > 50 ? 'bg-indigo-600/70' :
|
||||
'bg-indigo-700/40'
|
||||
percentage > 50 ? 'bg-indigo-600/70' :
|
||||
'bg-indigo-700/40'
|
||||
}`}
|
||||
style={{ width: `${percentage}%` }}
|
||||
/>
|
||||
|
||||
@@ -3,12 +3,9 @@ import { useEffect, useState } from "react";
|
||||
import { cmsApi, Course, Lesson } from "@/lib/api";
|
||||
import { useRouter } from "next/navigation";
|
||||
import {
|
||||
Plus,
|
||||
Calendar,
|
||||
ArrowLeft,
|
||||
ChevronLeft,
|
||||
ChevronRight,
|
||||
Clock,
|
||||
AlertCircle
|
||||
} from "lucide-react";
|
||||
import CourseEditorLayout from "@/components/CourseEditorLayout";
|
||||
@@ -55,12 +52,12 @@ export default function CourseCalendarPage({ params }: { params: { id: string }
|
||||
|
||||
// Padding for first week
|
||||
for (let i = 0; i < firstDay; i++) {
|
||||
days.push(<div key={`empty - ${i} `} className="h-32 border border-white/5 bg-white/2"></div>);
|
||||
days.push(<div key={`empty-${i}`} className="h-32 border border-white/5 bg-white/2"></div>);
|
||||
}
|
||||
|
||||
// Days of month
|
||||
for (let day = 1; day <= daysInMonth; day++) {
|
||||
const dateStr = `${year} -${String(month + 1).padStart(2, '0')} -${String(day).padStart(2, '0')} `;
|
||||
const dateStr = `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
|
||||
const dayLessons = lessons.filter(l => l.due_date && l.due_date.startsWith(dateStr));
|
||||
|
||||
days.push(
|
||||
@@ -70,11 +67,11 @@ export default function CourseCalendarPage({ params }: { params: { id: string }
|
||||
{dayLessons.map(lesson => (
|
||||
<div
|
||||
key={lesson.id}
|
||||
className={`text - [10px] p - 1 rounded truncate flex items - center gap - 1 ${lesson.important_date_type === 'exam' ? 'bg-red-500/20 text-red-400 border border-red-500/30' :
|
||||
lesson.important_date_type === 'assignment' ? 'bg-blue-500/20 text-blue-400 border border-blue-500/30' :
|
||||
lesson.important_date_type === 'live-session' ? 'bg-purple-500/20 text-purple-400 border border-purple-500/30' :
|
||||
'bg-green-500/20 text-green-400 border border-green-500/30'
|
||||
} `}
|
||||
className={`text-[10px] p-1 rounded truncate flex items-center gap-1 ${lesson.important_date_type === 'exam' ? 'bg-red-500/20 text-red-400 border border-red-500/30' :
|
||||
lesson.important_date_type === 'assignment' ? 'bg-blue-500/20 text-blue-400 border border-blue-500/30' :
|
||||
lesson.important_date_type === 'live-session' ? 'bg-purple-500/20 text-purple-400 border border-purple-500/30' :
|
||||
'bg-green-500/20 text-green-400 border border-green-500/30'
|
||||
}`}
|
||||
>
|
||||
<span className="w-1.5 h-1.5 rounded-full bg-current"></span>
|
||||
{lesson.title}
|
||||
@@ -172,10 +169,10 @@ export default function CourseCalendarPage({ params }: { params: { id: string }
|
||||
<div key={lesson.id} className="glass p-4 border-white/5 hover:border-blue-500/30 transition-all group">
|
||||
<div className="flex justify-between items-start">
|
||||
<div>
|
||||
<div className={`text - [10px] font - black uppercase tracking - widest mb - 1 ${lesson.important_date_type === 'exam' ? 'text-red-400' :
|
||||
lesson.important_date_type === 'assignment' ? 'text-blue-400' :
|
||||
'text-green-400'
|
||||
} `}>
|
||||
<div className={`text-[10px] font-black uppercase tracking-widest mb-1 ${lesson.important_date_type === 'exam' ? 'text-red-400' :
|
||||
lesson.important_date_type === 'assignment' ? 'text-blue-400' :
|
||||
'text-green-400'
|
||||
}`}>
|
||||
{lesson.important_date_type || 'Activity'}
|
||||
</div>
|
||||
<h5 className="font-bold group-hover:text-blue-400 transition-colors">{lesson.title}</h5>
|
||||
|
||||
@@ -163,14 +163,18 @@ export default function GradingPolicyPage() {
|
||||
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="text-xs font-semibold text-gray-400 uppercase tracking-widest ml-1">Type Name</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="e.g. Quizzes, Final Exam"
|
||||
<label className="text-xs font-semibold text-gray-400 uppercase tracking-widest ml-1">Assessment Type</label>
|
||||
<select
|
||||
value={newName}
|
||||
onChange={(e) => setNewName(e.target.value)}
|
||||
className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 mt-1.5 focus:outline-none focus:border-blue-500 transition-all text-gray-100"
|
||||
/>
|
||||
className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 mt-1.5 focus:outline-none focus:border-blue-500 transition-all text-gray-100 appearance-none"
|
||||
>
|
||||
<option value="" className="bg-gray-900 text-gray-500">Select a type...</option>
|
||||
<option value="Continuous Assessment" className="bg-gray-900">Continuous Assessment (Min 4)</option>
|
||||
<option value="Midterm" className="bg-gray-900">Midterm</option>
|
||||
<option value="Final Test" className="bg-gray-900">Final Test</option>
|
||||
<option value="Exam" className="bg-gray-900">Exam</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
@@ -193,7 +193,7 @@ export default function LessonEditor({ params }: { params: { id: string; lessonI
|
||||
<div className="flex flex-col md:flex-row justify-between items-start md:items-center gap-6 border-b border-white/5 pb-8">
|
||||
<div className="space-y-1">
|
||||
<div className="flex items-center gap-2 text-[10px] text-blue-500 font-bold uppercase tracking-[0.2em]">
|
||||
<Link href={`/ courses / ${params.id} `} className="hover:text-white transition-colors">Outline</Link>
|
||||
<Link href={`/courses/${params.id}`} className="hover:text-white transition-colors">Outline</Link>
|
||||
<span className="text-gray-700">/</span>
|
||||
<span>Activity</span>
|
||||
</div>
|
||||
@@ -265,28 +265,24 @@ export default function LessonEditor({ params }: { params: { id: string; lessonI
|
||||
|
||||
{isGraded && (
|
||||
<>
|
||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 animate-in zoom-in-95 duration-300">
|
||||
{gradingCategories.length === 0 ? (
|
||||
<div className="col-span-full py-4 text-center border border-dashed border-white/10 rounded-2xl text-xs text-gray-500 italic">
|
||||
No grading categories defined. <Link href={`/ courses / ${params.id} /grading`} className="text-blue-400 underline ml-1">Go to Grading Policy</Link >
|
||||
</div >
|
||||
) : (
|
||||
gradingCategories.map((cat) => (
|
||||
<button
|
||||
key={cat.id}
|
||||
onClick={() => setSelectedCategoryId(cat.id)}
|
||||
className={`p-4 rounded-2xl border transition-all text-left group ${selectedCategoryId === cat.id
|
||||
? "bg-blue-500/10 border-blue-500 text-blue-400"
|
||||
: "bg-white/5 border-white/10 text-gray-500 hover:border-white/20"
|
||||
}`}
|
||||
>
|
||||
<div className="text-[10px] font-bold uppercase tracking-widest opacity-60 mb-1">Category</div>
|
||||
<div className="font-bold truncate">{cat.name}</div>
|
||||
<div className="text-xs mt-2 font-medium opacity-80">{cat.weight}% Weight</div>
|
||||
</button>
|
||||
))
|
||||
)}
|
||||
</div >
|
||||
<div className="col-span-full space-y-2">
|
||||
<span className="text-[10px] font-black uppercase tracking-widest text-gray-500 mb-2 block">Assessment Category</span>
|
||||
<select
|
||||
value={selectedCategoryId}
|
||||
onChange={(e) => setSelectedCategoryId(e.target.value)}
|
||||
className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:border-blue-500 transition-all appearance-none font-bold"
|
||||
>
|
||||
<option value="" className="bg-gray-900 border-0">Select Category...</option>
|
||||
{gradingCategories.map((cat) => (
|
||||
<option key={cat.id} value={cat.id} className="bg-gray-900 border-0">
|
||||
{cat.name} ({cat.weight}%)
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
<div className="text-[10px] text-gray-500 italic mt-1 pl-1">
|
||||
Manage categories in <Link href={`/courses/${params.id}/grading`} className="text-blue-400 hover:underline">Grading Policy</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 pt-6 border-t border-white/5 animate-in fade-in duration-500">
|
||||
<div className="space-y-4">
|
||||
|
||||
Reference in New Issue
Block a user