fix: misc issues

frontend/src/components/AppSidebar.vue

@@ -18,20 +18,28 @@
 			</div>
 			<div
 				v-if="sidebarSettings.data?.web_pages?.length || isModerator"
-				class="mt-4 pt-1 border-t border-gray-200"
+				class="pt-1"
 			>
 				<div
-					v-if="isModerator"
-					class="flex items-center justify-between pr-2"
-					:class="isSidebarCollapsed ? 'pl-3' : 'pl-5'"
+					class="flex items-center justify-between pr-2 cursor-pointer"
+					:class="isSidebarCollapsed ? 'pl-3' : 'pl-4'"
+					@click="showWebPages = !showWebPages"
 				>
-					<span
+					<div
 						v-if="!isSidebarCollapsed"
-						class="text-sm font-medium text-gray-600"
+						class="flex items-center text-sm font-medium text-gray-600"
 					>
-						{{ __('Web Pages') }}
-					</span>
-					<Button variant="ghost" @click="openPageModal()">
+						<span class="grid h-5 w-6 flex-shrink-0 place-items-center">
+							<ChevronRight
+								class="h-4 w-4 stroke-1.5 text-gray-900 transition-all duration-300 ease-in-out"
+								:class="{ 'rotate-90': showWebPages }"
+							/>
+						</span>
+						<span class="ml-2">
+							{{ __('Web Pages') }}
+						</span>
+					</div>
+					<Button v-if="isModerator" variant="ghost" @click="openPageModal()">
 						<template #icon>
 							<Plus class="h-4 w-4 text-gray-700 stroke-1.5" />
 						</template>
@@ -39,7 +47,8 @@
 				</div>
 				<div
 					v-if="sidebarSettings.data?.web_pages?.length"
-					class="flex flex-col"
+					class="flex flex-col transition-all duration-300 ease-in-out"
+					:class="showWebPages ? 'block' : 'hidden'"
 				>
 					<SidebarLink
 						v-for="link in sidebarSettings.data.web_pages"
@@ -87,7 +96,7 @@ import { ref, onMounted, inject, watch } from 'vue'
 import { getSidebarLinks } from '../utils'
 import { usersStore } from '@/stores/user'
 import { sessionStore } from '@/stores/session'
-import { Plus } from 'lucide-vue-next'
+import { ChevronRight, Plus } from 'lucide-vue-next'
 import { createResource, Button } from 'frappe-ui'
 import PageModal from '@/components/Modals/PageModal.vue'
 
@@ -99,6 +108,7 @@ const sidebarLinks = ref(getSidebarLinks())
 const showPageModal = ref(false)
 const isModerator = ref(false)
 const pageToEdit = ref(null)
