chore: merge 'develop' into 'main'

frontend/src/App.vue

@@ -14,8 +14,10 @@ import DesktopLayout from './components/DesktopLayout.vue'
 import MobileLayout from './components/MobileLayout.vue'
 import { stopSession } from '@/telemetry'
 import { init as initTelemetry } from '@/telemetry'
+import { usersStore } from '@/stores/user'
 
 const screenSize = useScreenSize()
+let { userResource } = usersStore()
 
 const Layout = computed(() => {
 	if (screenSize.width < 640) {
@@ -26,6 +28,7 @@ const Layout = computed(() => {
 })
 
 onMounted(async () => {
+	if (!userResource.data) return
 	await initTelemetry()
 })
 

frontend/src/components/BrandSettings.vue

@@ -0,0 +1,83 @@
+<template>
+	<div class="flex flex-col justify-between h-full">
+		<div>
+			<div class="flex items-center justify-between">
+				<div class="font-semibold mb-1">
+					{{ __(label) }}
+				</div>
+				<Badge
+					v-if="isDirty"
+					:label="__('Not Saved')"
+					variant="subtle"
+					theme="orange"
+				/>
+			</div>
+			<div class="text-xs text-gray-600">
+				{{ __(description) }}
+			</div>
+		</div>
+		<SettingFields :fields="fields" :data="data.data" />
+		<div class="flex flex-row-reverse mt-auto">
+			<Button variant="solid" :loading="saveSettings.loading" @click="update">
+				{{ __('Update') }}
+			</Button>
+		</div>
+	</div>
+</template>
+<script setup>
+import { createResource, Button, Badge } from 'frappe-ui'
+import SettingFields from '@/components/SettingFields.vue'
+import { watch, ref } from 'vue'
+
+const isDirty = ref(false)
+
+const props = defineProps({
+	fields: {
+		type: Array,
+		required: true,
+	},
+	data: {
+		type: Object,
+		required: true,
+	},
+	label: {
+		type: String,
+		required: true,
+	},
+	description: {
+		type: String,
+	},
+})
+
+const saveSettings = createResource({
+	url: 'frappe.client.set_value',
+	makeParams(values) {
+		return {
+			doctype: 'Website Settings',
+			name: 'Website Settings',
+			fieldname: values.fields,
+		}
+	},
+})
+
+const update = () => {
+	let fieldsToSave = {}
+	let imageFields = ['favicon', 'banner_image', 'footer_logo']
+	props.fields.forEach((f) => {
+		if (imageFields.includes(f.name)) {
+			fieldsToSave[f.name] = f.value ? f.value.file_url : null
+		} else {
+			fieldsToSave[f.name] = f.value
+		}
+	})
+	saveSettings.submit({
+		fields: fieldsToSave,
+	})
+}
+
+watch(props.data, (newData) => {
+	if (newData && !isDirty.value) {
+		isDirty.value = true
+	}
+})
+</script>

frontend/src/components/LiveClass.vue

@@ -1,33 +1,30 @@
 <template>
-	<Button
-		v-if="user.data.is_moderator"
-		variant="solid"
-		class="float-right mb-5"
-		@click="openLiveClassModal"
-	>
-		<template #prefix>
-			<Plus class="h-4 w-4" />
-		</template>
-		<span>
-			{{ __('Add Live Class') }}
-		</span>
-	</Button>
-	<div class="text-lg font-semibold mb-5">
-		{{ __('Live Class') }}
+	<div class="flex items-center justify-between mb-5">
+		<div class="text-lg font-semibold">
+			{{ __('Live Class') }}
+		</div>
+		<Button v-if="user.data.is_moderator" @click="openLiveClassModal">
+			<template #prefix>
+				<Plus class="h-4 w-4" />
+			</template>
+			<span>
+				{{ __('Add') }}
+			</span>
+		</Button>
 	</div>
 	<div v-if="liveClasses.data?.length" class="grid grid-cols-2 gap-5">
 		<div
 			v-for="cls in liveClasses.data"
-			class="flex flex-col border rounded-md h-full p-3"
+			class="flex flex-col border rounded-md h-full text-sm text-gray-700 p-3"
 		>
-			<div class="font-semibold text-lg mb-4">
+			<div class="font-semibold text-gray-900 text-lg mb-4">
 				{{ cls.title }}
 			</div>
-			<div class="mb-4">
+			<div class="leading-5 text-gray-700 text-sm mb-4">
 				{{ cls.description }}
 			</div>
 			<div class="flex items-center mb-2">
-				<Calendar class="w-4 h-4 stroke-1.5" />
+				<Calendar class="w-4 h-4 stroke-1.5 text-gray-700" />
 				<span class="ml-2">
 					{{ dayjs(cls.date).format('DD MMMM YYYY') }}
 				</span>
@@ -38,7 +35,7 @@
 					{{ formatTime(cls.time) }}
 				</span>
 			</div>
-			<div class="flex items-center space-x-2 mt-auto">
+			<div class="flex items-center space-x-2 text-gray-900 mt-auto">
 				<a
 					:href="cls.start_url"
 					target="_blank"
@@ -90,7 +87,6 @@ const liveClasses = createListResource({
 	doctype: 'LMS Live Class',
 	filters: {
 		batch_name: props.batch,
-		date: ['>=', new Date()],
 	},
 	fields: [
 		'title',

frontend/src/components/Modals/Settings.vue

@@ -45,6 +45,20 @@
 						:label="activeTab.label"
 						:description="activeTab.description"
 					/>
+					<PaymentSettings
+						v-else-if="activeTab.label === 'Payment Gateway'"
+						:label="activeTab.label"
+						:description="activeTab.description"
+						:data="data"
+						:fields="activeTab.fields"
+					/>
+					<BrandSettings
+						v-else-if="activeTab.label === 'Branding'"
+						:label="activeTab.label"
+						:description="activeTab.description"
+						:fields="activeTab.fields"
+						:data="branding"
+					/>
 					<SettingDetails
 						v-else
 						:fields="activeTab.fields"
@@ -58,13 +72,15 @@
 	</Dialog>
 </template>
 <script setup>
-import { Dialog, createDocumentResource } from 'frappe-ui'
+import { Dialog, createDocumentResource, createResource } from 'frappe-ui'
 import { ref, computed, watch } from 'vue'
 import { useSettings } from '@/stores/settings'
 import SettingDetails from '../SettingDetails.vue'
 import SidebarLink from '@/components/SidebarLink.vue'
 import Members from '@/components/Members.vue'
 import Categories from '@/components/Categories.vue'
+import BrandSettings from '@/components/BrandSettings.vue'
+import PaymentSettings from '@/components/PaymentSettings.vue'
 
 const show = defineModel()
 const doctype = ref('LMS Settings')
@@ -79,6 +95,12 @@ const data = createDocumentResource({
 	auto: true,
 })
 
+const branding = createResource({
+	url: 'lms.lms.api.get_branding',
+	auto: true,
+	cache: 'brand',
+})
+
 const tabsStructure = computed(() => {
 	return [
 		{
@@ -92,17 +114,6 @@ const tabsStructure = computed(() => {
 				},
 			],
 		},
-		{
-			label: 'Settings',
-			hideLabel: true,
-			items: [
-				{
-					label: 'Categories',
-					description: 'Manage the members of your learning system',
-					icon: 'Network',
-				},
-			],
-		},
 		{
 			label: 'Settings',
 			hideLabel: true,
@@ -114,24 +125,17 @@ const tabsStructure = computed(() => {
 						'Configure the payment gateway and other payment related settings',
 					fields: [
 						{
-							label: 'Razorpay Key',
-							name: 'razorpay_key',
-							type: 'text',
-						},
-						{
-							label: 'Razorpay Secret',
-							name: 'razorpay_secret',
-							type: 'password',
+							label: 'Payment Gateway',
+							name: 'payment_gateway',
+							type: 'Link',
+							doctype: 'Payment Gateway',
 						},
 						{
 							label: 'Default Currency',
 							name: 'default_currency',
 							type: 'Link',
 							doctype: 'Currency',
 						},
-						{
-							type: 'Column Break',
-						},
 						{
 							label: 'Apply GST for India',
 							name: 'apply_gst',
@@ -151,10 +155,67 @@ const tabsStructure = computed(() => {
 				},
 			],
 		},
+		{
+			label: 'Settings',
+			hideLabel: true,
+			items: [
+				{
+					label: 'Categories',
+					description: 'Manage the members of your learning system',
+					icon: 'Network',
+				},
+			],
+		},
 		{
 			label: 'Customise',
 			hideLabel: false,
 			items: [
+				{
+					label: 'Branding',
+					icon: 'Blocks',
+					fields: [
+						{
+							label: 'Brand Name',
+							name: 'app_name',
+							type: 'text',
+						},
+						{
+							label: 'Copyright',
+							name: 'copyright',
+							type: 'text',
+						},
+						{
+							label: 'Address',
+							name: 'address',
+							type: 'textarea',
+							rows: 4,
+						},
+						{
+							label: 'Footer "Powered By"',
+							name: 'footer_powered',
+							type: 'textarea',
+							rows: 4,
+						},
+						{
+							type: 'Column Break',
+						},
+						{
+							label: 'Logo',
+							name: 'banner_image',
+							type: 'Upload',
+						},
+						{
+							label: 'Favicon',
+							name: 'favicon',
+							type: 'Upload',
+						},
+						{
+							label: 'Footer Logo',
+							name: 'footer_logo',
+							type: 'Upload',
+						},
+					],
+				},
 				{
 					label: 'Sidebar',
 					icon: 'PanelLeftIcon',
@@ -198,7 +259,6 @@ const tabsStructure = computed(() => {
 				{
 					label: 'Email Templates',
 					icon: 'MailPlus',
-					description: 'Create email templates with the content you want',
 					fields: [
 						{
 							label: 'Batch Confirmation Template',