diff --git a/src/app/(protected)/dashboard/page.tsx b/src/app/(protected)/dashboard/page.tsx
index ca3c0517..a5a40d6a 100644
--- a/src/app/(protected)/dashboard/page.tsx
+++ b/src/app/(protected)/dashboard/page.tsx
@@ -13,8 +13,8 @@ export const dynamic = 'force-dynamic';
export const metadata: Metadata = {
title: "Dashboard",
robots: {
- index: true,
- follow: true,
+ index: false,
+ follow: false,
},
};
diff --git a/src/app/(protected)/layout.tsx b/src/app/(protected)/layout.tsx
index 88acce21..99f68988 100644
--- a/src/app/(protected)/layout.tsx
+++ b/src/app/(protected)/layout.tsx
@@ -59,7 +59,13 @@ export default function ProtectedLayout({
};
}, [scrollY, isHidden]);
- const { error: institutionError, isLoading: institutionLoading } = useInstitutions();
+ // useInstitutions is also called inside ; React Query deduplicates the
+ // network request so there is no extra fetch here. We only subscribe to it at
+ // the layout level so that React Query starts pre-fetching institutions during
+ // the auth-check phase, giving the Navbar data sooner. The layout itself does
+ // NOT gate on institution loading/error — a failed institution fetch should
+ // never make the entire protected area inaccessible.
+ useInstitutions();
useEffect(() => {
let active = true;
@@ -67,20 +73,21 @@ export default function ProtectedLayout({
const checkUser = async () => {
try {
const { data: { user }, error } = await supabaseRef.current.auth.getUser();
- // Handle auth session missing errors - redirect to login
+ // Handle auth session missing errors — force full logout to clear cookies/storage
if (error) {
if (isAuthSessionMissingError(error)) {
active = false;
- router.replace("/");
+ await handleLogout();
return;
}
throw error;
}
- // If no Supabase user, redirect to public landing
+ // No Supabase user means the session is gone — force full logout so httpOnly
+ // cookies (ezygo_access_token, CSRF) and client storage are properly cleared
if (!user) {
active = false;
- router.replace("/");
+ await handleLogout();
return;
}
@@ -115,7 +122,7 @@ export default function ProtectedLayout({
// Determine if we should show content or loading
const isAuthorized = authState === 'authorized';
- const showLoading = authState === 'checking' || !isAuthorized || institutionLoading || institutionError;
+ const showLoading = authState === 'checking' || !isAuthorized;
return (
diff --git a/src/app/(protected)/scores/ScoresClient.tsx b/src/app/(protected)/scores/ScoresClient.tsx
new file mode 100644
index 00000000..104eee1a
--- /dev/null
+++ b/src/app/(protected)/scores/ScoresClient.tsx
@@ -0,0 +1,987 @@
+"use client";
+
+import { useState, useMemo, useCallback, useEffect } from "react";
+import {
+ LazyMotion,
+ domAnimation,
+ m as motion,
+ AnimatePresence,
+} from "framer-motion";
+import {
+ GraduationCap,
+ FileText,
+ Clock,
+ BookOpen,
+ AlertCircle,
+ RefreshCw,
+ X,
+ ChevronRight,
+ HelpCircle,
+} from "lucide-react";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import {
+ Card,
+ CardContent,
+ CardHeader,
+ CardTitle,
+} from "@/components/ui/card";
+import { Loading } from "@/components/loading";
+import { useExams, useExamAnswers, useExamQuestions, useAllExamAnswers, useAllExamQuestions } from "@/hooks/courses/exams";
+import type { Exam, ExamAnswer, ExamQuestion } from "@/types";
+import { cn } from "@/lib/utils";
+
+// ─── Helpers ────────────────────────────────────────────────────────────────
+
+type ActivityFilter = "all" | "assessment" | "assignment";
+
+function formatDate(dateStr: string | null): string {
+ if (!dateStr) return "—";
+ try {
+ const d = new Date(dateStr);
+ if (isNaN(d.getTime())) return "—";
+ return d.toLocaleDateString("en-IN", {
+ day: "2-digit",
+ month: "short",
+ year: "numeric",
+ });
+ } catch {
+ return "—";
+ }
+}
+
+function getExamDate(exam: Exam): string | null {
+ return exam.starts_at ?? exam.end_at ?? null;
+}
+
+function getMaxMark(exam: Exam): string | null {
+ const fromSettings = exam.settings?.questionPaperMaximumMark;
+ if (fromSettings) return fromSettings;
+ if (exam.maximum_mark != null) return String(exam.maximum_mark);
+ return null;
+}
+
+function getScore(exam: Exam): number | null {
+ return exam.participants?.[0]?.pivot?.score ?? null;
+}
+
+function getCourseName(exam: Exam): string {
+ const c = exam.course?.[0];
+ if (!c) return "—";
+ return c.code ? `${c.code} – ${c.name}` : c.name;
+}
+
+function getScoreColorClass(score: number, max: number) {
+ const pct = (score / max) * 100;
+ if (pct >= 75) return { text: "text-green-400", bar: "bg-green-500" };
+ if (pct >= 50) return { text: "text-yellow-400", bar: "bg-yellow-500" };
+ return { text: "text-red-400", bar: "bg-red-500" };
+}
+
+/**
+ * Groups an array of exams by their primary course, preserving order within each group.
+ * Returns an ordered array of { id, label, exams } so rendering stays deterministic.
+ */
+function groupByCourse(
+ exams: Exam[]
+): { id: string; label: string; exams: Exam[] }[] {
+ const order: string[] = [];
+ const map = new Map();
+ for (const exam of exams) {
+ const course = exam.course?.[0];
+ const key = course ? String(course.id) : "__none__";
+ const label = course
+ ? course.code
+ ? `${course.code} – ${course.name}`
+ : course.name
+ : "Unknown Course";
+ if (!map.has(key)) {
+ map.set(key, { id: key, label, exams: [] });
+ order.push(key);
+ }
+ map.get(key)!.exams.push(exam);
+ }
+ return order.map((k) => map.get(k)!);
+}
+
+// ─── Score Card ──────────────────────────────────────────────────────────────
+
+function ScoreCard({
+ exam,
+ index,
+ onClick,
+ resolvedScore,
+ resolvedMaxMark,
+}: {
+ exam: Exam;
+ index: number;
+ onClick: () => void;
+ resolvedScore?: number;
+ resolvedMaxMark?: number;
+}) {
+ // Prefer score computed from examanswers (fetched when drawer was opened)
+ // over participants[0].pivot.score which the API often leaves null.
+ const score = resolvedScore ?? getScore(exam);
+ // getMaxMark reads exam-level API fields that are frequently null;
+ // fall back to resolvedMaxMark (summed from examquestions).
+ const apiMaxMark = getMaxMark(exam);
+ const maxNum = apiMaxMark ? parseFloat(apiMaxMark) : (resolvedMaxMark ?? null);
+ const maxMark = apiMaxMark ?? (resolvedMaxMark != null ? String(resolvedMaxMark) : null);
+ const date = getExamDate(exam);
+ const isAssessment = exam.activity_type === "assessment";
+ const colors =
+ score != null && maxNum != null && maxNum > 0
+ ? getScoreColorClass(score, maxNum)
+ : null;
+
+ return (
+
+ (e.key === "Enter" || e.key === " ") && onClick()}
+ aria-label={`View details for ${exam.name}`}
+ >
+
+
+
+
+ {exam.name}
+
+ {exam.summary && (
+
+ {exam.summary}
+
+ )}
+
+
+ {exam.activity_type}
+
+
+
+
+ {getCourseName(exam)}
+
+
+
+ {/* Score row */}
+
+ {score != null ? (
+
+
+ {score}
+
+ {maxMark && (
+
+ / {maxMark}
+
+ )}
+
+ ) : (
+
+
+ Pending
+
+ )}
+
+ {date && (
+
+ {formatDate(date)}
+
+ )}
+
+ View details
+
+
+
+
+
+ );
+}
+
+// ─── Exam Detail Drawer ───────────────────────────────────────────────────────
+
+/**
+ * A single row in the per-question breakdown table.
+ * Receives the question (always present) and the matching answer (may be
+ * undefined when the exam has not been graded yet — "unmarked" case).
+ */
+function QuestionRow({
+ question,
+ answer,
+ index,
+}: {
+ question: ExamQuestion;
+ answer: ExamAnswer | undefined;
+ index: number;
+}) {
+ const maxNum = parseFloat(question.maximum_mark);
+ const scored = answer?.score != null;
+ const scoreNum = scored ? parseFloat(answer!.score!) : null;
+
+ const chipClass =
+ scoreNum != null
+ ? scoreNum === 0
+ ? "bg-red-500/20 text-red-300 border-red-500/30"
+ : scoreNum >= maxNum
+ ? "bg-green-500/20 text-green-300 border-green-500/30"
+ : "bg-yellow-500/20 text-yellow-300 border-yellow-500/30"
+ : "bg-white/10 text-muted-foreground border-white/10";
+
+ const displayScore =
+ scoreNum != null
+ ? Number.isInteger(scoreNum)
+ ? String(scoreNum)
+ : scoreNum.toFixed(1)
+ : "—";
+
+ return (
+
+ {/* Q-number badge */}
+
+
+ Q{question.question_no}
+
+
+
+ {/* Per-question bar + max */}
+
+ {scoreNum != null && maxNum > 0 ? (
+
+
= maxNum
+ ? "bg-green-500"
+ : "bg-yellow-500"
+ )}
+ style={{ width: `${Math.min(100, (scoreNum / maxNum) * 100)}%` }}
+ />
+
+ ) : (
+
+ )}
+
+
+ {/* Score / max */}
+
+
+ {displayScore}
+
+
+ /{question.maximum_mark}
+
+
+
+ );
+}
+
+function ExamDetailDrawer({
+ exam,
+ onClose,
+}: {
+ exam: Exam;
+ onClose: () => void;
+}) {
+ const {
+ data: answers,
+ isLoading: answersLoading,
+ isError: answersError,
+ } = useExamAnswers(exam.id);
+
+ const {
+ data: questions,
+ isLoading: questionsLoading,
+ isError: questionsError,
+ } = useExamQuestions(exam.id);
+
+ const isLoading = answersLoading || questionsLoading;
+ const isError = answersError || questionsError;
+
+ /**
+ * Build a lookup map: examquestion_id → ExamAnswer for O(1) join.
+ * Both arrays may be undefined while loading.
+ */
+ const answerByQuestionId = useMemo(() => {
+ const map = new Map
();
+ if (answers) {
+ for (const a of answers) map.set(a.examquestion_id, a);
+ }
+ return map;
+ }, [answers]);
+
+ /**
+ * Sorted questions (by question_no ascending, numeric sort).
+ */
+ const sortedQuestions = useMemo(() => {
+ if (!questions) return [];
+ return [...questions].sort(
+ (a, b) => Number(a.question_no) - Number(b.question_no)
+ );
+ }, [questions]);
+
+ /**
+ * Computed total from actual answer scores (works for marked exams).
+ * null when no answers are present (exam not yet graded).
+ */
+ const computedTotal = useMemo(() => {
+ if (!answers || answers.length === 0) return null;
+ // Return null when none of the answers have been graded yet.
+ const hasAnyScore = answers.some((a) => a.score != null);
+ if (!hasAnyScore) return null;
+ return answers.reduce(
+ (sum, a) => sum + (a.score != null ? parseFloat(a.score) : 0),
+ 0
+ );
+ }, [answers]);
+
+ /**
+ * Total possible marks derived from the question paper
+ * (sum of question.maximum_mark across all questions).
+ * More reliable than exam.settings.questionPaperMaximumMark.
+ */
+ const totalPossible = useMemo(() => {
+ if (!questions || questions.length === 0) return null;
+ return questions.reduce(
+ (sum, q) => sum + parseFloat(q.maximum_mark),
+ 0
+ );
+ }, [questions]);
+
+ const totalColors =
+ computedTotal != null && totalPossible != null && totalPossible > 0
+ ? getScoreColorClass(computedTotal, totalPossible)
+ : null;
+
+ const isMarked = answers !== undefined && answers.length > 0;
+
+ // Close on Esc
+ useEffect(() => {
+ const handleKey = (e: KeyboardEvent) => {
+ if (e.key === "Escape") onClose();
+ };
+ window.addEventListener("keydown", handleKey);
+ return () => window.removeEventListener("keydown", handleKey);
+ }, [onClose]);
+
+ // Prevent body scroll while open.
+ // Both and must be locked because different browsers/environments
+ // (iOS Safari, Next.js scroll restoration) use different scroll roots.
+ useEffect(() => {
+ const { documentElement, body } = document;
+ const prevHtml = documentElement.style.overflow;
+ const prevBody = body.style.overflow;
+ documentElement.style.overflow = "hidden";
+ body.style.overflow = "hidden";
+ return () => {
+ documentElement.style.overflow = prevHtml;
+ body.style.overflow = prevBody;
+ };
+ }, []);
+
+ const isAssessment = exam.activity_type === "assessment";
+
+ return (
+ <>
+ {/* Backdrop */}
+
+
+ {/* Panel — slides in from the right */}
+
+ {/* Drawer header */}
+
+
+
+
+ {exam.activity_type}
+
+ {!isLoading && !isMarked && (
+
+ Pending marks
+
+ )}
+
+
+ {exam.name}
+
+
+ {getCourseName(exam)}
+
+
+
+
+
+ {/* Loading */}
+ {isLoading && (
+
+
+
+ )}
+
+ {/* Error */}
+ {isError && !isLoading && (
+
+
+
+ Could not load question breakdown.
+
+
+ )}
+
+ {/* Question rows — shown for both marked and unmarked exams */}
+ {!isLoading && !isError && sortedQuestions.length > 0 && (
+ <>
+
+ {isMarked ? "Per-question breakdown" : "Question paper"}
+
+
+ {sortedQuestions.map((q, i) => (
+
+ ))}
+
+
+ )}
+
+ {/* No questions at all */}
+ {!isLoading && !isError && sortedQuestions.length === 0 && (
+
+
+
+ No question data available.
+
+
+ )}
+
+
+
+ Total Score
+
+
+
+ {Number.isInteger(computedTotal)
+ ? computedTotal
+ : computedTotal.toFixed(2)}
+
+
+ /{totalPossible % 1 === 0 ? totalPossible : totalPossible.toFixed(1)}
+
+
+
+ {totalPossible > 0 && (
+
+ )}
+
+
+
+ );
+ }
+
+ return (
+
+
+
+ {/* Header */}
+
+
+
+
+
+
+ Scores
+
+
+ Your assessments and assignments
+
+
+
+ {/* Stats strip */}
+ {stats && (
+
+ {[
+ { label: "Total", value: String(stats.total) },
+ { label: "Scored", value: String(stats.scored) },
+ { label: "Pending", value: String(stats.pending) },
+ { label: "Avg Score", value: stats.avg != null ? `${stats.avg}%` : "—" },
+ ].map((s) => (
+
+
+ {s.value}
+
+
+ {s.label}
+
+
+ )}
+
+ {/* Filter tabs + refresh */}
+
+ {TABS.map((tab) => (
+
+ ))}
+
+
+
+
+
+
+ {/* Error state */}
+ {isError && (
+
+
+
+ Failed to load scores. Please try again.
+
+
+
+ )}
+
+ {/* Empty state */}
+ {!isError && !isLoading && filtered.length === 0 && (
+
+
+
+ No{" "}
+ {filter !== "all" ? filter + "s" : "exams"} found
+
+
+ )}
+
+ {/* Cards grouped by course */}
+ {!isError && filtered.length > 0 && (() => {
+ const groups = groupByCourse(filtered);
+ let globalIndex = 0;
+ return (
+
+
+ {groups.map((group) => {
+ const nAssessments = group.exams.filter((e) => e.activity_type === "assessment").length;
+ const nAssignments = group.exams.filter((e) => e.activity_type === "assignment").length;
+ const countLabel =
+ nAssessments > 0 && nAssignments > 0
+ ? `${nAssessments} assessment${nAssessments !== 1 ? "s" : ""} · ${nAssignments} assignment${nAssignments !== 1 ? "s" : ""}`
+ : nAssessments > 0
+ ? `${nAssessments} assessment${nAssessments !== 1 ? "s" : ""}`
+ : `${nAssignments} assignment${nAssignments !== 1 ? "s" : ""}`;
+ return (
+
+ {/* Course heading */}
+
+
+
+ {group.label}
+
+
+
+ {countLabel}
+
+
+
+
+ {group.exams.map((exam) => {
+ const idx = globalIndex++;
+ return (
+ setSelectedExam(exam)}
+ resolvedScore={resolvedScores[exam.id]}
+ resolvedMaxMark={resolvedMaxMarks[exam.id]}
+ />
+ );
+ })}
+
+
+ );
+ })()}
+
{children}
,
+ },
+ LazyMotion: ({ children }: any) => <>{children},
+ domAnimation: {},
+ AnimatePresence: ({ children }: any) => <>{children},
+}))
+
+vi.mock('@/components/loading', () => ({
+ Loading: () => ,
+}))
+
+vi.mock('@/hooks/courses/exams', () => ({
+ useExams: vi.fn(),
+ useAllExamAnswers: vi.fn(),
+ useAllExamQuestions: vi.fn(),
+ useExamAnswers: vi.fn(),
+ useExamQuestions: vi.fn(),
+}))
+
+// ─── Fixtures ────────────────────────────────────────────────────────────────
+
+const makeCourse = (id = 10, code = 'CS301', name = 'Data Structures') => ({
+ id,
+ si_no: 1,
+ name,
+ code,
+ department_course_code: null,
+ start_year: null,
+ end_year: null,
+ institution_id: 1,
+ usersubgroup_id: 1,
+ created_by: 1,
+ created_at: '',
+ updated_at: '',
+ academic_year: '2026',
+ academic_semester: '6',
+ pre_requisites: null,
+ ltp_credits: null,
+ reference_docs: null,
+ text_books: null,
+ course_type_id: 1,
+ course_category_id: null,
+ deleted_at: null,
+ enable_laboratory: null,
+ pivot: { exam_id: 1, course_id: id },
+ usersubgroup: { id: 1, si_no: '1', name: 'CS', description: null, code: 'CS', scheme: 'A', type: null, end_date: '', start_date: '', start_year: '', end_year: '', usergroup_id: 1, programme_config_group_id: 1, institution_id: 1, created_by: 1, deleted_at: null, created_at: '', updated_at: '', academic_year: '', academic_semester: '', usergroup: { id: 1, name: 'UG', description: null, code: 'UG', affiliated_university: '', scheme: 'A' } },
+})
+
+const makeParticipant = (score: number | null = null) => ({
+ id: 1,
+ starts_at: null,
+ end_at: null,
+ exam_id: 1,
+ pivot: { exam_id: 1, institution_user_id: 1, starts_at: null, end_at: null, score, comments: null, absent_enable: 0 },
+})
+
+const makeExam = (overrides: Partial = {}): Exam => ({
+ id: 1,
+ name: 'Midterm Exam',
+ activity_type: 'assessment',
+ summary: null,
+ starts_at: '2026-01-15T10:00:00.000Z',
+ end_at: null,
+ return_at: null,
+ limitted_time_seconds: null,
+ category_id: null,
+ respond_after_close: 0,
+ offline_activity: 0,
+ maximum_mark: null,
+ negative_mark: null,
+ positive_mark: null,
+ hidden: 0,
+ is_objective_only: 0,
+ shuffle_questions: 0,
+ shuffle_choices: 0,
+ exclude_from_report: 0,
+ ordered_choice_list: 0,
+ auto_evaluation: 0,
+ publish_result: 0,
+ max_co_scores: null,
+ co_score_evaluation: 0,
+ institution_id: 1,
+ settings: null,
+ course_id: 10,
+ created_by: 1,
+ created_at: '',
+ updated_at: '',
+ deleted_at: null,
+ course: [makeCourse() as any],
+ activity_name: null,
+ activity_name_id: null,
+ participants: [makeParticipant()],
+ ...overrides,
+})
+
+const makeAnswer = (id: number, questionId: number, score: string | null = '5.000'): ExamAnswer => ({
+ id,
+ answer: null,
+ score,
+ choice_id: null,
+ examquestion_id: questionId,
+ student_id: 1,
+ created_by: 1,
+ created_at: '',
+ updated_at: '',
+ files: [],
+})
+
+const makeQuestion = (id: number, no: string, maxMark: string): ExamQuestion => ({
+ id,
+ question_no: no,
+ name: `Q${no}`,
+ question: [],
+ summary: null,
+ difficulty_level: null,
+ type: 'Theory',
+ evaluation_scheme: null,
+ allow_descriptive: 1,
+ allow_attachment_answer: 0,
+ answer_required: 1,
+ maximum_mark: maxMark,
+ blooms_taxonamy_level: null,
+ section_id: null,
+ module_id: 1,
+ exam_id: 1,
+ institution_id: 1,
+ created_by: 1,
+ created_at: '',
+ updated_at: '',
+ orquestion_group_id: null,
+ subquestion_parent_id: null,
+ files: [],
+ choices: [],
+ course_outcome: [],
+ programme_outcome: [],
+ programme_specific_outcome: [],
+})
+
+// ─── Helper: set up hook returns ─────────────────────────────────────────────
+
+import {
+ useExams,
+ useAllExamAnswers,
+ useAllExamQuestions,
+ useExamAnswers,
+ useExamQuestions,
+} from '@/hooks/courses/exams'
+
+const mockUseExams = vi.mocked(useExams)
+const mockUseAllExamAnswers = vi.mocked(useAllExamAnswers)
+const mockUseAllExamQuestions = vi.mocked(useAllExamQuestions)
+const mockUseExamAnswers = vi.mocked(useExamAnswers)
+const mockUseExamQuestions = vi.mocked(useExamQuestions)
+
+/** Default: no data loaded, nothing pending */
+function setupDefault(exams: Exam[], answersMap: Record = {}, questionsMap: Record = {}) {
+ mockUseExams.mockReturnValue({
+ data: exams,
+ isLoading: false,
+ isError: false,
+ refetch: vi.fn().mockResolvedValue({}),
+ isFetching: false,
+ } as any)
+
+ const examIds = exams.filter((e) => e.participants.length > 0).map((e) => e.id)
+
+ mockUseAllExamAnswers.mockReturnValue(
+ examIds.map((id) => ({
+ data: answersMap[id] ?? [],
+ isPending: false,
+ isError: false,
+ isSuccess: true,
+ })) as any
+ )
+
+ mockUseAllExamQuestions.mockReturnValue(
+ examIds.map((id) => ({
+ data: questionsMap[id] ?? [],
+ isPending: false,
+ isError: false,
+ isSuccess: true,
+ })) as any
+ )
+ // Note: useExamAnswers and useExamQuestions (drawer hooks) intentionally NOT set here.
+ // Drawer tests set them up in their own beforeEach / per-test setup.
+}
+
+// ─── Tests ───────────────────────────────────────────────────────────────────
+
+describe('ScoresClient', () => {
+ beforeEach(() => {
+ vi.clearAllMocks()
+ // Reset body/html overflow after each test in case scroll lock leaked
+ document.body.style.overflow = ''
+ document.documentElement.style.overflow = ''
+ })
+
+ // ── Loading state ──────────────────────────────────────────────────────────
+
+ describe('loading state', () => {
+ it('shows loading spinner while exams are fetching', () => {
+ mockUseExams.mockReturnValue({ data: undefined, isLoading: true, isError: false, refetch: vi.fn(), isFetching: true } as any)
+ mockUseAllExamAnswers.mockReturnValue([] as any)
+ mockUseAllExamQuestions.mockReturnValue([] as any)
+
+ render()
+ expect(screen.getByTestId('loading-spinner')).toBeInTheDocument()
+ })
+
+ it('shows loading spinner while answer queries are pending', () => {
+ mockUseExams.mockReturnValue({ data: [makeExam({ participants: [makeParticipant()] })], isLoading: false, isError: false, refetch: vi.fn(), isFetching: false } as any)
+ mockUseAllExamAnswers.mockReturnValue([{ data: undefined, isPending: true }] as any)
+ mockUseAllExamQuestions.mockReturnValue([{ data: undefined, isPending: false }] as any)
+
+ render()
+ expect(screen.getByTestId('loading-spinner')).toBeInTheDocument()
+ })
+ })
+
+ // ── Error state ────────────────────────────────────────────────────────────
+
+ describe('error state', () => {
+ it('shows error message when exams fetch fails', () => {
+ mockUseExams.mockReturnValue({ data: undefined, isLoading: false, isError: true, refetch: vi.fn(), isFetching: false } as any)
+ mockUseAllExamAnswers.mockReturnValue([] as any)
+ mockUseAllExamQuestions.mockReturnValue([] as any)
+
+ render()
+ expect(screen.getByText(/failed to load scores/i)).toBeInTheDocument()
+ })
+
+ it('renders a Retry button that calls refetch', () => {
+ const refetch = vi.fn().mockResolvedValue({})
+ mockUseExams.mockReturnValue({ data: undefined, isLoading: false, isError: true, refetch, isFetching: false } as any)
+ mockUseAllExamAnswers.mockReturnValue([] as any)
+ mockUseAllExamQuestions.mockReturnValue([] as any)
+
+ render()
+ fireEvent.click(screen.getByRole('button', { name: /retry/i }))
+ expect(refetch).toHaveBeenCalledTimes(1)
+ })
+ })
+
+ // ── Empty state ────────────────────────────────────────────────────────────
+
+ describe('empty state', () => {
+ it('shows empty state when there are no participated exams', () => {
+ setupDefault([makeExam({ participants: [] })])
+ render()
+ expect(screen.getByText(/no exams found/i)).toBeInTheDocument()
+ })
+
+ it('shows empty state when active filter has no matches', () => {
+ // One assessment, filter set to "assignment"
+ setupDefault([makeExam({ id: 1, activity_type: 'assessment', participants: [makeParticipant()] })])
+ render()
+ fireEvent.click(screen.getByRole('button', { name: /assignments/i }))
+ expect(screen.getByText(/no assignments found/i)).toBeInTheDocument()
+ })
+ })
+
+ // ── Stats strip ───────────────────────────────────────────────────────────
+
+ describe('stats strip', () => {
+ it('renders total / scored / pending counts', () => {
+ const exams = [
+ makeExam({ id: 1, participants: [makeParticipant()] }), // pending
+ makeExam({ id: 2, name: 'Final', participants: [makeParticipant()] }), // pending
+ ]
+ const answersMap = {
+ 1: [makeAnswer(1, 100, '8.000')], // graded → scored
+ 2: [], // no answers → pending
+ }
+ const questionsMap = {
+ 1: [makeQuestion(100, '1', '10.0')],
+ 2: [],
+ }
+ setupDefault(exams, answersMap, questionsMap)
+ render()
+
+ expect(screen.getByLabelText(/total: 2/i)).toBeInTheDocument()
+ expect(screen.getByLabelText(/scored: 1/i)).toBeInTheDocument()
+ expect(screen.getByLabelText(/pending: 1/i)).toBeInTheDocument()
+ })
+
+ it('shows avg score percentage when calculable', () => {
+ const exam = makeExam({ id: 1, participants: [makeParticipant()] })
+ const answersMap = { 1: [makeAnswer(1, 100, '8.000')] }
+ const questionsMap = { 1: [makeQuestion(100, '1', '10.0')] }
+ setupDefault([exam], answersMap, questionsMap)
+ render()
+
+ // 8/10 = 80%
+ expect(screen.getByLabelText(/avg score: 80%/i)).toBeInTheDocument()
+ })
+
+ it('shows — for avg score when no exam has both score and max mark', () => {
+ const exam = makeExam({ id: 1, participants: [makeParticipant()] })
+ setupDefault([exam], {}, {})
+ render()
+
+ expect(screen.getByLabelText(/avg score: —/i)).toBeInTheDocument()
+ })
+ })
+
+ // ── Score display ──────────────────────────────────────────────────────────
+
+ describe('score display on card', () => {
+ it('shows "Pending" when there is no score', () => {
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant(null)] })])
+ render()
+ // The italic "Pending" span is the card's pending status (distinct from the stats tile label)
+ expect(screen.getByText('Pending', { selector: 'span' })).toBeInTheDocument()
+ })
+
+ it('shows score + max mark from resolvedScore / resolvedMaxMark', () => {
+ const exam = makeExam({ id: 1, participants: [makeParticipant(null)] })
+ const answersMap = { 1: [makeAnswer(1, 100, '18.000')] }
+ const questionsMap = { 1: [makeQuestion(100, '1', '25.0')] }
+ setupDefault([exam], answersMap, questionsMap)
+ render()
+
+ expect(screen.getByText('18')).toBeInTheDocument()
+ expect(screen.getByText(/\/ 25/)).toBeInTheDocument()
+ })
+
+ it('shows "Pending" when answers exist but all scores are null (submitted, not graded)', () => {
+ const exam = makeExam({ id: 1, participants: [makeParticipant(null)] })
+ // answers present but score: null
+ const answersMap = { 1: [makeAnswer(1, 100, null)] }
+ const questionsMap = { 1: [makeQuestion(100, '1', '25.0')] }
+ setupDefault([exam], answersMap, questionsMap)
+ render()
+
+ // The italic span is the card's pending indicator; the stats tile has a div
+ expect(screen.getByText('Pending', { selector: 'span' })).toBeInTheDocument()
+ expect(screen.queryByText(/\/ 25/)).not.toBeInTheDocument()
+ })
+ })
+
+ // ── Visibility rules ──────────────────────────────────────────────────────
+
+ describe('visibility rules', () => {
+ it('hides exams with no participants', () => {
+ setupDefault([makeExam({ id: 1, name: 'Hidden Exam', participants: [] })])
+ render()
+ expect(screen.queryByText('Hidden Exam')).not.toBeInTheDocument()
+ })
+
+ it('shows assessments with participants even without answers', () => {
+ const exam = makeExam({ id: 1, name: 'Assessment', activity_type: 'assessment', participants: [makeParticipant()] })
+ setupDefault([exam], { 1: [] }, {})
+ render()
+ expect(screen.getByText('Assessment')).toBeInTheDocument()
+ })
+
+ it('hides assignments with no submitted answers', () => {
+ const exam = makeExam({ id: 1, name: 'Hidden Assignment', activity_type: 'assignment', participants: [makeParticipant()] })
+ setupDefault([exam], { 1: [] }, {})
+ render()
+ expect(screen.queryByText('Hidden Assignment')).not.toBeInTheDocument()
+ })
+
+ it('shows assignments that have submitted answers', () => {
+ const exam = makeExam({ id: 1, name: 'Submitted Assignment', activity_type: 'assignment', participants: [makeParticipant()] })
+ const answersMap = { 1: [makeAnswer(1, 100, null)] } // submitted, not graded
+ setupDefault([exam], answersMap, {})
+ render()
+ expect(screen.getByText('Submitted Assignment')).toBeInTheDocument()
+ })
+ })
+
+ // ── Course grouping ────────────────────────────────────────────────────────
+
+ describe('course grouping', () => {
+ it('renders a section header for each course', () => {
+ const exam1 = makeExam({ id: 1, name: 'Exam A', course: [makeCourse(10, 'CS301', 'Data Structures') as any], participants: [makeParticipant()] })
+ const exam2 = makeExam({ id: 2, name: 'Exam B', course: [makeCourse(20, 'CS302', 'Algorithms') as any], participants: [makeParticipant()] })
+ setupDefault([exam1, exam2])
+ render()
+
+ // Section header spans are the group labels; each course name also appears in each card
+ // We check by specific span inside the section heading
+ const cs301Headers = screen.getAllByText('CS301 – Data Structures')
+ const cs302Headers = screen.getAllByText('CS302 – Algorithms')
+ // At minimum one element per course (section header); duplicates from card rows are ok
+ expect(cs301Headers.length).toBeGreaterThanOrEqual(1)
+ expect(cs302Headers.length).toBeGreaterThanOrEqual(1)
+ })
+
+ it('groups both exams under same course section when they share a course', () => {
+ const course = makeCourse(10, 'CS301', 'Data Structures')
+ const exam1 = makeExam({ id: 1, name: 'Midterm', course: [course as any], participants: [makeParticipant()] })
+ const exam2 = makeExam({ id: 2, name: 'Final', course: [course as any], participants: [makeParticipant()] })
+ setupDefault([exam1, exam2])
+ render()
+
+ // Section header: one span.font-semibold.text-white with the course name
+ // Fallback: count elements that are direct section header spans (not inside card)
+ const allMatches = screen.getAllByText('CS301 – Data Structures')
+ // The course appears in: 1 section header + 2 card course rows = 3 total
+ // But only 1 section header
+ const sectionHeaderElements = allMatches.filter(el => el.tagName === 'SPAN' && el.className.includes('font-semibold'))
+ expect(sectionHeaderElements).toHaveLength(1)
+
+ // Both exams visible
+ expect(screen.getByText('Midterm')).toBeInTheDocument()
+ expect(screen.getByText('Final')).toBeInTheDocument()
+ })
+
+ it('shows count label with both type counts when mixed', () => {
+ const course = makeCourse(10, 'CS301', 'Data Structures')
+ const assessment = makeExam({ id: 1, activity_type: 'assessment', course: [course as any], participants: [makeParticipant()] })
+ const assignment = makeExam({ id: 2, activity_type: 'assignment', course: [course as any], participants: [makeParticipant()] })
+ const answersMap = { 1: [], 2: [makeAnswer(1, 100, '5.000')] }
+ setupDefault([assessment, assignment], answersMap)
+ render()
+
+ expect(screen.getByText(/1 assessment/i)).toBeInTheDocument()
+ expect(screen.getByText(/1 assignment/i)).toBeInTheDocument()
+ })
+ })
+
+ // ── Filter tabs ────────────────────────────────────────────────────────────
+
+ describe('filter tabs', () => {
+ it('shows only assessments when "Assessments" tab is clicked', () => {
+ const assessment = makeExam({ id: 1, name: 'Quiz 1', activity_type: 'assessment', participants: [makeParticipant()] })
+ const assignment = makeExam({ id: 2, name: 'Homework', activity_type: 'assignment', participants: [makeParticipant()] })
+ const answersMap = { 1: [], 2: [makeAnswer(1, 100, '5.000')] }
+ setupDefault([assessment, assignment], answersMap)
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /assessments/i }))
+
+ expect(screen.getByText('Quiz 1')).toBeInTheDocument()
+ expect(screen.queryByText('Homework')).not.toBeInTheDocument()
+ })
+
+ it('shows only assignments when "Assignments" tab is clicked', () => {
+ const assessment = makeExam({ id: 1, name: 'Quiz 1', activity_type: 'assessment', participants: [makeParticipant()] })
+ const assignment = makeExam({ id: 2, name: 'Homework', activity_type: 'assignment', participants: [makeParticipant()] })
+ const answersMap = { 1: [], 2: [makeAnswer(1, 100, '5.000')] }
+ setupDefault([assessment, assignment], answersMap)
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /assignments/i }))
+
+ expect(screen.queryByText('Quiz 1')).not.toBeInTheDocument()
+ expect(screen.getByText('Homework')).toBeInTheDocument()
+ })
+
+ it('displays correct count badges on tabs', () => {
+ const assessment = makeExam({ id: 1, activity_type: 'assessment', participants: [makeParticipant()] })
+ const assignment = makeExam({ id: 2, activity_type: 'assignment', participants: [makeParticipant()] })
+ const answersMap = { 1: [], 2: [makeAnswer(1, 100, '5.000')] }
+ setupDefault([assessment, assignment], answersMap)
+ render()
+
+ // All tab should show 2, others 1 each
+ const buttons = screen.getAllByRole('button')
+ const allTab = buttons.find((b) => b.textContent?.includes('All'))
+ const assessTab = buttons.find((b) => b.textContent?.includes('Assessments'))
+ const assignTab = buttons.find((b) => b.textContent?.includes('Assignments'))
+
+ expect(allTab?.textContent).toMatch(/2/)
+ expect(assessTab?.textContent).toMatch(/1/)
+ expect(assignTab?.textContent).toMatch(/1/)
+ })
+ })
+
+ // ── Drawer ─────────────────────────────────────────────────────────────────
+
+ describe('detail drawer', () => {
+ beforeEach(() => {
+ // Set up drawer hooks to return data for exam id=1
+ mockUseExamAnswers.mockReturnValue({
+ data: [makeAnswer(1, 100, '8.000')],
+ isLoading: false,
+ isError: false,
+ } as any)
+ mockUseExamQuestions.mockReturnValue({
+ data: [makeQuestion(100, '1', '10.0')],
+ isLoading: false,
+ isError: false,
+ } as any)
+ })
+
+ it('opens the drawer when a card is clicked', () => {
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /view details for midterm exam/i }))
+
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
+ })
+
+ it('closes the drawer when close button is clicked', () => {
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /view details for midterm exam/i }))
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
+
+ fireEvent.click(screen.getByRole('button', { name: /close details/i }))
+ expect(screen.queryByRole('dialog')).not.toBeInTheDocument()
+ })
+
+ it('closes the drawer on Escape key', () => {
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /view details for midterm exam/i }))
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
+
+ fireEvent.keyDown(window, { key: 'Escape' })
+ expect(screen.queryByRole('dialog')).not.toBeInTheDocument()
+ })
+
+ it('shows exam name and course in drawer header', () => {
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /view details for midterm exam/i }))
+
+ const dialog = screen.getByRole('dialog')
+ expect(within(dialog).getByText('Midterm Exam')).toBeInTheDocument()
+ expect(within(dialog).getByText(/CS301/)).toBeInTheDocument()
+ })
+
+ it('shows per-question breakdown when questions and answers are available', () => {
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /view details for midterm exam/i }))
+
+ const dialog = screen.getByRole('dialog')
+ // Text is uppercased via CSS; DOM text node is mixed-case
+ expect(within(dialog).getByText((content) =>
+ content.toLowerCase().includes('per-question breakdown')
+ )).toBeInTheDocument()
+ expect(within(dialog).getByText('Q1')).toBeInTheDocument()
+ })
+
+ it('shows "Pending marks" badge for ungraded exams', () => {
+ mockUseExamAnswers.mockReturnValue({ data: [], isLoading: false, isError: false } as any)
+ mockUseExamQuestions.mockReturnValue({ data: [makeQuestion(100, '1', '10.0')], isLoading: false, isError: false } as any)
+
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /view details for midterm exam/i }))
+
+ const dialog = screen.getByRole('dialog')
+ expect(within(dialog).getByText(/pending marks/i)).toBeInTheDocument()
+ })
+
+ it('locks body scroll when open and restores on close', () => {
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /view details for midterm exam/i }))
+ expect(document.body.style.overflow).toBe('hidden')
+ expect(document.documentElement.style.overflow).toBe('hidden')
+
+ fireEvent.click(screen.getByRole('button', { name: /close details/i }))
+ expect(document.body.style.overflow).not.toBe('hidden')
+ expect(document.documentElement.style.overflow).not.toBe('hidden')
+ })
+ })
+
+ // ── Accessibility ──────────────────────────────────────────────────────────
+
+ describe('accessibility', () => {
+ it('each exam card has an accessible button role and aria-label', () => {
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ expect(screen.getByRole('button', { name: /view details for midterm exam/i })).toBeInTheDocument()
+ })
+
+ it('drawer has role=dialog and aria-modal=true', () => {
+ mockUseExamAnswers.mockReturnValue({ data: [], isLoading: false, isError: false } as any)
+ mockUseExamQuestions.mockReturnValue({ data: [], isLoading: false, isError: false } as any)
+ setupDefault([makeExam({ id: 1, participants: [makeParticipant()] })])
+ render()
+
+ fireEvent.click(screen.getByRole('button', { name: /view details for midterm exam/i }))
+ const dialog = screen.getByRole('dialog')
+ expect(dialog).toHaveAttribute('aria-modal', 'true')
+ })
+
+ it('refresh button has aria-label', () => {
+ setupDefault([])
+ render()
+ expect(screen.getByRole('button', { name: /refresh scores/i })).toBeInTheDocument()
+ })
+
+ it('progress bars have role=progressbar with aria-valuenow', () => {
+ const exam = makeExam({ id: 1, participants: [makeParticipant()] })
+ const answersMap = { 1: [makeAnswer(1, 100, '8.000')] }
+ const questionsMap = { 1: [makeQuestion(100, '1', '10.0')] }
+ setupDefault([exam], answersMap, questionsMap)
+ render()
+
+ const progressBars = screen.getAllByRole('progressbar')
+ expect(progressBars.length).toBeGreaterThan(0)
+ expect(progressBars[0]).toHaveAttribute('aria-valuenow', '80')
+ })
+
+ it('stats tiles have aria-label', () => {
+ const exam = makeExam({ id: 1, participants: [makeParticipant()] })
+ setupDefault([exam])
+ render()
+
+ expect(screen.getByLabelText(/total: 1/i)).toBeInTheDocument()
+ })
+ })
+})
diff --git a/src/app/(protected)/scores/error.tsx b/src/app/(protected)/scores/error.tsx
new file mode 100644
index 00000000..e7fb9776
--- /dev/null
+++ b/src/app/(protected)/scores/error.tsx
@@ -0,0 +1,23 @@
+"use client";
+
+import { useEffect } from "react";
+import * as Sentry from "@sentry/nextjs";
+import { ErrorFallback } from "@/components/error-fallback";
+
+export default function ScoresError({
+ error,
+ reset,
+}: {
+ error: Error & { digest?: string };
+ reset: () => void;
+}) {
+ useEffect(() => {
+ Sentry.captureException(error, {
+ tags: {
+ location: "scores",
+ },
+ });
+ }, [error]);
+
+ return ;
+}
diff --git a/src/app/(protected)/scores/page.tsx b/src/app/(protected)/scores/page.tsx
new file mode 100644
index 00000000..9ca0eafd
--- /dev/null
+++ b/src/app/(protected)/scores/page.tsx
@@ -0,0 +1,17 @@
+import { Metadata } from "next";
+import ScoresClient from "./ScoresClient";
+
+// Force dynamic rendering for protected routes
+export const dynamic = "force-dynamic";
+
+export const metadata: Metadata = {
+ title: "Scores",
+ robots: {
+ index: false,
+ follow: false,
+ },
+};
+
+export default function ScoresPage() {
+ return ;
+}
diff --git a/src/app/(public)/build-info/page.tsx b/src/app/(public)/build-info/page.tsx
index 494029e0..7542f36d 100644
--- a/src/app/(public)/build-info/page.tsx
+++ b/src/app/(public)/build-info/page.tsx
@@ -3,6 +3,15 @@ import { Button } from "@/components/ui/button";
import { ArrowLeft, ExternalLink } from "lucide-react";
import Link from "next/link";
import { CopyButton, InlineCopyButton } from "./copy-button";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+ title: "Build Info",
+ robots: {
+ index: true,
+ follow: true,
+ },
+};
interface BuildMeta {
commit_sha: string;
diff --git a/src/app/__tests__/robots.test.ts b/src/app/__tests__/robots.test.ts
index 8b65d825..9abbbd88 100644
--- a/src/app/__tests__/robots.test.ts
+++ b/src/app/__tests__/robots.test.ts
@@ -68,9 +68,15 @@ describe("robots.txt", () => {
expect(Array.isArray(rules.disallow)).toBe(true);
});
- it("should disallow exactly 6 paths", () => {
+ it("should disallow exactly 7 paths", () => {
const config = robots();
const rules = Array.isArray(config.rules) ? config.rules[0] : config.rules;
- expect(rules.disallow).toHaveLength(6);
+ expect(rules.disallow).toHaveLength(7);
+ });
+
+ it("should disallow /scores", () => {
+ const config = robots();
+ const rules = Array.isArray(config.rules) ? config.rules[0] : config.rules;
+ expect(rules.disallow).toContain("/scores");
});
});
diff --git a/src/app/__tests__/sitemap.test.ts b/src/app/__tests__/sitemap.test.ts
index 1726ffa7..73e740b5 100644
--- a/src/app/__tests__/sitemap.test.ts
+++ b/src/app/__tests__/sitemap.test.ts
@@ -71,9 +71,9 @@ describe("sitemap.xml", () => {
expect(helpPage?.priority).toBe(0.7);
});
- it("should have 4 URLs total", () => {
+ it("should have 5 URLs total", () => {
const urls = sitemap();
- expect(urls).toHaveLength(4);
+ expect(urls).toHaveLength(5);
});
it("should set lastModified to Date when BUILD_TIMESTAMP is set", () => {
@@ -147,12 +147,15 @@ describe("sitemap.xml", () => {
// Help page at 0.7 (useful but lower than core)
expect(find("/help")?.priority).toBe(0.7);
- // /login and /build-info should not be present
+ // build-info is present at 0.4 (transparency page, low crawl priority)
+ expect(find("/build-info")?.priority).toBe(0.4);
+
+ // /login should not be present
expect(find("/login")).toBeUndefined();
- expect(find("/build-info")).toBeUndefined();
- // Ordering: homepage > core (0.8) > help (0.7)
+ // Ordering: homepage > core (0.8) > help (0.7) > build-info (0.4)
expect((find("")?.priority ?? 0)).toBeGreaterThan(find("/contact")?.priority ?? 0);
expect((find("/contact")?.priority ?? 0)).toBeGreaterThan(find("/help")?.priority ?? 0);
+ expect((find("/help")?.priority ?? 0)).toBeGreaterThan(find("/build-info")?.priority ?? 0);
});
});
diff --git a/src/app/accept-terms/AcceptTermsClient.tsx b/src/app/accept-terms/AcceptTermsClient.tsx
new file mode 100644
index 00000000..90494baf
--- /dev/null
+++ b/src/app/accept-terms/AcceptTermsClient.tsx
@@ -0,0 +1,35 @@
+"use client";
+
+import { Toaster } from "@/components/toaster";
+import { AcceptTermsForm } from "@/components/legal/AcceptTermsForm";
+import { useCSRFToken } from "@/hooks/use-csrf-token";
+
+export default function AcceptTermsClient() {
+ // Initialize CSRF token for consistency with other form pages
+ useCSRFToken();
+
+ return (
+ <>
+
+
+ {/* Animated gradient mesh background */}
+
+ {/* Animated gradient orbs */}
+
+
+
+
+
+ {/* Dot grid pattern */}
+
+
+
+
+
- {/* Animated gradient mesh background */}
-
- {/* Animated gradient orbs */}
-
-
-
-
-
- {/* Dot grid pattern */}
-
-
-
-
-
+
+
+ )}
+
@@ -338,6 +354,10 @@ export const Navbar = () => {
Tracking
+ navigateTo("/scores")} className="cursor-pointer" role="menuitem">
+
+ Scores
+
navigateTo("/profile")} className="cursor-pointer" role="menuitem">
Profile
diff --git a/src/components/loading.tsx b/src/components/loading.tsx
index 356d63f2..0c7b45ab 100644
--- a/src/components/loading.tsx
+++ b/src/components/loading.tsx
@@ -45,21 +45,26 @@ export function Loading({ minimal = false }: { minimal?: boolean }) {
return (
-
Loading application, please wait...
+
Loading, please wait...
{/* Spinner + Text Container */}
-
-
-
- "Waiting on Ezygo to stop ghosting us 👻"
-
-
+
+ {!minimal && (
+
+
+ "Waiting on Ezygo to stop ghosting us 👻"
+
+
+ )}
{showWarning && !minimal && (
diff --git a/src/components/user/__tests__/login-form.test.tsx b/src/components/user/__tests__/login-form.test.tsx
index 4b261bdf..f78c883f 100644
--- a/src/components/user/__tests__/login-form.test.tsx
+++ b/src/components/user/__tests__/login-form.test.tsx
@@ -4,13 +4,12 @@ import React from "react";
// vi.mock factories are hoisted to the top of the file, so variables used inside
// them must also be hoisted via vi.hoisted().
-const { mockNProgressStart, mockNProgressDone, mockAxiosPost, mockPush, mockRouter } = vi.hoisted(() => {
+const { mockNProgressStart, mockNProgressDone, mockAxiosPost, mockRouter } = vi.hoisted(() => {
const push = vi.fn();
return {
mockNProgressStart: vi.fn(),
mockNProgressDone: vi.fn(),
mockAxiosPost: vi.fn(),
- mockPush: push,
// A single stable router object prevents useEffect([router, supabase]) from
// re-running on every render (which would cause an infinite loop in tests).
mockRouter: { push, replace: vi.fn(), prefetch: vi.fn(), back: vi.fn(), forward: vi.fn(), refresh: vi.fn() },
diff --git a/src/components/user/login-form.tsx b/src/components/user/login-form.tsx
index b3af79f8..147870cc 100644
--- a/src/components/user/login-form.tsx
+++ b/src/components/user/login-form.tsx
@@ -20,7 +20,7 @@ import * as Sentry from "@sentry/nextjs";
import { createClient } from "@/lib/supabase/client";
import { CSRF_HEADER } from "@/lib/security/csrf-constants";
import { logger } from "@/lib/logger";
-import { isAuthSessionMissingError } from "@/lib/security/auth";
+import { isAuthSessionMissingError, isSupabaseLockTimeoutError } from "@/lib/security/auth";
import { DEFAULT_TARGET_PERCENTAGE } from "@/providers/user-settings";
import NProgress from "nprogress";
@@ -132,18 +132,20 @@ export function LoginForm({ className, ...props }: LoginFormProps) {
setIsLoadingPage(true);
try {
- const { data: { user }, error } = await supabase.auth.getUser();
+ const { data: { session }, error } = await supabase.auth.getSession();
// Ignore auth session missing errors - they're expected when not logged in
- if (error && !isAuthSessionMissingError(error)) {
+ if (error && !isAuthSessionMissingError(error) && !isSupabaseLockTimeoutError(error)) {
throw error;
}
- if (user && isMounted) {
+ if (session?.user && isMounted) {
router.push("/dashboard");
return;
}
} catch (err) {
- if (err instanceof Error && !isAuthSessionMissingError(err)) {
+ if (err instanceof Error && !isAuthSessionMissingError(err) && !isSupabaseLockTimeoutError(err)) {
logger.error("Unexpected error checking user session:", err);
+ } else if (err instanceof Error && isSupabaseLockTimeoutError(err)) {
+ logger.dev("Supabase auth lock timeout during page-load session check; continuing without redirect");
}
} finally {
if (isMounted) {
diff --git a/src/hooks/courses/__tests__/exams.test.tsx b/src/hooks/courses/__tests__/exams.test.tsx
new file mode 100644
index 00000000..c0adc001
--- /dev/null
+++ b/src/hooks/courses/__tests__/exams.test.tsx
@@ -0,0 +1,313 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { renderHook, waitFor } from '@testing-library/react'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { type ReactNode } from 'react'
+import { useExams, useExamAnswers, useExamQuestions, useAllExamAnswers, useAllExamQuestions } from '@/hooks/courses/exams'
+import axiosInstance from '@/lib/axios'
+import type { Exam, ExamAnswer, ExamQuestion } from '@/types'
+
+vi.mock('@/lib/axios', () => ({
+ default: { get: vi.fn() },
+}))
+
+const mockGet = vi.mocked(axiosInstance.get)
+
+// ─── Fixtures ────────────────────────────────────────────────────────────────
+
+const makeExam = (id = 1, name = 'Midterm'): Exam =>
+ ({
+ id,
+ name,
+ activity_name_id: null,
+ activity_type: 'assessment',
+ summary: null,
+ starts_at: '2026-01-15T10:00:00.000Z',
+ end_at: null,
+ return_at: null,
+ limitted_time_seconds: null,
+ category_id: null,
+ respond_after_close: 0,
+ offline_activity: 0,
+ maximum_mark: null,
+ negative_mark: null,
+ positive_mark: null,
+ hidden: 0,
+ is_objective_only: 0,
+ shuffle_questions: 0,
+ shuffle_choices: 0,
+ exclude_from_report: 0,
+ ordered_choice_list: 0,
+ auto_evaluation: 0,
+ publish_result: 0,
+ max_co_scores: null,
+ co_score_evaluation: 0,
+ institution_id: 1,
+ settings: null,
+ course_id: 10,
+ created_by: 1,
+ created_at: '2026-01-01T00:00:00.000Z',
+ updated_at: '2026-01-01T00:00:00.000Z',
+ deleted_at: null,
+ course: [{ id: 10, name: 'Data Structures', code: 'CS301' } as any],
+ activity_name: null,
+ participants: [{ id: 1, exam_id: id, starts_at: null, end_at: null, pivot: { exam_id: id, institution_user_id: 1, starts_at: null, end_at: null, score: 18, comments: null, absent_enable: 0 } }],
+ })
+
+const makeAnswer = (id = 1, questionId = 100, score: string | null = '5.000'): ExamAnswer => ({
+ id,
+ answer: null,
+ score,
+ choice_id: null,
+ examquestion_id: questionId,
+ student_id: 1,
+ created_by: 1,
+ created_at: '2026-01-15T12:00:00.000Z',
+ updated_at: '2026-01-15T12:00:00.000Z',
+ files: [],
+})
+
+const makeQuestion = (id = 100, no = '1', maxMark = '5.0'): ExamQuestion =>
+ ({
+ id,
+ question_no: no,
+ name: `Question ${no}`,
+ question: [],
+ summary: null,
+ difficulty_level: null,
+ type: 'Theory',
+ evaluation_scheme: null,
+ allow_descriptive: 1,
+ allow_attachment_answer: 0,
+ answer_required: 1,
+ maximum_mark: maxMark,
+ blooms_taxonamy_level: null,
+ section_id: null,
+ module_id: 1,
+ exam_id: 1,
+ institution_id: 1,
+ created_by: 1,
+ created_at: '2026-01-01T00:00:00.000Z',
+ updated_at: '2026-01-01T00:00:00.000Z',
+ orquestion_group_id: null,
+ subquestion_parent_id: null,
+ files: [],
+ choices: [],
+ course_outcome: [],
+ programme_outcome: [],
+ programme_specific_outcome: [],
+ })
+
+// ─── Wrapper ─────────────────────────────────────────────────────────────────
+
+const createWrapper = () => {
+ const queryClient = new QueryClient({
+ defaultOptions: { queries: { retry: false } },
+ })
+ const Wrapper = ({ children }: { children: ReactNode }) => (
+
{children}
+ )
+ Wrapper.displayName = 'QueryClientWrapper'
+ return Wrapper
+}
+
+// ─── useExams ─────────────────────────────────────────────────────────────────
+
+describe('useExams', () => {
+ beforeEach(() => { vi.resetAllMocks() })
+
+ it('returns exam array on success', async () => {
+ const exams = [makeExam(1), makeExam(2, 'Final')]
+ mockGet.mockResolvedValueOnce({ data: exams })
+
+ const { result } = renderHook(() => useExams(), { wrapper: createWrapper() })
+
+ await waitFor(() => expect(result.current.isSuccess).toBe(true))
+ expect(result.current.data).toHaveLength(2)
+ expect(result.current.data![0].name).toBe('Midterm')
+ expect(result.current.data![1].name).toBe('Final')
+ expect(mockGet).toHaveBeenCalledWith('/exams')
+ })
+
+ it('enters error state on network failure', async () => {
+ mockGet.mockRejectedValueOnce(new Error('Network error'))
+
+ const { result } = renderHook(() => useExams(), { wrapper: createWrapper() })
+
+ await waitFor(() => expect(result.current.isError).toBe(true), { timeout: 3000 })
+ })
+
+ it('stays idle when disabled', () => {
+ const { result } = renderHook(() => useExams({ enabled: false }), { wrapper: createWrapper() })
+ expect(result.current.status).toBe('pending')
+ expect(result.current.fetchStatus).toBe('idle')
+ expect(mockGet).not.toHaveBeenCalled()
+ })
+
+ it('returns empty array when API returns empty list', async () => {
+ mockGet.mockResolvedValueOnce({ data: [] })
+
+ const { result } = renderHook(() => useExams(), { wrapper: createWrapper() })
+
+ await waitFor(() => expect(result.current.isSuccess).toBe(true))
+ expect(result.current.data).toEqual([])
+ })
+})
+
+// ─── useExamAnswers ───────────────────────────────────────────────────────────
+
+describe('useExamAnswers', () => {
+ beforeEach(() => { vi.resetAllMocks() })
+
+ it('fetches answers for the given examId', async () => {
+ const answers = [makeAnswer(1, 100, '4.000'), makeAnswer(2, 101, '3.000')]
+ mockGet.mockResolvedValueOnce({ data: answers })
+
+ const { result } = renderHook(() => useExamAnswers(42), { wrapper: createWrapper() })
+
+ await waitFor(() => expect(result.current.isSuccess).toBe(true))
+ expect(mockGet).toHaveBeenCalledWith('/exams/42/institutionuser/examanswers')
+ expect(result.current.data).toHaveLength(2)
+ })
+
+ it('stays idle when examId is null', () => {
+ const { result } = renderHook(() => useExamAnswers(null), { wrapper: createWrapper() })
+ expect(result.current.fetchStatus).toBe('idle')
+ expect(mockGet).not.toHaveBeenCalled()
+ })
+})
+
+// ─── useExamQuestions ─────────────────────────────────────────────────────────
+
+describe('useExamQuestions', () => {
+ beforeEach(() => { vi.resetAllMocks() })
+
+ it('fetches questions with from_view_score param', async () => {
+ const questions = [makeQuestion(100, '1', '5.0'), makeQuestion(101, '2', '10.0')]
+ mockGet.mockResolvedValueOnce({ data: questions })
+
+ const { result } = renderHook(() => useExamQuestions(42), { wrapper: createWrapper() })
+
+ await waitFor(() => expect(result.current.isSuccess).toBe(true))
+ expect(mockGet).toHaveBeenCalledWith('/exams/42/examquestions', {
+ params: { from_view_score: true },
+ })
+ expect(result.current.data).toHaveLength(2)
+ })
+
+ it('stays idle when examId is null', () => {
+ const { result } = renderHook(() => useExamQuestions(null), { wrapper: createWrapper() })
+ expect(result.current.fetchStatus).toBe('idle')
+ expect(mockGet).not.toHaveBeenCalled()
+ })
+})
+
+// ─── useAllExamAnswers ────────────────────────────────────────────────────────
+
+describe('useAllExamAnswers', () => {
+ beforeEach(() => { vi.resetAllMocks() })
+
+ it('returns empty array of results when given empty ids', async () => {
+ const { result } = renderHook(() => useAllExamAnswers([]), { wrapper: createWrapper() })
+ expect(result.current).toHaveLength(0)
+ expect(mockGet).not.toHaveBeenCalled()
+ })
+
+ it('fires one request per exam id', async () => {
+ const answersById: Record
= {
+ '10': [makeAnswer(1, 100, '5.000')],
+ '20': [makeAnswer(2, 200, '8.000')],
+ }
+ mockGet.mockImplementation((url: string) => {
+ const match = url.match(/\/exams\/(\d+)\//)
+ const id = match?.[1] ?? ''
+ return Promise.resolve({ data: answersById[id] ?? [] })
+ })
+
+ const { result } = renderHook(() => useAllExamAnswers([10, 20]), {
+ wrapper: createWrapper(),
+ })
+
+ await waitFor(() => {
+ expect(result.current).toHaveLength(2)
+ expect(result.current[0].isSuccess).toBe(true)
+ expect(result.current[1].isSuccess).toBe(true)
+ expect(result.current[0].data).toBeDefined()
+ expect(result.current[1].data).toBeDefined()
+ const allScores = result.current.flatMap((q) => (q.data as ExamAnswer[]).map((a) => a.score))
+ expect(allScores).toContain('5.000')
+ expect(allScores).toContain('8.000')
+ })
+
+ expect(mockGet).toHaveBeenCalledTimes(2)
+ expect(mockGet).toHaveBeenCalledWith('/exams/10/institutionuser/examanswers')
+ expect(mockGet).toHaveBeenCalledWith('/exams/20/institutionuser/examanswers')
+ })
+
+ it('uses staleTime: 0 so window-focus always refetches', () => {
+ // This tests the configuration: staleTime 0 means data is always "stale"
+ // and will be refetched on window focus. We confirm the hook does NOT
+ // treat data as fresh by checking the query config indirectly.
+ // An empty ids array makes this cheap.
+ const { result } = renderHook(() => useAllExamAnswers([]), { wrapper: createWrapper() })
+ expect(result.current).toHaveLength(0) // no queries = staleTime irrelevant here
+ })
+})
+
+// ─── useAllExamQuestions ──────────────────────────────────────────────────────
+
+describe('useAllExamQuestions', () => {
+ beforeEach(() => { vi.resetAllMocks() })
+
+ it('returns empty array when given empty ids', () => {
+ const { result } = renderHook(() => useAllExamQuestions([]), { wrapper: createWrapper() })
+ expect(result.current).toHaveLength(0)
+ expect(mockGet).not.toHaveBeenCalled()
+ })
+
+ it('fires one question request per exam id with from_view_score param', async () => {
+ const questionsById: Record = {
+ '10': [makeQuestion(100, '1', '5.0')],
+ '20': [makeQuestion(200, '1', '10.0')],
+ }
+ mockGet.mockImplementation((url: string) => {
+ const match = url.match(/\/exams\/(\d+)\//)
+ const id = match?.[1] ?? ''
+ return Promise.resolve({ data: questionsById[id] ?? [] })
+ })
+
+ const { result } = renderHook(() => useAllExamQuestions([10, 20]), {
+ wrapper: createWrapper(),
+ })
+
+ await waitFor(() => result.current.every((q) => q.isSuccess))
+ expect(mockGet).toHaveBeenCalledWith('/exams/10/examquestions', {
+ params: { from_view_score: true },
+ })
+ expect(mockGet).toHaveBeenCalledWith('/exams/20/examquestions', {
+ params: { from_view_score: true },
+ })
+ expect(result.current).toHaveLength(2)
+ })
+
+ it('handles error in one exam without affecting other queries', async () => {
+ mockGet.mockImplementation((url: string) => {
+ if (url.includes('/exams/10/')) return Promise.reject(new Error('404'))
+ return Promise.resolve({ data: [makeQuestion(200, '1', '10.0')] })
+ })
+
+ const { result } = renderHook(() => useAllExamQuestions([10, 20]), {
+ wrapper: createWrapper(),
+ })
+
+ // Wait for all queries to reach a terminal state (success or error)
+ await waitFor(
+ () => {
+ expect(result.current.some((q) => q.isError)).toBe(true)
+ expect(result.current.some((q) => q.isSuccess)).toBe(true)
+ const successQuery = result.current.find((q) => q.isSuccess)
+ expect((successQuery!.data as ExamQuestion[])[0].maximum_mark).toBe('10.0')
+ },
+ { timeout: 5000 }
+ )
+ })
+})
diff --git a/src/hooks/courses/exams.ts b/src/hooks/courses/exams.ts
new file mode 100644
index 00000000..525e5450
--- /dev/null
+++ b/src/hooks/courses/exams.ts
@@ -0,0 +1,158 @@
+// Fetch exams / scores hook
+// src/hooks/courses/exams.ts
+
+import axios from "@/lib/axios";
+import { useQuery, useQueries } from "@tanstack/react-query";
+import { Exam, ExamAnswer, ExamQuestion } from "@/types";
+
+/**
+ * React Query hook for fetching the current user's exams and scores.
+ * Maps to GET /api/backend/exams via the backend proxy.
+ *
+ * @param options.enabled - Set to false to disable the query.
+ * @returns Query result with an array of Exam objects.
+ *
+ * Query Configuration:
+ * - Stale time: 2 minutes
+ * - Cache time: 10 minutes
+ * - Window focus refetch: enabled
+ * - Reconnect refetch: enabled
+ * - Retry: once on failure
+ *
+ * @example
+ * ```tsx
+ * const { data: exams, isLoading } = useExams();
+ * ```
+ */
+export const useExams = (options?: { enabled?: boolean }) => {
+ return useQuery({
+ queryKey: ["exams"],
+ queryFn: async () => {
+ const res = await axios.get("/exams");
+ if (!res) throw new Error("Failed to fetch exams data");
+ return res.data;
+ },
+ enabled: options?.enabled,
+ staleTime: 2 * 60 * 1000,
+ gcTime: 10 * 60 * 1000,
+ refetchOnWindowFocus: true,
+ refetchOnReconnect: true,
+ retry: 1,
+ });
+};
+
+/**
+ * React Query hook for fetching exam questions with per-question max marks.
+ * Maps to GET /api/backend/exams/{examId}/examquestions?from_view_score=true.
+ *
+ * Fetched alongside `useExamAnswers` so the drawer can join them by `examquestion_id`.
+ *
+ * @param examId - Exam ID to fetch questions for; pass null to disable.
+ * @returns Query result with an array of ExamQuestion objects.
+ *
+ * @example
+ * ```tsx
+ * const { data: questions } = useExamQuestions(selectedExamId);
+ * ```
+ */
+export const useExamQuestions = (examId: number | null) => {
+ return useQuery({
+ queryKey: ["exam-questions", examId],
+ queryFn: async () => {
+ const res = await axios.get(`/exams/${examId}/examquestions`, {
+ params: { from_view_score: true },
+ });
+ if (!res) throw new Error("Failed to fetch exam questions");
+ return res.data;
+ },
+ enabled: examId !== null,
+ staleTime: 10 * 60 * 1000,
+ gcTime: 15 * 60 * 1000,
+ retry: 1,
+ });
+};
+
+/**
+ * React Query hook for fetching per-question answers and scores for a single exam.
+ * Maps to GET /api/backend/exams/{examId}/institutionuser/examanswers.
+ *
+ * Only fetches when `examId` is non-null (e.g. when a card is selected).
+ *
+ * @param examId - Exam ID to fetch answers for; pass null to disable.
+ * @returns Query result with an array of ExamAnswer objects.
+ *
+ * @example
+ * ```tsx
+ * const { data: answers, isLoading } = useExamAnswers(selectedExamId);
+ * ```
+ */
+export const useExamAnswers = (examId: number | null) => {
+ return useQuery({
+ queryKey: ["exam-answers", examId],
+ queryFn: async () => {
+ const res = await axios.get(
+ `/exams/${examId}/institutionuser/examanswers`
+ );
+ if (!res) throw new Error("Failed to fetch exam answers");
+ return res.data;
+ },
+ enabled: examId !== null,
+ staleTime: 0,
+ gcTime: 15 * 60 * 1000,
+ retry: 1,
+ });
+};
+
+/**
+ * Fires parallel examanswers requests for every exam in the list.
+ * Uses the same query keys as `useExamAnswers` so the drawer reads from cache.
+ *
+ * @param examIds - Array of exam IDs to pre-fetch answers for.
+ * @returns Array of query results in the same order as `examIds`.
+ *
+ * @example
+ * ```tsx
+ * const queries = useAllExamAnswers(exams.map(e => e.id));
+ * ```
+ */
+export const useAllExamAnswers = (examIds: number[]) => {
+ return useQueries({
+ queries: examIds.map((id) => ({
+ queryKey: ["exam-answers", id],
+ queryFn: async () => {
+ const res = await axios.get(
+ `/exams/${id}/institutionuser/examanswers`
+ );
+ if (!res) throw new Error("Failed to fetch exam answers");
+ return res.data as ExamAnswer[];
+ },
+ staleTime: 0,
+ gcTime: 15 * 60 * 1000,
+ retry: 1,
+ })),
+ });
+};
+
+/**
+ * Fires parallel examquestions requests for every exam in the list.
+ * Uses the same query keys as `useExamQuestions` so the drawer reads from cache.
+ *
+ * @param examIds - Array of exam IDs to pre-fetch questions for.
+ */
+export const useAllExamQuestions = (examIds: number[]) => {
+ return useQueries({
+ queries: examIds.map((id) => ({
+ queryKey: ["exam-questions", id],
+ queryFn: async () => {
+ const res = await axios.get(`/exams/${id}/examquestions`, {
+ params: { from_view_score: true },
+ });
+ if (!res) throw new Error("Failed to fetch exam questions");
+ return res.data as ExamQuestion[];
+ },
+ staleTime: 10 * 60 * 1000,
+ gcTime: 15 * 60 * 1000,
+ retry: 1,
+ })),
+ });
+};
diff --git a/src/hooks/notifications/useNotifications.ts b/src/hooks/notifications/useNotifications.ts
index 3533d7b8..3cac83a7 100644
--- a/src/hooks/notifications/useNotifications.ts
+++ b/src/hooks/notifications/useNotifications.ts
@@ -26,6 +26,10 @@ interface FetchResponse {
* Implements infinite scroll pagination for the general feed.
*
* @param enabled - Whether queries should run (default: true)
+ * @param countOnly - When true, only the lightweight unread-count query runs; the action
+ * conflict query and infinite feed query (both with 30 s polling) are skipped. Use this
+ * in contexts that only need the badge number (e.g. the navbar) to avoid firing two
+ * unnecessary Supabase requests on every protected page.
* @returns Object containing action notifications, paginated feed, and utility functions
*
* Features:
@@ -37,10 +41,13 @@ interface FetchResponse {
*
* @example
* ```tsx
+ * // Full notifications page
* const { actionNotifications, allNotifications, markAsRead } = useNotifications();
+ * // Navbar badge only — skips action + feed queries and their 30 s polling
+ * const { unreadCount } = useNotifications(true, true);
* ```
*/
-export function useNotifications(enabled = true) {
+export function useNotifications(enabled = true, countOnly = false) {
const supabase = createClient();
const queryClient = useQueryClient();
const PAGE_SIZE = 15;
@@ -68,7 +75,7 @@ export function useNotifications(enabled = true) {
}
return data as Notification[];
},
- enabled: enabled,
+ enabled: enabled && !countOnly,
refetchInterval: 30000,
});
@@ -108,7 +115,7 @@ export function useNotifications(enabled = true) {
},
getNextPageParam: (lastPage) => lastPage.nextPage,
initialPageParam: 0,
- enabled: enabled,
+ enabled: enabled && !countOnly,
refetchInterval: 30000,
});
diff --git a/src/lib/axios.ts b/src/lib/axios.ts
index 1ef9da09..87828620 100644
--- a/src/lib/axios.ts
+++ b/src/lib/axios.ts
@@ -90,6 +90,58 @@ const CSRF_STORAGE_KEY = "csrf_token_memory";
const CSRF_TOKEN_MIN_LENGTH = 64;
const CSRF_TOKEN_HEX_PATTERN = /^[0-9a-f]+$/;
+type RetryableRequestConfig = {
+ _csrfRetried?: boolean;
+};
+
+let csrfRefreshPromise: Promise | null = null;
+
+async function refreshCsrfToken(): Promise {
+ if (typeof window === "undefined") {
+ return null;
+ }
+
+ if (csrfRefreshPromise) {
+ return csrfRefreshPromise;
+ }
+
+ csrfRefreshPromise = (async () => {
+ try {
+ const response = await fetch("/api/csrf", {
+ method: "POST",
+ credentials: "same-origin",
+ cache: "no-store",
+ });
+
+ if (!response.ok) {
+ logger.warn("[axios] Failed to refresh CSRF token", {
+ status: response.status,
+ statusText: response.statusText,
+ });
+ return null;
+ }
+
+ const data = await response.json().catch(() => null);
+ const token = typeof data?.token === "string" ? data.token : null;
+
+ if (!token) {
+ logger.warn("[axios] CSRF refresh response missing token");
+ return null;
+ }
+
+ setCsrfToken(token);
+ return token;
+ } catch (error) {
+ logger.warn("[axios] Error refreshing CSRF token", error);
+ return null;
+ } finally {
+ csrfRefreshPromise = null;
+ }
+ })();
+
+ return csrfRefreshPromise;
+}
+
/**
* Check for CSP meta tag in the document.
*
@@ -230,6 +282,33 @@ let isLoggingOut401 = false;
axiosInstance.interceptors.response.use(
(response) => response,
async (error) => {
+ const originalConfig = (error?.config ?? {}) as RetryableRequestConfig & {
+ headers?: {
+ set?: (name: string, value: string) => void;
+ };
+ };
+ const responseData = error?.response?.data as { message?: string; error?: string } | undefined;
+ const csrfMessage = responseData?.message || responseData?.error || "";
+
+ if (
+ !originalConfig._csrfRetried &&
+ error?.response?.status === 403 &&
+ typeof csrfMessage === "string" &&
+ csrfMessage.toLowerCase().includes("invalid csrf token") &&
+ typeof window !== "undefined"
+ ) {
+ originalConfig._csrfRetried = true;
+ const freshToken = await refreshCsrfToken();
+
+ if (freshToken) {
+ if (originalConfig.headers?.set) {
+ originalConfig.headers.set(CSRF_HEADER, freshToken);
+ }
+ logger.info("[axios] Retrying request after CSRF token refresh");
+ return axiosInstance.request(originalConfig as never);
+ }
+ }
+
if (
!isLoggingOut401 &&
error?.response?.status === 401 &&
diff --git a/src/lib/security/auth.ts b/src/lib/security/auth.ts
index 1bcdbb84..20d51c3f 100644
--- a/src/lib/security/auth.ts
+++ b/src/lib/security/auth.ts
@@ -31,6 +31,27 @@ export const isAuthSessionMissingError = (error: unknown): boolean => {
return lowerMessage.includes("session missing") || lowerMessage.includes("auth session");
};
+/**
+ * Detects Supabase browser lock manager timeout errors.
+ * These can occur on some devices/browsers when another tab/process holds
+ * the auth lock too long; callers can treat this as a recoverable client state issue.
+ */
+export const isSupabaseLockTimeoutError = (error: unknown): boolean => {
+ if (!error || typeof error !== 'object') {
+ return false;
+ }
+ if (!('message' in error) || typeof error.message !== 'string') {
+ return false;
+ }
+
+ const lowerMessage = error.message.toLowerCase();
+ return (
+ lowerMessage.includes("navigator lockmanager") ||
+ lowerMessage.includes("exclusive navigator lockmanager lock") ||
+ (lowerMessage.includes("timed out") && lowerMessage.includes("auth-token"))
+ );
+};
+
/**
* Performs comprehensive logout with cleanup of all authentication state.
* Handles Supabase session, local storage, cookies, and redirects to home.
diff --git a/src/providers/user-settings.ts b/src/providers/user-settings.ts
index 31b65d14..081077e0 100644
--- a/src/providers/user-settings.ts
+++ b/src/providers/user-settings.ts
@@ -162,11 +162,6 @@ export function useUserSettings() {
return loadPrefetchedSettings(userId);
}, [userId]);
- // Track mutation window to prevent focus refetch from overwriting optimistic updates
- // When user toggles a setting, we set this to true during onMutate
- // and clear it after onSuccess/onError to prevent stale data from overwriting changes
- const isMutatingRef = useRef(false);
-
// Track if we've attempted initialization to prevent redundant mutation calls
// This prevents duplicate initialization during rapid refetches before mutation completes
const hasAttemptedInitializationRef = useRef(false);
@@ -207,8 +202,11 @@ export function useUserSettings() {
if (event === "SIGNED_IN" || event === "TOKEN_REFRESHED") {
hasAttemptedInitializationRef.current = false;
}
- // Only invalidate queries for a valid user ID to avoid inconsistent cache operations
- if (newUserId) {
+ // Only invalidate on SIGNED_IN (fresh login may have different settings).
+ // TOKEN_REFRESHED is Supabase's hourly auto-refresh — the user's settings haven't
+ // changed, so invalidating would fire a needless DB round-trip every hour.
+ // INITIAL_SESSION is handled naturally: `enabled: !!userId` activates the query.
+ if (newUserId && event === "SIGNED_IN") {
queryClient.invalidateQueries({ queryKey: ["userSettings", newUserId] });
}
// Also remove any queries that might have been created with null userId during initial mount
@@ -282,13 +280,15 @@ export function useUserSettings() {
// Gate the query itself on a non-null userId so we never fetch for ["userSettings", null].
enabled: !!userId,
queryFn: async () => {
- const { data: { user } } = await supabase.auth.getUser();
- if (!user) return null;
+ // userId is guaranteed non-null here because `enabled: !!userId` gates this fn.
+ // Using the ref-tracked value avoids a redundant /auth/v1/user network call —
+ // the userId was already server-validated when onAuthStateChange fired.
+ if (!userId) return null;
const { data, error } = await supabase
.from("user_settings")
.select("bunk_calculator_enabled, target_percentage")
- .eq("user_id", user.id)
+ .eq("user_id", userId)
.maybeSingle();
if (error) {
@@ -299,11 +299,13 @@ export function useUserSettings() {
return data as UserSettings | null;
},
- staleTime: 30 * 1000, // 30 seconds - reduces API load while keeping data reasonably fresh
- gcTime: 5 * 60 * 1000, // 5 minutes - keep cache for reasonable time to avoid unnecessary refetches
- // Enable window focus refetch for cross-device sync, but block during mutations
- // The mutation lifecycle is responsible for keeping isMutatingRef in sync
- refetchOnWindowFocus: () => !isMutatingRef.current,
+ staleTime: 5 * 60 * 1000, // 5 minutes — settings change rarely; no need to re-fetch on every focus
+ gcTime: 30 * 60 * 1000, // 30 minutes — keep cache long to avoid cold-start fetches on re-mount
+ // Settings don't change on another device mid-session, so window-focus refetch adds no value
+ // and only burns API quota. Mutations (save settings) already update the cache directly.
+ refetchOnWindowFocus: false,
+ // Override the global 15-min refetchInterval — user settings don't need periodic polling
+ refetchInterval: false,
retry: (failureCount, error) => {
// Retry on network errors, but not on auth errors
// This allows initial fetch attempts while auth is pending to fail gracefully
@@ -322,12 +324,15 @@ export function useUserSettings() {
// 2. Mutation to update settings
const updateSettingsMutation = useMutation({
mutationFn: async (newSettings: { bunk_calculator_enabled?: boolean; target_percentage?: number }) => {
- const { data: { user } } = await supabase.auth.getUser();
- if (!user) throw new Error(NO_USER_ERROR_MESSAGE);
+ // currentUserIdRef is populated by onAuthStateChange (server-validated).
+ // The Supabase DB call will itself reject an expired session, so no extra
+ // getUser() round-trip is needed here.
+ const mutationUserId = currentUserIdRef.current;
+ if (!mutationUserId) throw new Error(NO_USER_ERROR_MESSAGE);
const { data, error } = await supabase
.from("user_settings")
- .upsert({ user_id: user.id, ...newSettings })
+ .upsert({ user_id: mutationUserId, ...newSettings })
.select()
.single();
@@ -336,19 +341,13 @@ export function useUserSettings() {
},
// Optimistic update: update cache before server responds
onMutate: async (newSettings): Promise<{ previousSettings: UserSettings | undefined; currentUserId: string | null }> => {
- // Mark that we're in a mutation window - prevents focus refetch from pulling stale data
- isMutatingRef.current = true;
-
- // Derive userId from the same source as the mutation (getUser) to ensure
- // cache updates happen even if currentUserIdRef is stale/null.
- // getUser() validates the session with the server (unlike getSession() which reads localStorage).
- const { data: { user } } = await supabase.auth.getUser();
- const currentUserId = user?.id ?? null;
+ // Read from the ref that onAuthStateChange keeps up-to-date.
+ // Avoids a redundant /auth/v1/user call — the value was already validated server-side
+ // when the INITIAL_SESSION / SIGNED_IN event was received.
+ const currentUserId = currentUserIdRef.current;
// If no userId is available, we shouldn't proceed with cache operations
if (!currentUserId) {
- // Reset mutation window flag since we're aborting optimistic update
- isMutatingRef.current = false;
logger.dev("Mutation attempted without userId - session not available");
return { previousSettings: undefined, currentUserId: null };
}
@@ -399,9 +398,6 @@ export function useUserSettings() {
// DO NOT write to localStorage here - already done in onMutate
// This prevents redundant writes and event dispatches that cause glitches
// Server response only validates the optimistic update was correct
-
- // Clear mutation window flag - safe to refetch on focus now
- isMutatingRef.current = false;
},
onError: (err, _variables, context) => {
// Rollback to previous data on error
@@ -414,9 +410,6 @@ export function useUserSettings() {
toast.error("Failed to save settings");
Sentry.captureException(err, { tags: { type: "settings_update_error", location: "useUserSettings" } });
}
-
- // Clear mutation window flag - safe to refetch on focus now
- isMutatingRef.current = false;
}
});
@@ -437,26 +430,11 @@ export function useUserSettings() {
// Track if effect is still mounted to prevent state updates after unmount
let isMounted = true;
- // Helper to validate session is still active and belongs to the expected user
- // Returns true if session is valid, matches the expected userId, and component is still mounted
- const validateActiveSession = async (expectedUserId: string): Promise => {
- // Check current mount state from closure to prevent race conditions
- if (!isMounted) return false;
- try {
- const { data, error } = await supabase.auth.getUser();
- if (error) {
- // Log at dev level so auth/network issues are diagnosable while still treating them as "no user"
- logger.dev("Error fetching auth user in validateActiveSession:", error);
- return false;
- }
- const user = data?.user;
- // Verify user exists, matches, and component is still mounted (re-check after async)
- return !!(user && user.id === expectedUserId && isMounted);
- } catch (err) {
- // Catch any unexpected thrown errors from the Supabase client
- logger.dev("Unexpected error in validateActiveSession:", err);
- return false;
- }
+ // Verify the component is still mounted and the expected user is still the active user.
+ // Synchronous check using currentUserIdRef (kept up-to-date by onAuthStateChange).
+ // Replaces the previous async getUser() call — no extra /auth/v1/user round-trip needed.
+ const validateActiveSession = (expectedUserId: string): boolean => {
+ return isMounted && currentUserIdRef.current === expectedUserId;
};
// Async IIFE to perform storage synchronization operations
@@ -465,10 +443,9 @@ export function useUserSettings() {
if (!isMounted) return;
try {
- // Get current user ID from auth (getUser() validates the token server-side)
- const { data: { user: currentUser } } = await supabase.auth.getUser();
- const userId = currentUser?.id;
-
+ // Use the ref kept up-to-date by onAuthStateChange — no extra network call.
+ const userId = currentUserIdRef.current;
+
if (!userId) {
logger.dev("No user ID available for storage sync, skipping");
return;
@@ -484,12 +461,11 @@ export function useUserSettings() {
sessionStorage.removeItem(legacyKey);
}
- // Validate session is still active and belongs to the same user before performing localStorage operations
- // This prevents race condition where user logs out while this promise is pending
- if (!(await validateActiveSession(userId))) {
+ // Validate the session is still active and belongs to the same user.
+ if (!validateActiveSession(userId)) {
return;
}
-
+
const localBunkKey = `showBunkCalc_${userId}`;
const localBunk = localStorage.getItem(localBunkKey);
const dbBunk = (settings.bunk_calculator_enabled ?? true).toString();
@@ -529,9 +505,8 @@ export function useUserSettings() {
return;
}
- // Validate session is still active and belongs to the same user before calling mutateSettings
- // This prevents race condition where user logs out while this promise is pending
- if (!(await validateActiveSession(userId))) {
+ // Validate the session is still active and belongs to the same user.
+ if (!validateActiveSession(userId)) {
return;
}
@@ -605,9 +580,10 @@ export function useUserSettings() {
return () => {
isMounted = false;
};
- // mutateSettings is stable - it's the mutate function from useMutation and doesn't change between renders
+ // mutateSettings is stable - it's the mutate function from useMutation and doesn't change between renders.
+ // supabase.auth removed from deps: the sync effect no longer calls getUser() so doesn't need it.
// eslint-disable-next-line react-hooks/exhaustive-deps
- }, [settings, isLoading, isFetching, updateSettingsMutation.isPending, supabase.auth]);
+ }, [settings, isLoading, isFetching, updateSettingsMutation.isPending]);
return {
settings,
diff --git a/src/proxy.ts b/src/proxy.ts
index 503a6d97..19121b07 100644
--- a/src/proxy.ts
+++ b/src/proxy.ts
@@ -72,11 +72,12 @@ export async function proxy(request: NextRequest) {
const isProfileRoute = request.nextUrl.pathname.startsWith("/profile");
const isNotificationsRoute = request.nextUrl.pathname.startsWith("/notifications");
const isTrackingRoute = request.nextUrl.pathname.startsWith("/tracking");
+ const isScoresRoute = request.nextUrl.pathname.startsWith("/scores");
const isAuthRoute = request.nextUrl.pathname === "/";
const isAcceptTermsRoute = request.nextUrl.pathname === "/accept-terms";
// Protected routes that require authentication and terms acceptance
- const isProtectedRoute = isDashboardRoute || isProfileRoute || isNotificationsRoute || isTrackingRoute;
+ const isProtectedRoute = isDashboardRoute || isProfileRoute || isNotificationsRoute || isTrackingRoute || isScoresRoute;
// Scenario A: Unauthenticated users cannot access protected routes or accept-terms page
if (!user && (isProtectedRoute || isAcceptTermsRoute)) {
diff --git a/src/types/exam.d.ts b/src/types/exam.d.ts
new file mode 100644
index 00000000..35a2ddec
--- /dev/null
+++ b/src/types/exam.d.ts
@@ -0,0 +1,204 @@
+/**
+ * Represents courses linked to an exam.
+ */
+export interface ExamCourse {
+ id: number;
+ si_no: number;
+ name: string;
+ code: string;
+ department_course_code: string | null;
+ start_year: string | null;
+ end_year: string | null;
+ institution_id: number;
+ usersubgroup_id: number;
+ created_by: number;
+ created_at: string;
+ updated_at: string;
+ academic_year: string;
+ academic_semester: string;
+ pre_requisites: string | null;
+ ltp_credits: string | null;
+ reference_docs: string | null;
+ text_books: string | null;
+ course_type_id: number;
+ course_category_id: number | null;
+ deleted_at: string | null;
+ enable_laboratory: string | null;
+ pivot: {
+ exam_id: number;
+ course_id: number;
+ };
+ usersubgroup: {
+ id: number;
+ si_no: string;
+ name: string;
+ description: string | null;
+ code: string;
+ scheme: string;
+ type: string | null;
+ end_date: string;
+ start_date: string;
+ start_year: string;
+ end_year: string;
+ usergroup_id: number;
+ programme_config_group_id: number;
+ institution_id: number;
+ created_by: number;
+ deleted_at: string | null;
+ created_at: string;
+ updated_at: string;
+ academic_year: string;
+ academic_semester: string;
+ usergroup: {
+ id: number;
+ name: string;
+ description: string | null;
+ code: string;
+ affiliated_university: string;
+ scheme: string;
+ };
+ };
+}
+
+/**
+ * Represents a participant in an exam (e.g., the logged-in student).
+ */
+export interface ExamParticipant {
+ id: number;
+ starts_at: string | null;
+ end_at: string | null;
+ exam_id: number;
+ pivot: {
+ exam_id: number;
+ institution_user_id: number;
+ starts_at: string | null;
+ end_at: string | null;
+ /** Achieved score (null = not yet graded / pending) */
+ score: number | null;
+ comments: string | null;
+ absent_enable: number;
+ };
+}
+
+/**
+ * Optional exam configuration / question paper settings from EzyGo.
+ */
+export interface ExamSettings {
+ slot_number?: string;
+ questionPaperDate?: string;
+ questionPaperTime?: string;
+ questionPaperMaximumMark?: string;
+ enableEvaluationScheme?: boolean;
+ enabledHeadersCo?: boolean;
+ enabledHeadersMark?: boolean;
+ [key: string]: unknown;
+}
+
+/**
+ * Represents a single graded answer for one exam question,
+ * returned by GET /api/backend/exams/{id}/institutionuser/examanswers.
+ */
+export interface ExamAnswer {
+ id: number;
+ answer: string | null;
+ /** String-formatted score, e.g. "5.000" */
+ score: string | null;
+ choice_id: number | null;
+ examquestion_id: number;
+ student_id: number;
+ created_by: number;
+ created_at: string;
+ updated_at: string;
+ files: unknown[];
+}
+
+/**
+ * Represents a single question in an exam,
+ * returned by GET /api/backend/exams/{id}/examquestions?from_view_score=true.
+ */
+export interface ExamQuestion {
+ id: number;
+ question_no: string;
+ name: string;
+ question: Array<{ type: string; value: string | null }>;
+ summary: string | null;
+ difficulty_level: string | null;
+ /** e.g. "Theory", "Problem/Design" */
+ type: string;
+ evaluation_scheme: unknown | null;
+ allow_descriptive: number;
+ allow_attachment_answer: number;
+ answer_required: number;
+ /** String-formatted max mark, e.g. "5.0" */
+ maximum_mark: string;
+ blooms_taxonamy_level: string | null;
+ section_id: number | null;
+ module_id: number;
+ exam_id: number;
+ institution_id: number;
+ created_by: number;
+ created_at: string;
+ updated_at: string;
+ orquestion_group_id: number | null;
+ subquestion_parent_id: number | null;
+ files: unknown[];
+ choices: unknown[];
+ course_outcome: Array<{
+ id: number;
+ si_no: number;
+ name: string;
+ code: string;
+ outcome: string;
+ course_id: number;
+ institution_id: number;
+ created_by: number;
+ created_at: string | null;
+ updated_at: string | null;
+ cognitive_levels: unknown[];
+ pivot: { question_id: number; course_outcome_id: number };
+ }>;
+ programme_outcome: unknown[];
+ programme_specific_outcome: unknown[];
+}
+
+/**
+ * Represents a single exam / activity returned by GET /api/backend/exams.
+ */
+export interface Exam {
+ id: number;
+ name: string;
+ activity_name_id: number | null;
+ summary: string | null;
+ starts_at: string | null;
+ end_at: string | null;
+ return_at: string | null;
+ limitted_time_seconds: number | null;
+ category_id: number | null;
+ respond_after_close: number;
+ /** "assessment" | "assignment" or other future types */
+ activity_type: "assessment" | "assignment" | string;
+ offline_activity: number;
+ maximum_mark: number | null;
+ negative_mark: number | null;
+ positive_mark: number | null;
+ hidden: number;
+ is_objective_only: number;
+ shuffle_questions: number;
+ shuffle_choices: number;
+ exclude_from_report: number;
+ ordered_choice_list: number;
+ auto_evaluation: number;
+ publish_result: number;
+ max_co_scores: number | null;
+ co_score_evaluation: number;
+ institution_id: number;
+ settings: ExamSettings | null;
+ course_id: number | null;
+ created_by: number;
+ created_at: string;
+ updated_at: string;
+ deleted_at: string | null;
+ course: ExamCourse[];
+ activity_name: unknown | null;
+ participants: ExamParticipant[];
+}
diff --git a/src/types/index.ts b/src/types/index.ts
index 2ae6f01d..b222fe64 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -3,4 +3,5 @@ export * from "./user";
export * from "./institution";
export * from "./course";
export * from "./attendance";
-export * from "./track_attendance"
\ No newline at end of file
+export * from "./track_attendance";
+export * from "./exam";
\ No newline at end of file