fix(exam): fix startexam function (not finding examdata)

app/(tabs)/leaderboard/page.tsx

@@ -130,17 +130,19 @@ const page = () => {
                   className="flex bg-[#113768] rounded-[8] py-2 px-4 justify-between items-center"
                 >
                   <div className=" flex gap-3 items-center">
-                    <h2 className="font-medium text-lg text-white">
+                    <h2 className="font-medium text-sm text-white">
                       {user.rank}
                     </h2>
                     <Avatar className="bg-slate-300 w-6 h-6">
-                      <AvatarFallback className="text-md font-semibold">
+                      <AvatarFallback className="text-sm font-semibold">
                         {user.name.charAt(0).toUpperCase()}
                       </AvatarFallback>
                     </Avatar>
                     <h3 className="font-medium text-sm text-white">You</h3>
                   </div>
-                  <p className="font-medium text-white/70">{user.points}pt</p>
+                  <p className="font-medium text-white/70 text-sm">
+                    {user.points}pt
+                  </p>
                 </div>
               ))}
             </section>
@@ -154,9 +156,9 @@ const page = () => {
                     className="flex border-2 border-[#c5dbf8] rounded-[8] py-2 px-4 justify-between items-center"
                   >
                     <div className="flex gap-3 items-center">
-                      <h2 className="font-medium text-lg">{idx + 1}</h2>
+                      <h2 className="font-medium text-sm">{idx + 1}</h2>
                       <Avatar className="bg-slate-300 w-6 h-6">
-                        <AvatarFallback className="text-md font-semibold">
+                        <AvatarFallback className="text-sm font-semibold">
                           {user.name.charAt(0).toUpperCase()}
                         </AvatarFallback>
                       </Avatar>
@@ -164,7 +166,7 @@ const page = () => {
                         {user.name.split(" ").slice(0, 2).join(" ")}
                       </h3>
                     </div>
-                    <p className="font-medium text-[#000]/40">
+                    <p className="font-medium text-[#000]/40 text-sm">
                       {user.points}pt
                     </p>
                   </div>

app/exam/pretest/page.tsx

@@ -82,10 +82,9 @@ export default function PretestPage() {
 
   function handleStartExam() {
     setCurrentExam(examData);
-    startExam();
+    startExam(examData); // Pass examData directly
     router.push(`/exam/${id}?time=${metadata?.metadata.duration}`);
   }
-
   return (
     <BackgroundWrapper>
       <div className="min-h-screen flex flex-col justify-between">

components/Header.tsx

@@ -110,7 +110,7 @@ const Header = ({
             </AvatarFallback>
           </Avatar>
           <span className={styles.text}>
-            Hello {userData?.name ? userData.name.split(" ")[0] : ""}
+            Hello, {userData?.name ? userData.name.split(" ")[0] : ""}
           </span>
         </div>
       )}

components/QuestionItem.tsx

@@ -30,16 +30,18 @@ const QuestionItem = (props: QuestionItemProps) => {
         {question.id}. {question.question}
       </h3>
 
-      <div className="flex justify-between items-center mb-4">
-        <div></div>
-        <button onClick={() => setBookmark(!bookmark)}>
-          {bookmark ? (
-            <BookmarkCheck size={25} color="#113768" />
-          ) : (
-            <Bookmark size={25} color="#113768" />
-          )}
-        </button>
-      </div>
+      {isExam && (
+        <div className="flex justify-between items-center mb-4">
+          <div></div>
+          <button onClick={() => setBookmark(!bookmark)}>
+            {bookmark ? (
+              <BookmarkCheck size={25} color="#113768" />
+            ) : (
+              <Bookmark size={25} color="#113768" />
+            )}
+          </button>
+        </div>
+      )}
 
       {isExam ? (
         <div className="flex flex-col gap-4 items-start">
@@ -70,7 +72,7 @@ const QuestionItem = (props: QuestionItemProps) => {
           })}
         </div>
       ) : (
-        <>
+        <div className="flex flex-col gap-3">
           <div className="flex justify-between items-center">
             <div></div>
 
@@ -121,7 +123,7 @@ const QuestionItem = (props: QuestionItemProps) => {
             <h3 className="text-lg font-bold text-black/40">Solution:</h3>
             <p className="text-lg">{question.solution}</p>
           </div>
-        </>
+        </div>
       )}
     </div>
   );

context/ExamContext.tsx

@@ -86,18 +86,21 @@ export const ExamProvider: React.FC<{ children: ReactNode }> = ({
     setCurrentAttemptState(null);
   };
 
-  const startExam = () => {
-    if (!currentExam) {
+  const startExam = (exam?: Exam) => {
+    const examToUse = exam || currentExam;
+
+    if (!examToUse) {
       console.warn("No exam selected, redirecting to /unit");
       router.push("/unit");
       return;
     }
 
     const attempt: ExamAttempt = {
-      examId: currentExam.id,
-      exam: currentExam,
+      examId: examToUse.id,
+      exam: examToUse,
       answers: [],
       startTime: new Date(),
+      totalQuestions: 0,
     };
 
     setCurrentAttemptState(attempt);