Elijah/Study
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Numeroud bug fixes, UI improvements, small animations
Some checks failed
Automated Container Build / build-and-push (push) Failing after 3s
Details

Browse source
This commit is contained in:
Elijah 2026-06-27 19:50:10 -07:00
parent b7ce314f01
commit d76ec4a69f
10 changed files with 249 additions and 82 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/app/(protected)/[classSlug]/quizzes/[quizId]/page.tsx
View file

@ -56,6 +56,24 @@ export default function QuizStudyPage() {
const [loading, setLoading] = useState(true);
const [view, setView] = useState<"history" | "take">("take");
const [retakeIds, setRetakeIds] = useState<string[] | null>(null);
const [restartKey, setRestartKey] = useState(0);
async function handleRestart() {
if (!quiz) return;
// Clear progress in database
await fetch("/api/progress", {
method: "DELETE",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ contentType: "QUIZ", contentId: quiz.id, mode: "SEQUENTIAL" })
}).catch(() => {});
// Clear locally and force remount
setQuiz({ ...quiz, progress: [] });
setRetakeIds(null);
setRestartKey(prev => prev + 1);
setView("take");
}
const fetchQuizAndAttempts = useCallback(async () => {
try {
@ -121,7 +139,18 @@ export default function QuizStudyPage() {
</div>
{/* View toggle & Share */}
<div className="flex items-center gap-4">
<div className="flex items-center gap-2 md:gap-4">
{view === "take" && (
<button
onClick={handleRestart}
className="p-1.5 rounded-lg text-text-muted hover:text-text-heading hover:bg-bg-surface-alt transition-all duration-200 cursor-pointer"
title="Restart Quiz"
>
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
</svg>
</button>
)}
<ShareMenu targetType="QUIZ" contentId={quiz.id} classSlug={classSlug} />
{attempts.length > 0 && (
@ -163,6 +192,7 @@ export default function QuizStudyPage() {
/>
) : (
<QuizViewer
key={restartKey}
quiz={quiz}
retakeIds={retakeIds}
onFinished={() => {

14
src/app/(protected)/[classSlug]/quizzes/page.tsx
View file

@ -12,11 +12,13 @@ interface QuizItem {
_count: { questions: number; attempts: number };
}
const cache: Record<string, QuizItem[]> = {};
export default function QuizzesPage() {
const params = useParams();
const classSlug = params.classSlug as string;
const [quizzes, setQuizzes] = useState<QuizItem[]>([]);
const [loading, setLoading] = useState(true);
const [quizzes, setQuizzes] = useState<QuizItem[]>(cache[classSlug] || []);
const [loading, setLoading] = useState(!cache[classSlug]);
const [showImport, setShowImport] = useState(false);
const [classId, setClassId] = useState<string>("");
@ -25,7 +27,9 @@ export default function QuizzesPage() {
const res = await fetch(`/api/quizzes/list?classId=${cId}`);
if (res.ok) {
const data = await res.json();
setQuizzes(Array.isArray(data) ? data : []);
const arr = Array.isArray(data) ? data : [];
setQuizzes(arr);
cache[classSlug] = arr;
}
} catch {
setQuizzes([]);
@ -89,7 +93,7 @@ export default function QuizzesPage() {
{/* Empty state */}
{!loading && quizzes.length === 0 && (
<div className="text-center py-16">
<div className="text-center py-16 animate-fade-in">
<div className="inline-flex items-center justify-center w-16 h-16 rounded-2xl bg-bg-callout mb-4">
<svg className="w-8 h-8 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
@ -108,7 +112,7 @@ export default function QuizzesPage() {
{/* Quiz grid */}
{!loading && quizzes.length > 0 && (
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 animate-fade-in">
{quizzes.map((quiz) => (
<div
key={quiz.id}