fix: misc issues

frontend/src/components/Modals/EvaluationModal.vue

@@ -130,11 +130,14 @@ function submitEvaluation(close) {
 			close()
 		},
 		onError(err) {
+			let message = err.messages?.[0] || err
+			let unavailabilityMessage = message.includes('unavailable')
+
 			createToast({
-				title: 'Error',
-				text: err.messages?.[0] || err,
-				icon: 'x',
-				iconClasses: 'bg-red-600 text-white rounded-md p-px',
+				title: unavailabilityMessage ? 'Evaluator is Unavailable' : 'Error',
+				text: message,
+				icon: unavailabilityMessage ? 'alert-circle' : 'x',
+				iconClasses: 'bg-yellow-600 text-white rounded-md p-px',
 				position: 'top-center',
 				timeout: 10,
 			})

frontend/src/pages/CertifiedParticipants.vue

@@ -18,7 +18,10 @@
 	</header>
 
 	<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 m-5">
-		<div v-if="participants.data" v-for="participant in participants.data">
+		<div
+			v-if="participants.data?.length"
+			v-for="participant in participantsList"
+		>
 			<router-link
 				:to="{
 					name: 'Profile',
@@ -59,12 +62,7 @@ const searchQuery = ref('')
 const participants = createResource({
 	url: 'lms.lms.api.get_certified_participants',
 	method: 'GET',
-	debounce: 300,
-	makeParams(values) {
-		return {
-			search_query: searchQuery.value,
-		}
-	},
+	cache: 'certified-participants',
 	auto: true,
 })
 
@@ -79,5 +77,16 @@ const pageMeta = computed(() => {
 	}
 })
 
+const participantsList = computed(() => {
+	if (searchQuery.value) {
+		return participants.data.filter((participant) => {
+			return participant.full_name
+				.toLowerCase()
+				.includes(searchQuery.value.toLowerCase())
+		})
+	}
+	return participants.data
+})
+
 updateDocumentTitle(pageMeta)
 </script>

frontend/src/utils/index.js

@@ -79,15 +79,18 @@ export function getFileSize(file_size) {
 	return value
 }
 
-export function showToast(title, text, icon) {
+export function showToast(title, text, icon, iconClasses = null) {
+	if (!iconClasses) {
+		iconClasses =
+			icon == 'check'
+				? 'bg-green-600 text-white rounded-md p-px'
+				: 'bg-red-600 text-white rounded-md p-px'
+	}
 	createToast({
 		title: title,
 		text: htmlToText(text),
 		icon: icon,
-		iconClasses:
-			icon == 'check'
-				? 'bg-green-600 text-white rounded-md p-px'
-				: 'bg-red-600 text-white rounded-md p-px',
+		iconClasses: iconClasses,
 		position: icon == 'check' ? 'bottom-right' : 'top-center',
 		timeout: 5,
 	})