Merge pull request #1316 from FahidLatheef/fix/quiz-maximum-attempts

fix: fixed bug in which user can submit quiz over the maximum limit allowed

frontend/src/components/Quiz.vue

@@ -207,7 +207,7 @@
 						</Button>
 						<Button
 							v-else-if="activeQuestion != questions.length"
-							@click="nextQuetion()"
+							@click="nextQuestion()"
 						>
 							<span>
 								{{ __('Next') }}
@@ -258,14 +258,22 @@
 			</Button>
 		</div>
 		<div
-			v-if="quiz.data.show_submission_history && attempts?.data"
+			v-if="
+				quiz.data.show_submission_history &&
+				attempts?.data &&
+				attempts.data.length > 0
+			"
 			class="mt-10"
 		>
 			<ListView
 				:columns="getSubmissionColumns()"
 				:rows="attempts?.data"
 				row-key="name"
-				:options="{ selectable: false, showTooltip: false }"
+				:options="{
+					selectable: false,
+					showTooltip: false,
+					emptyState: { title: __('No Quiz submissions found') },
+				}"
 			>
 			</ListView>
 		</div>
@@ -282,7 +290,7 @@ import {
 	FormControl,
 } from 'frappe-ui'
 import { ref, watch, reactive, inject, computed } from 'vue'
-import { createToast } from '@/utils/'
+import { createToast, showToast } from '@/utils/'
 import { CheckCircle, XCircle, MinusCircle } from 'lucide-vue-next'
 import { timeAgo } from '@/utils'
 import { useRouter } from 'vue-router'
@@ -536,7 +544,7 @@ const addToLocalStorage = () => {
 	localStorage.setItem(quiz.data.title, JSON.stringify(quizData))
 }
 
-const nextQuetion = () => {
+const nextQuestion = () => {
 	if (!quiz.data.show_answers && questionDetails.data?.type != 'Open Ended') {
 		checkAnswer()
 	} else {
@@ -574,6 +582,16 @@ const createSubmission = () => {
 				if (quiz.data && quiz.data.max_attempts) attempts.reload()
 				if (quiz.data.duration) clearInterval(timerInterval)
 			},
+			onError(err) {
+				const errorTitle = err?.message || ''
+				if (errorTitle.includes('MaximumAttemptsExceededError')) {
+					const errorMessage = err.messages?.[0] || err
+					showToast(__('Error'), __(errorMessage), 'x')
+					setTimeout(() => {
+						window.location.reload()
+					}, 3000)
+				}
+			},
 		}
 	)
 }