shafin808s/examjam-frontend
1
0
Fork 0
generated from muhtadeetaron/nextjs-template
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): fix results screen

Browse Source
This commit is contained in:
shafin-r
2025-07-22 17:59:15 +06:00
parent 5245ab878d
commit 341a46e788
8 changed files with 450 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

99
lib/resultViews.tsx Normal file
View File

@ -0,0 +1,99 @@
// lib/resultViews.tsx
import Image from "next/image";
interface ExamResults {
score: number;
totalQuestions: number;
answers: string[];
}
export const getResultViews = (examResults: ExamResults | null) => [
{
id: 1,
content: (
<div className="w-full">
<div className="bg-blue-50/60 border border-[#113678]/50 rounded-4xl h-[170px] flex flex-col items-center justify-center gap-4">
<div className="text-xl text-black">
<span className="font-bold">Accuracy</span> Rate:
</div>
<div className="flex gap-4">
<Image
src="/images/icons/accuracy.png"
alt="accuracy"
width={60}
height={60}
/>
<h2 className="text-6xl font-bold text-[#113678]">
{examResults
? (
(examResults.score / examResults.totalQuestions) *
100
).toFixed(1)
: "0"}
%
</h2>
</div>
</div>
</div>
),
},
{
id: 2,
content: (
<div className="w-full">
<div className="bg-blue-50/60 border border-[#113678]/50 rounded-4xl h-[170px] flex flex-col items-center justify-center gap-3">
<div className="text-xl text-black">
<span className="font-bold">Error</span> Rate:
</div>
<div className="flex gap-4">
<Image
src="/images/icons/error.png"
alt="error"
width={60}
height={60}
/>
<h2 className="text-6xl font-bold text-[#113678]">
{examResults
? (
((examResults.totalQuestions - examResults.score) /
examResults.totalQuestions) *
100
).toFixed(1)
: "0"}
%
</h2>
</div>
</div>
</div>
),
},
{
id: 3,
content: (
<div className="my-8 w-full">
<div className="bg-blue-50/60 border border-[#113678]/50 rounded-4xl h-[170px] flex flex-col items-center justify-center gap-4">
<div className="text-xl text-black">
<span className="font-bold">Attempt</span> Rate:
</div>
<div className="flex gap-4">
<Image
src="/images/icons/attempt.png"
alt="attempt"
width={60}
height={60}
/>
<h2 className="text-6xl font-bold text-[#113678]">
{examResults
? (
(examResults.answers.length / examResults.totalQuestions) *
100
).toFixed(1)
: "0"}
%
</h2>
</div>
</div>
</div>
),
},
];