generated from muhtadeetaron/nextjs-template
feat(ui): add modal functionality, leaderboard view
This commit is contained in:
@ -31,18 +31,18 @@ const QuestionItem = ({ question, selectedAnswer }: QuestionItemProps) => (
|
||||
<div className="flex justify-between items-center">
|
||||
<div></div>
|
||||
|
||||
{selectedAnswer?.answer === question.correctAnswer ? (
|
||||
{!selectedAnswer ? (
|
||||
<Badge className="bg-yellow-500" variant="destructive">
|
||||
Skipped
|
||||
</Badge>
|
||||
) : selectedAnswer.answer === question.correctAnswer ? (
|
||||
<Badge className="bg-green-500 text-white" variant="default">
|
||||
Correct
|
||||
</Badge>
|
||||
) : selectedAnswer?.answer !== question.correctAnswer ? (
|
||||
) : (
|
||||
<Badge className="bg-red-500 text-white" variant="default">
|
||||
Incorrect
|
||||
</Badge>
|
||||
) : (
|
||||
<Badge className="bg-yellow-500" variant="destructive">
|
||||
Skipped
|
||||
</Badge>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@ -74,7 +74,7 @@ const QuestionItem = ({ question, selectedAnswer }: QuestionItemProps) => (
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
<div className="h-[0.5px] border-[0.5px] border-dashed border-black/20"></div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<h3 className="text-lg font-bold text-black/40">Solution:</h3>
|
||||
<p className="text-lg">{question.solution}</p>
|
||||
@ -96,6 +96,7 @@ export default function ResultsPage() {
|
||||
|
||||
try {
|
||||
examResults = useExamResults();
|
||||
console.log(examResults);
|
||||
} catch (error) {
|
||||
// Handle case where there's no completed exam
|
||||
return (
|
||||
@ -221,12 +222,16 @@ export default function ResultsPage() {
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-white">
|
||||
<button className="p-10" onClick={() => router.push("/unit")}>
|
||||
<button className="p-10" onClick={() => handleBackToHome()}>
|
||||
<ArrowLeft size={30} color="black" />
|
||||
</button>
|
||||
<div className="bg-white rounded-lg shadow-lg px-10 pb-20">
|
||||
<h1 className="text-2xl font-bold text-gray-900 mb-4 text-center">
|
||||
Keep up the good work!
|
||||
<h1 className="text-2xl font-bold text-[#113768] mb-4 text-center">
|
||||
{examResults?.score < 30
|
||||
? "Try harder!"
|
||||
: examResults?.score < 70
|
||||
? "Getting Better"
|
||||
: "You did great!"}
|
||||
</h1>
|
||||
|
||||
{/* Score Display */}
|
||||
@ -246,16 +251,6 @@ export default function ResultsPage() {
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<div className="flex gap-4 items-center mb-6 text-sm text-gray-600">
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-4 h-4 bg-green-600 rounded-full"></div>{" "}
|
||||
Correct
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-4 h-4 bg-red-600 rounded-full"></div> Your
|
||||
Answer (Incorrect)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user