+const showWebPages = ref(false)
 
 onMounted(() => {
 	socket.on('publish_lms_notifications', (data) => {

frontend/src/components/BatchOverlay.vue

@@ -41,7 +41,7 @@
 			</span>
 		</div>
 		<router-link
-			v-if="user?.data?.is_moderator"
+			v-if="isModerator || isStudent"
 			:to="{
 				name: 'Batch',
 				params: {
@@ -51,7 +51,7 @@
 		>
 			<Button variant="solid" class="w-full mt-4">
 				<span>
-					{{ __('Manage Batch') }}
+					{{ isModerator ? __('Manage Batch') : __('Visit Batch') }}
 				</span>
 			</Button>
 		</router-link>
@@ -65,7 +65,7 @@
 			}"
 			v-else-if="batch.data.paid_batch && batch.data.seats_left"
 		>
-			<Button class="w-full mt-4" variant="solid">
+			<Button v-if="!isStudent" class="w-full mt-4" variant="solid">
 				<span>
 					{{ __('Register Now') }}
 				</span>
@@ -79,7 +79,7 @@
 			{{ __('Enroll Now') }}
 		</Button>
 		<router-link
-			v-if="user?.data?.is_moderator"
+			v-if="isModerator"
 			:to="{
 				name: 'BatchCreation',
 				params: {
@@ -117,4 +117,12 @@ const seats_left = computed(() => {
 	}
 	return null
 })
+
+const isStudent = computed(() => {
+	return props.batch.data?.students?.includes(user.data?.name)
+})
+
+const isModerator = computed(() => {
+	return user.data?.is_moderator
+})
 </script>

frontend/src/components/CourseOutline.vue

@@ -190,7 +190,8 @@ const updateLessonIndex = createResource({
 	makeParams(values) {
 		return {
 			lesson: values.lesson,
-			chapter: values.chapter,
+			sourceChapter: values.sourceChapter,
+			targetChapter: values.targetChapter,
 			idx: values.idx,
 		}
 	},
@@ -217,13 +218,10 @@ const getCurrentChapter = () => {
 }
 
 const updateOutline = (e) => {
-	console.log(e)
-	const sourceChapter = e.from.dataset.chapter
-	const targetChapter = e.to.dataset.chapter
-	const lesson = e.item.__draggable_context.element.name
 	updateLessonIndex.submit({
-		lesson: lesson,
-		chapter: sourceChapter,
+		lesson: e.item.__draggable_context.element.name,
+		sourceChapter: e.from.dataset.chapter,
+		targetChapter: e.to.dataset.chapter,
 		idx: e.newIndex,
 	})
 }

frontend/src/components/SidebarLink.vue

@@ -20,7 +20,7 @@
 				</slot>
 			</Tooltip>
 			<span
-				class="flex-shrink-0 text-base duration-300 ease-in-out"
+				class="flex-shrink-0 text-sm duration-300 ease-in-out"
 				:class="
 					isCollapsed
 						? 'ml-0 w-0 overflow-hidden opacity-0'
@@ -38,12 +38,12 @@
 			>
 				<component
 					:is="icons['Edit']"
-					class="h-3 w-3 stroke-1.5 text-gray-800"
+					class="h-3 w-3 stroke-1.5 text-gray-700"
 					@click.stop="openModal(link)"
 				/>
 				<component
 					:is="icons['X']"
-					class="h-3 w-3 stroke-1.5 text-gray-800"
+					class="h-3 w-3 stroke-1.5 text-gray-700"
 					@click.stop="deletePage(link)"
 				/>
 			</div>

frontend/src/pages/Batch.vue

@@ -183,7 +183,7 @@ import {
 	MessageCircle,
 	Globe,
 } from 'lucide-vue-next'
-import { formatTime } from '@/utils'
+import { formatTime, updateDocumentTitle } from '@/utils'
 import BatchDashboard from '@/components/BatchDashboard.vue'
 import BatchCourses from '@/components/BatchCourses.vue'
 import LiveClass from '@/components/LiveClass.vue'
@@ -286,4 +286,13 @@ const redirectToLogin = () => {
 const openAnnouncementModal = () => {
 	showAnnouncementModal.value = true
 }
+
+const pageMeta = computed(() => {
+	return {
+		title: batch.data?.title,
+		description: batch.data?.description,
+	}
+})
+
+updateDocumentTitle(pageMeta)
 </script>

frontend/src/pages/BatchDetail.vue

@@ -100,7 +100,7 @@
 import { computed, inject } from 'vue'
 import { useRouter } from 'vue-router'
 import { BookOpen, Clock } from 'lucide-vue-next'
-import { formatTime } from '@/utils'
+import { formatTime, updateDocumentTitle } from '@/utils'
 import { Breadcrumbs, createResource } from 'frappe-ui'
 import CourseCard from '@/components/CourseCard.vue'
 import BatchOverlay from '@/components/BatchOverlay.vue'
@@ -125,16 +125,6 @@ const batch = createResource({
 		batch: props.batchName,
 	},
 	auto: true,
-	onSuccess(data) {
-		if (data.students?.includes(user.data?.name)) {
-			router.push({
-				name: 'Batch',
-				params: {
-					batchName: props.batchName,
-				},
-			})
-		}
-	},
 })
 
 const courses = createResource({
@@ -154,6 +144,15 @@ const breadcrumbs = computed(() => {
 	})
 	return items
 })
+
+const pageMeta = computed(() => {
+	return {
+		title: batch.data?.title,
+		description: batch.data?.description,
+	}
+})
+
+updateDocumentTitle(pageMeta)
 </script>
 <style>
 .batch-description p {

frontend/src/pages/Batches.vue

@@ -91,6 +91,7 @@ import { createListResource, Breadcrumbs, Button, Tabs, Badge } from 'frappe-ui'
 import { Plus } from 'lucide-vue-next'
 import BatchCard from '@/components/BatchCard.vue'
 import { inject, ref, computed } from 'vue'
+import { updateDocumentTitle } from '@/utils'
 
 const user = inject('$user')
 
@@ -129,4 +130,13 @@ if (user.data) {
 		count: computed(() => batches.data?.enrolled?.length),
 	})
 }
+
+const pageMeta = computed(() => {
+	return {
+		title: 'Batches',
+		description: 'All batches divided by categories',
+	}
+})
+
+updateDocumentTitle(pageMeta)
 </script>

frontend/src/pages/CertifiedParticipants.vue

@@ -52,6 +52,7 @@ import { Breadcrumbs, FormControl, createResource } from 'frappe-ui'
 import { ref, computed } from 'vue'
 import UserAvatar from '@/components/UserAvatar.vue'
 import { Search } from 'lucide-vue-next'
+import { updateDocumentTitle } from '@/utils'
 
 const searchQuery = ref('')
 
@@ -70,4 +71,13 @@ const participants = createResource({
 const breadcrumbs = computed(() => {
 	return [{ label: 'Certified Participants', to: '/certified-participants' }]
 })
+
+const pageMeta = computed(() => {
+	return {
+		title: 'Certified Participants',
+		description: 'All participants that have been certified.',
+	}
+})
+
+updateDocumentTitle(pageMeta)
 </script>

frontend/src/pages/Lesson.vue

@@ -185,7 +185,7 @@ import UserAvatar from '@/components/UserAvatar.vue'
 import { useRoute } from 'vue-router'
 import { ChevronLeft, ChevronRight } from 'lucide-vue-next'
 import Discussions from '@/components/Discussions.vue'
-import { getEditorTools } from '../utils'
+import { getEditorTools, updateDocumentTitle } from '../utils'
 import EditorJS from '@editorjs/editorjs'
 import LessonContent from '@/components/LessonContent.vue'
 import CourseInstructors from '@/components/CourseInstructors.vue'
@@ -338,6 +338,15 @@ const allowInstructorContent = () => {
 const redirectToLogin = () => {
 	window.location.href = `/login?redirect-to=/lms/courses/${props.courseName}`
 }
+
+const pageMeta = computed(() => {
+	return {
+		title: lesson.data?.title,
+		description: lesson.data?.course,
+	}
+})
+
+updateDocumentTitle(pageMeta)
 </script>
 <style>
 .avatar-group {

frontend/src/pages/Notifications.vue

@@ -69,6 +69,7 @@ import { computed, inject, ref, onMounted } from 'vue'
 import UserAvatar from '@/components/UserAvatar.vue'
 import { useRouter } from 'vue-router'
 import { X } from 'lucide-vue-next'
+import { updateDocumentTitle } from '@/utils'
 
 const user = inject('$user')
 const socket = inject('$socket')
@@ -146,6 +147,15 @@ const breadcrumbs = computed(() => {
 	]
 	return crumbs
 })
+
+const pageMeta = computed(() => {
+	return {
+		title: 'Notifications',
+		description: 'All your notifications in one place.',
+	}
+})
+
+updateDocumentTitle(pageMeta)
 </script>
 <style>
 .notification strong {

frontend/src/pages/Profile.vue

@@ -93,7 +93,7 @@ import { Edit } from 'lucide-vue-next'
 import UserAvatar from '@/components/UserAvatar.vue'
 import { useRoute, useRouter } from 'vue-router'
 import NoPermission from '@/components/NoPermission.vue'
-import { convertToTitleCase } from '@/utils'
+import { convertToTitleCase, updateDocumentTitle } from '@/utils'
 import EditProfile from '@/components/Modals/EditProfile.vue'
 import EditCoverImage from '@/components/Modals/EditCoverImage.vue'
 
@@ -208,4 +208,13 @@ const breadcrumbs = computed(() => {
 	]
 	return crumbs
 })
+
+const pageMeta = computed(() => {
+	return {
+		title: profile.data?.full_name,
+		description: profile.data?.headline,
+	}
+})
+
+updateDocumentTitle(pageMeta)
 </script>

frontend/src/utils/index.js

@@ -357,13 +357,19 @@ export function getSidebarLinks() {
 			label: 'Courses',
 			icon: 'BookOpen',
 			to: 'Courses',
-			activeFor: ['Courses', 'CourseDetail', 'Lesson'],
+			activeFor: [
+				'Courses',
+				'CourseDetail',
+				'Lesson',
+				'CreateCourse',
+				'CreateLesson',
+			],
 		},
 		{
 			label: 'Batches',
 			icon: 'Users',
 			to: 'Batches',
-			activeFor: ['Batches', 'BatchDetail', 'Batch'],
+			activeFor: ['Batches', 'BatchDetail', 'Batch', 'BatchCreation'],
 		},
 		{
 			label: 'Certified Participants',