feat: autofill client timezone based on user timezone

frontend/src/components/Modals/LiveClassModal.vue

@@ -95,8 +95,8 @@ import {
 	FormControl,
 	Autocomplete,
 } from 'frappe-ui'
-import { reactive, inject } from 'vue'
-import { getTimezones, createToast } from '@/utils/'
+import { reactive, inject, onMounted } from 'vue'
+import { getTimezones, createToast, getUserTimezone } from '@/utils/'
 
 const liveClasses = defineModel('reloadLiveClasses')
 const show = defineModel()
@@ -122,6 +122,10 @@ let liveClass = reactive({
 	host: user.data.name,
 })
 
+onMounted(() => {
+	liveClass.timezone = getUserTimezone()
+})
+
 const getTimezoneOptions = () => {
 	return getTimezones().map((timezone) => {
 		return {

frontend/src/utils/index.js

@@ -441,6 +441,22 @@ export function getTimezones() {
 	]
 }
 
+export function getUserTimezone() {
+	try {
+		const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone
+		const supportedTimezones = getTimezones()
+
+		if (supportedTimezones.includes(timezone)) {
+			return timezone // e.g., 'Asia/Calcutta', 'America/New_York', etc.
+		} else {
+			throw Error('unsupported timezone')
+		}
+	} catch (error) {
+		console.error('Error getting timezone:', error)
+		return null
+	}
+}
+
 export function getSidebarLinks() {
 	return [
 		{