fix: delete batch and pass fields prop to brand settings

frontend/src/components/BatchOverlay.vue

@@ -65,6 +65,10 @@
 				}"
 			>
 				<Button variant="solid" class="w-full mt-4">
+					<template #prefix>
+						<Settings v-if="isModerator" class="size-4 stroke-1.5" />
+						<LogIn v-else class="size-4 stroke-1.5" />
+					</template>
 					<span>
 						{{ isModerator ? __('Manage Batch') : __('Visit Batch') }}
 					</span>
@@ -85,6 +89,9 @@
 				"
 			>
 				<Button v-if="!isStudent" class="w-full mt-4" variant="solid">
+					<template #prefix>
+						<CreditCard class="size-4 stroke-1.5" />
+					</template>
 					<span>
 						{{ __('Register Now') }}
 					</span>
@@ -100,6 +107,9 @@
 				"
 				@click="enrollInBatch()"
 			>
+				<template #prefix>
+					<GraduationCap class="size-4 stroke-1.5" />
+				</template>
 				{{ __('Enroll Now') }}
 			</Button>
 			<router-link
@@ -112,6 +122,9 @@
 				}"
 			>
 				<Button class="w-full mt-2">
+					<template #prefix>
+						<Pencil class="size-4 stroke-1.5" />
+					</template>
 					<span>
 						{{ __('Edit') }}
 					</span>
@@ -122,8 +135,17 @@
 </template>
 <script setup>
 import { inject, computed } from 'vue'
-import { Badge, Button, createResource, toast } from 'frappe-ui'
-import { BookOpen, Clock, Globe } from 'lucide-vue-next'
+import { Button, createResource, toast } from 'frappe-ui'
+import {
+	BookOpen,
+	Clock,
+	CreditCard,
+	Globe,
+	GraduationCap,
+	LogIn,
+	Pencil,
+	Settings,
+} from 'lucide-vue-next'
 import { formatNumberIntoCurrency, formatTime } from '@/utils'
 import DateRange from '@/components/Common/DateRange.vue'
 import { useRouter } from 'vue-router'

frontend/src/components/Modals/CourseProgressSummary.vue

@@ -7,17 +7,17 @@
 		}"
 	>
 		<template #body-content>
-			<div class="flex justify-between space-x-10 text-base">
+			<div class="flex justify-between space-x-10 text-base mt-10">
 				<div class="w-full">
 					<div class="flex items-center justify-between space-x-5 mb-4">
-						<div class="text-xl font-semibold text-ink-gray-6">
+						<!-- <div class="text-xl font-semibold text-ink-gray-6">
 							{{ __('{0} Members').format(memberCount) }}
-						</div>
+						</div> -->
 						<FormControl
 							v-model="searchFilter"
-							:label="__('Search by Member Name')"
+							:placeholder="__('Search by Member Name')"
 							type="text"
-							class="w-1/2"
+							class="w-full"
 						/>
 					</div>
 					<div class="max-h-[70vh] overflow-y-auto">
@@ -90,13 +90,22 @@
 					</div>
 				</div>
 				<div class="mb-4 self-start w-full space-y-5">
-					<NumberChart
-						class="border rounded-md"
-						:config="{
-							title: __('Average Progress %'),
-							value: chartDetails.data?.average_progress || 0,
-						}"
-					/>
+					<div class="flex items-center space-x-4">
+						<NumberChart
+							class="border rounded-md w-full"
+							:config="{
+								title: __('Enrollments'),
+								value: memberCount || 0,
+							}"
+						/>
+						<NumberChart
+							class="border rounded-md w-full"
+							:config="{
+								title: __('Average Progress %'),
+								value: chartDetails.data?.average_progress || 0,
+							}"
+						/>
+					</div>
 					<DonutChart
 						:config="{
 							data: chartDetails.data?.progress_distribution || [],

frontend/src/components/Settings/BrandSettings.vue

@@ -88,9 +88,31 @@ const update = () => {
 	)
 }
 
-watch(branding, (newData) => {
-	if (newData && !isDirty.value) {
-		isDirty.value = true
-	}
+watch(branding, (updatedDoc) => {
+	let textFields = []
+	let imageFields = []
+
+	props.fields.forEach((f) => {
+		if (f.type === 'Upload') {
+			imageFields.push(f.name)
+		} else {
+			textFields.push(f.name)
+		}
+	})
+
+	textFields.forEach((field) => {
+		if (updatedDoc.data[field] != updatedDoc.previousData[field]) {
+			isDirty.value = true
+		}
+	})
+
+	imageFields.forEach((field) => {
+		if (
+			updatedDoc.data[field] &&
+			updatedDoc.data[field].file_url != updatedDoc.previousData[field].file_url
+		) {
+			isDirty.value = true
+		}
+	})
 })
 </script>

frontend/src/components/Settings/Settings.vue

@@ -37,8 +37,13 @@
 					<component
 						v-if="activeTab.template"
 						:is="activeTab.template"
-						:label="activeTab.label"
-						:description="activeTab.description"
+						v-bind="{
+							label: activeTab.label,
+							description: activeTab.description,
+							...(activeTab.label === 'Branding'
+								? { fields: activeTab.fields }
+								: {}),
+						}"
 					/>
 					<PaymentSettings
 						v-else-if="activeTab.label === 'Payment Gateway'"