fix: misc changes

frontend/src/pages/CreateLesson.vue

@@ -69,26 +69,18 @@
 	</div>
 </template>
 <script setup>
-import {
-	Breadcrumbs,
-	FormControl,
-	createResource,
-	Button,
-	createDocumentResource,
-} from 'frappe-ui'
+import { Breadcrumbs, FormControl, createResource, Button } from 'frappe-ui'
 import { computed, reactive, onMounted, inject, ref, watch } from 'vue'
 import EditorJS from '@editorjs/editorjs'
 import { createToast } from '../utils'
 import LessonPlugins from '@/components/LessonPlugins.vue'
 import { getEditorTools } from '../utils'
 import { ChevronRight } from 'lucide-vue-next'
-import { useRouter } from 'vue-router'
 
 const editor = ref(null)
 const instructorEditor = ref(null)
 const user = inject('$user')
 const openInstructorEditor = ref(false)
-const router = useRouter()
 
 const props = defineProps({
 	courseName: {

frontend/src/pages/Lesson.vue

@@ -145,8 +145,9 @@
 					/>
 				</div>
 				<div class="mt-20">
+					{{ allowDiscussions }}
 					<Discussions
-						v-if="allowDiscussions()"
+						v-if="allowDiscussions"
 						:title="'Questions'"
 						:doctype="'Course Lesson'"
 						:docname="lesson.data.name"
@@ -185,7 +186,7 @@
 </template>
 <script setup>
 import { createResource, Breadcrumbs, Button } from 'frappe-ui'
-import { computed, watch, ref, inject, createApp } from 'vue'
+import { computed, watch, inject, ref } from 'vue'
 import CourseOutline from '@/components/CourseOutline.vue'
 import UserAvatar from '@/components/UserAvatar.vue'
 import { useRoute } from 'vue-router'
@@ -198,7 +199,9 @@ import CourseInstructors from '@/components/CourseInstructors.vue'
 
 const user = inject('$user')
 const route = useRoute()
-let editor, instructorEditor
+const allowDiscussions = ref(false)
+const editor = ref(null)
+const instructorEditor = ref(null)
 
 const props = defineProps({
 	courseName: {
@@ -228,13 +231,24 @@ const lesson = createResource({
 	auto: true,
 	onSuccess(data) {
 		markProgress(data)
-
-		if (data.content) editor = renderEditor('editor', data.content)
+		console.log('success')
+		if (data.content) editor.value = renderEditor('editor', data.content)
 		if (data.instructor_content?.blocks?.length)
-			instructorEditor = renderEditor(
+			instructorEditor.value = renderEditor(
 				'instructor-content',
 				data.instructor_content
 			)
+		editor.value?.isReady.then(() => {
+			checkIfDiscussionsAllowed()
+		})
+		console.log(editor.value)
+		console.log(data.body)
+		if (!editor.value && data.body) {
+			const quizRegex = /\{\{ Quiz\(".*"\) \}\}/
+			const hasQuiz = quizRegex.test(data.body)
+			console.log(hasQuiz)
+			if (!hasQuiz) allowDiscussions.value = true
+		}
 	},
 })
 
@@ -292,6 +306,8 @@ watch(
 		[oldChapterNumber, oldLessonNumber]
 	) => {
 		if (newChapterNumber || newLessonNumber) {
+			editor.value = null
+			instructorEditor.value = null
 			lesson.submit({
 				chapter: newChapterNumber,
 				lesson: newLessonNumber,
@@ -300,12 +316,21 @@ watch(
 	}
 )
 
-const allowDiscussions = () => {
-	return (
-		lesson.data?.membership ||
-		user.data?.is_moderator ||
-		user.data?.is_instructor
+const checkIfDiscussionsAllowed = () => {
+	let quizPresent = false
+	console.log(lesson.data?.content)
+	JSON.parse(lesson.data?.content)?.blocks?.forEach((block) => {
+		if (block.type === 'quiz') quizPresent = true
+	})
+
+	if (
+		!quizPresent &&
+		(lesson.data?.membership ||
+			user.data?.is_moderator ||
+			user.data?.is_instructor)
 	)
+		allowDiscussions.value = true
+	else allowDiscussions.value = false
 }
 
 const allowEdit = () => {

frontend/src/pages/Profile.vue

@@ -87,7 +87,7 @@
 </template>
 <script setup>
 import { Breadcrumbs, createResource, Button, TabButtons } from 'frappe-ui'
-import { computed, inject, reactive, ref, onMounted, watchEffect } from 'vue'
+import { computed, inject, watch, ref, onMounted, watchEffect } from 'vue'
 import { sessionStore } from '@/stores/session'
 import { Edit } from 'lucide-vue-next'
 import UserAvatar from '@/components/UserAvatar.vue'
@@ -119,11 +119,13 @@ onMounted(() => {
 
 const profile = createResource({
 	url: 'frappe.client.get',
-	params: {
-		doctype: 'User',
-		filters: {
-			username: props.username,
-		},
+	makeParams(values) {
+		return {
+			doctype: 'User',
+			filters: {
+				username: props.username,
+			},
+		}
 	},
 })
 
@@ -165,6 +167,13 @@ watchEffect(() => {
 	}
 })
 
+watch(
+	() => props.username,
+	() => {
+		profile.reload()
+	}
+)
+
 const editProfile = () => {
 	showProfileModal.value = true
 }

frontend/src/pages/ProfileAbout.vue

@@ -12,12 +12,12 @@
 			{{ __('No introduction') }}
 		</div>
 	</div>
-	<div class="mt-7 mb-10">
+	<div class="mt-7 mb-10" v-if="badges.data">
 		<h2 class="mb-3 text-lg font-semibold text-gray-900">
 			{{ __('Achievements') }}
 		</h2>
 		<div class="grid grid-cols-5 gap-4">
-			<div v-if="badges.data" v-for="badge in badges.data">
+			<div v-for="badge in badges.data">
 				<Popover trigger="hover" :leaveDelay="Number(0.01)">
 					<template #target>
 						<div class="relative">
@@ -67,18 +67,24 @@
 											size="sm"
 											@click="shareOnSocial(badge, 'LinkedIn')"
 										>
-											<template #icon>
-												<LinkedinIcon
-													class="h-3 w-3 stroke-1.5 text-gray-700"
-												/>
+											<template #prefix>
+												<LinkedinIcon class="h-3 w-3 text-gray-700" />
 											</template>
+											<span class="text-xs">
+												{{ __('LinkedIn') }}
+											</span>
 										</Button>
 										<Button
 											variant="outline"
 											size="sm"
 											@click="shareOnSocial(badge, 'Twitter')"
 										>
-											<Twitter class="h-3 w-3 stroke-1.5 text-gray-700" />
+											<template #prefix>
+												<Twitter class="h-3 w-3 text-gray-700" />
+											</template>
+											<span class="text-xs">
+												{{ __('Twitter') }}
+											</span>
 										</Button>
 									</div>
 								</div>