fix: time duration + sorting questions

gdgbari · Oct 12, 2024 · ebf07f8 · ebf07f8
1 parent fc8a575
commit ebf07f8
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/src/react/components/QuizCard.tsx b/src/react/components/QuizCard.tsx
@@ -15,7 +15,7 @@ export function QuizCard({ quiz }: { quiz: Quiz }) {
                 <p> {quiz.questionList.length} questions {quiz.isOpen == false? "(closed)": null}</p>
                 <div className='flex flex-1' />
                 <div className='flex justify-between w-full'>
-                    <p> time: {quiz.timerDuration/1e12} s</p>
+                    <p> time: {quiz.timerDuration/1000} s</p>
                     <small>{quiz.quizId}</small>
                 </div>
 

diff --git a/src/react/pages/app/QuizInfo.tsx b/src/react/pages/app/QuizInfo.tsx
@@ -108,7 +108,7 @@ const QuizDetails = ({ quiz }: { quiz: Quiz }) => {
             <h2 className="text-xl font-bold mr-4 w-40">Timer Duration: </h2>
             <Input
                 className="input input-bordered w-full  no-control text-white"
-                value={`${quiz.timerDuration/1e12} s`}
+                value={`${quiz.timerDuration/1000} s`}
                 readOnly={true}
             />
         </div>
@@ -125,7 +125,13 @@ const QuizDetails = ({ quiz }: { quiz: Quiz }) => {
                 <div key={q.questionId} className="mt-4">
                     <h3 className="text-2xl font-medium">{i + 1}. {q.text} ({q.value??"?"} points)</h3>
 
-                    {q.answerList.map((a) => (
+                    {q.answerList.sort(
+                        (a,b) =>
+                            // Correct answer first
+                            a.id == q.correctAnswer?-1:b.id == q.correctAnswer?1:
+                            // Then sort by id (avoids shuffling on refresh)
+                            a.id.localeCompare(b.id)
+                    ).map((a) => (
                         <div key={a.id} className="flex mt-4 gap-4">
                             <Radio readOnly={true} checked={q.correctAnswer == a.id} />
                             <p className="text-xl">{a.text}</p></div>