feat: eval and certification flow with purchased certificate

frontend/src/components/CertificationLinks.vue

@@ -0,0 +1,67 @@
+<template>
+	<div
+		v-if="
+			certification.data &&
+			certification.data.membership &&
+			certification.data.paid_certificate &&
+			user.data?.is_student
+		"
+	>
+		<router-link
+			v-if="!certification.data.membership.purchased_certificate"
+			:to="{
+				name: 'Billing',
+				params: {
+					type: 'certificate',
+					name: courseName,
+				},
+			}"
+		>
+			<Button class="w-full">
+				<template #prefix>
+					<GraduationCap class="size-4 stroke-1.5" />
+				</template>
+				{{ __('Get Certified') }}
+			</Button>
+		</router-link>
+		<router-link
+			v-else-if="!certification.data.membership.certficate"
+			:to="{
+				name: 'CourseCertification',
+				params: {
+					courseName: courseName,
+				},
+			}"
+		>
+			<Button class="w-full">
+				<template #prefix>
+					<GraduationCap class="size-4 stroke-1.5" />
+				</template>
+				{{ __('Get Certified') }}
+			</Button>
+		</router-link>
+	</div>
+</template>
+<script setup>
+import { Button, createResource } from 'frappe-ui'
+import { inject } from 'vue'
+import { GraduationCap } from 'lucide-vue-next'
+
+const user = inject('$user')
+
+const props = defineProps({
+	courseName: {
+		type: String,
+		required: true,
+	},
+})
+
+const certification = createResource({
+	url: 'lms.lms.api.get_certification_details',
+	params: {
+		course: props.courseName,
+	},
+	auto: true,
+	cache: ['certificationData', user.data?.name],
+})
+</script>

frontend/src/components/CourseCardOverlay.vue

@@ -9,27 +9,29 @@
 			<div v-if="course.data.paid_course" class="text-2xl font-semibold mb-3">
 				{{ course.data.price }}
 			</div>
-			<router-link
-				v-if="course.data.membership"
-				:to="{
-					name: 'Lesson',
-					params: {
-						courseName: course.name,
-						chapterNumber: course.data.current_lesson
-							? course.data.current_lesson.split('-')[0]
-							: 1,
-						lessonNumber: course.data.current_lesson
-							? course.data.current_lesson.split('-')[1]
-							: 1,
-					},
-				}"
-			>
-				<Button variant="solid" size="md" class="w-full">
-					<span>
-						{{ __('Continue Learning') }}
-					</span>
-				</Button>
-			</router-link>
+			<div v-if="course.data.membership" class="space-y-2">
+				<router-link
+					:to="{
+						name: 'Lesson',
+						params: {
+							courseName: course.name,
+							chapterNumber: course.data.current_lesson
+								? course.data.current_lesson.split('-')[0]
+								: 1,
+							lessonNumber: course.data.current_lesson
+								? course.data.current_lesson.split('-')[1]
+								: 1,
+						},
+					}"
+				>
+					<Button variant="solid" size="md" class="w-full">
+						<span>
+							{{ __('Continue Learning') }}
+						</span>
+					</Button>
+				</router-link>
+				<CertificationLinks :courseName="course.data.name" />
+			</div>
 			<router-link
 				v-else-if="course.data.paid_course"
 				:to="{
@@ -133,6 +135,7 @@ import { Button, createResource } from 'frappe-ui'
 import { showToast, formatAmount } from '@/utils/'
 import { capture } from '@/telemetry'
 import { useRouter } from 'vue-router'
+import CertificationLinks from '@/components/CertificationLinks.vue'
 
 const router = useRouter()
 const user = inject('$user')

frontend/src/components/Modals/EvaluationModal.vue

@@ -169,6 +169,11 @@ const getCourses = () => {
 			})
 		}
 	}
+
+	if (courses.length == 1) {
+		evaluation.course = courses[0].value
+	}
+
 	return courses
 }
 

frontend/src/components/UpcomingEvaluations.vue

@@ -4,7 +4,13 @@
 			<div class="text-lg font-semibold">
 				{{ __('Upcoming Evaluations') }}
 			</div>
-			<Button @click="openEvalModal">
+			<Button
+				v-if="
+					!upcoming_evals.data?.length ||
+					upcoming_evals.length == courses.length
+				"
+				@click="openEvalModal"
+			>
 				{{ __('Schedule Evaluation') }}
 			</Button>
 		</div>
@@ -60,7 +66,7 @@
 			</div>
 		</div>
 		<div v-else class="text-sm italic text-ink-gray-5">
-			{{ __('No upcoming evaluations.') }}
+			{{ __('Please schedule an evaluation to get certified.') }}
 		</div>
 	</div>
 	<EvaluationModal