Merge pull request #1156 from pateljannat/program-saving-issue

fix: misc issues

frontend/src/components/AppSidebar.vue

@@ -186,18 +186,27 @@ const addQuizzes = () => {
 }
 
 const addPrograms = () => {
-	if (settingsStore.learningPaths.data) {
-		let activeFor = ['Programs', 'ProgramForm']
-		let index = 1
-		if (!isInstructor.value && !isModerator.value) {
-			sidebarLinks.value = sidebarLinks.value.filter(
-				(link) => link.label !== 'Courses'
-			)
-			activeFor.push('CourseDetail')
-			activeFor.push('Lesson')
-			index = 0
-		}
+	let activeFor = ['Programs', 'ProgramForm']
+	let index = 1
+	let canAddProgram = false
 
+	if (
+		!isInstructor.value &&
+		!isModerator.value &&
+		settingsStore.learningPaths.data
+	) {
+		sidebarLinks.value = sidebarLinks.value.filter(
+			(link) => link.label !== 'Courses'
+		)
+		activeFor.push('CourseDetail')
+		activeFor.push('Lesson')
+		index = 0
+		canAddProgram = true
+	} else if (isInstructor.value || isModerator.value) {
+		canAddProgram = true
+	}
+
+	if (canAddProgram) {
 		sidebarLinks.value.splice(index, 0, {
 			label: 'Programs',
 			icon: 'Route',

frontend/src/components/DesktopLayout.vue

@@ -8,7 +8,6 @@
 					<AppSidebar />
 				</div>
 				<div class="w-full overflow-auto" id="scrollContainer">
-					<OnboardingBanner />
 					<slot />
 				</div>
 			</div>
@@ -17,5 +16,4 @@
 </template>
 <script setup>
 import AppSidebar from './AppSidebar.vue'
-import OnboardingBanner from '@/components/OnboardingBanner.vue'
 </script>

frontend/src/components/LessonHelp.vue

@@ -25,7 +25,7 @@
 				@click="openHelpDialog('upload')"
 			>
 				<span class="leading-5">
-					{{ __('How to upload content from your system?') }}
+					{{ __(contentMap['upload']) }}
 				</span>
 				<Info class="w-3 h-3 text-gray-700" />
 			</div>
@@ -44,7 +44,7 @@
 				@click="openHelpDialog('youtube')"
 			>
 				<span>
-					{{ __('How to add a YouTube Video?') }}
+					{{ __(contentMap['youtube']) }}
 				</span>
 				<Info class="w-3 h-3 text-gray-700" />
 			</div>
@@ -72,7 +72,7 @@
 			</div>
 		</div>
 	</div>
-	<ExplanationVideos v-model="showExplanation" :type="type" />
+	<ExplanationVideos v-model="showExplanation" :title="title" :type="type" />
 </template>
 <script setup>
 import { Info } from 'lucide-vue-next'
@@ -81,9 +81,16 @@ import ExplanationVideos from '@/components/Modals/ExplanationVideos.vue'
 
 const showExplanation = ref(false)
 const type = ref(null)
+const title = ref(null)
+const contentMap = {
+	quiz: 'How to add a Quiz?',
+	upload: 'How to upload content from your system?',
+	youtube: 'How to add a YouTube Video?',
+}
 
 const openHelpDialog = (contentType) => {
 	type.value = contentType
+	title.value = contentMap[contentType]
 	showExplanation.value = true
 }
 </script>

frontend/src/components/Modals/ExplanationVideos.vue

@@ -3,10 +3,11 @@
 		v-model="show"
 		:options="{
 			size: '4xl',
+			title: title,
 		}"
 	>
-		<template #body>
-			<div class="p-4">
+		<template #body-content>
+			<div>
 				<VideoBlock :file="file" />
 			</div>
 		</template>
@@ -24,6 +25,10 @@ const props = defineProps({
 		type: [String, null],
 		required: true,
 	},
+	title: {
+		type: String,
+		required: true,
+	},
 })
 
 const file = computed(() => {

frontend/src/components/OnboardingBanner.vue

@@ -11,11 +11,11 @@
 				@click="redirectToCourseForm()"
 				class="flex items-center space-x-2"
 				:class="{
-					'cursor-pointer': !onboardingDetails.data.course_created.length,
+					'cursor-pointer': !onboardingDetails.data.course_created?.length,
 				}"
 			>
 				<span
-					v-if="onboardingDetails.data.course_created.length"
+					v-if="onboardingDetails.data.course_created?.length"
 					class="py-1 px-1 bg-white rounded-full"
 				>
 					<Check class="h-4 w-4 stroke-2 text-green-600" />
@@ -32,13 +32,13 @@
 				class="flex items-center space-x-2"
 				:class="{
 					'cursor-pointer':
-						onboardingDetails.data.course_created.length &&
-						!onboardingDetails.data.chapter_created.length,
-					'text-gray-400': !onboardingDetails.data.course_created.length,
+						onboardingDetails.data.course_created?.length &&
+						!onboardingDetails.data.chapter_created?.length,
+					'text-gray-400': !onboardingDetails.data.course_created?.length,
 				}"
 			>
 				<span
-					v-if="onboardingDetails.data.chapter_created.length"
+					v-if="onboardingDetails.data.chapter_created?.length"
 					class="py-1 px-1 bg-white rounded-full"
 				>
 					<Check class="h-4 w-4 stroke-2 text-green-600" />
@@ -55,15 +55,15 @@
 				class="flex items-center space-x-2"
 				:class="{
 					'cursor-pointer':
-						onboardingDetails.data.course_created.length &&
-						onboardingDetails.data.chapter_created.length,
+						onboardingDetails.data.course_created?.length &&
+						onboardingDetails.data.chapter_created?.length,
 					'text-gray-400':
-						!onboardingDetails.data.course_created.length ||
-						!onboardingDetails.data.chapter_created.length,
+						!onboardingDetails.data.course_created?.length ||
+						!onboardingDetails.data.chapter_created?.length,
 				}"
 			>
 				<span
-					v-if="onboardingDetails.data.lesson_created.length"
+					v-if="onboardingDetails.data.lesson_created?.length"
 					class="py-1 px-1 bg-white rounded-full"
 				>
 					<Check class="h-4 w-4 stroke-2 text-green-600" />