From b73bca354ab73f4fd7916cecc10c509bd02942a4 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Tue, 5 Aug 2025 10:21:09 +0530
Subject: [PATCH] fix: update event handling in CalendarEventPanel and adjust
 button action in Calendar

---
 frontend/src/components/Calendar/CalendarEventPanel.vue | 4 ++--
 frontend/src/pages/Calendar.vue                         | 7 +++++--
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/Calendar/CalendarEventPanel.vue b/frontend/src/components/Calendar/CalendarEventPanel.vue
index e2a25383..b919476e 100644
--- a/frontend/src/components/Calendar/CalendarEventPanel.vue
+++ b/frontend/src/components/Calendar/CalendarEventPanel.vue
@@ -136,7 +136,7 @@ import {
   Dropdown,
   dayjs,
 } from 'frappe-ui'
-import { ref, computed, watch } from 'vue'
+import { ref, computed, watch, nextTick } from 'vue'
 
 const props = defineProps({
   event: {
@@ -163,7 +163,6 @@ watch(
   () => props.event,
   (newEvent) => {
     error.value = null
-    _event.value = { ...newEvent }
 
     if (newEvent && newEvent.id) {
       title.value = 'Event details'
@@ -171,6 +170,7 @@ watch(
       title.value = 'New event'
     }
 
+    nextTick(() => (_event.value = { ...newEvent }))
     setTimeout(() => eventTitle.value?.el?.focus(), 100)
   },
   { immediate: true },
diff --git a/frontend/src/pages/Calendar.vue b/frontend/src/pages/Calendar.vue
index 74a72797..3c366a32 100644
--- a/frontend/src/pages/Calendar.vue
+++ b/frontend/src/pages/Calendar.vue
@@ -4,7 +4,7 @@
       <ViewBreadcrumbs routeName="Calendar" />
     </template>
     <template #right-header>
-      <Button variant="solid" :label="__('Create')" @click="createEvent">
+      <Button variant="solid" :label="__('Create')" @click="showEventPanelArea">
         <template #prefix><FeatherIcon name="plus" class="h-4" /></template>
       </Button>
     </template>
@@ -261,7 +261,10 @@ function getFromToTime(time) {
   let fromTime = `${h}:${m}`
   let toTime = `${parseInt(h) + 1}:${m}`
 
-  if (time.toLowerCase().includes('am') || time.toLowerCase().includes('pm')) {
+  if (
+    time?.toLowerCase().includes('am') ||
+    time?.toLowerCase().includes('pm')
+  ) {
     // 12 hour format
     time = time.trim().replace(' ', '')
     const ampm = time.slice(-2)