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

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

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}