Fixed updating modal not closing as well

components/calendar/dialog/UpdateEvent.vue

@@ -1,8 +1,6 @@
 <script lang="ts" setup>
 const { eventSkeleton, lastActiveEvent, isEditEventModalOpen } = storeToRefs(useCalendar())
 
-const isLoading = ref(false)
-
 // Watch the popover state
 watch(isEditEventModalOpen, (hasOpened, _o) => {
   if (hasOpened && lastActiveEvent.value) {
@@ -15,10 +13,8 @@ watch(isEditEventModalOpen, (hasOpened, _o) => {
  *
  * @param e The closing event (can be keydown or click)
  */
-function handleClosing(e: Event) {
-  if (isLoading.value) {
-    e.preventDefault()
-  }
+function handleClosing() {
+  isEditEventModalOpen.value = false
 }
 </script>
 
@@ -43,7 +39,7 @@ function handleClosing(e: Event) {
         </UiDialogDescription>
       </header>
 
-      <CalendarFormUpdateEvent />
+      <CalendarFormUpdateEvent @event-updated="handleClosing" />
     </UiDialogContent>
   </UiDialog>
 </template>

components/calendar/form/UpdateEvent.vue

@@ -3,6 +3,8 @@ import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhPencilSimpl
 import { useToast } from "~/components/ui/toast";
 import type { APIError } from "~/models/Errors";
 
+const emit = defineEmits(["event-updated"])
+
 const { resetSkeleton, updateEventFromSkeleton, cancelLatestRequest } = useCalendar()
 const { eventSkeleton, lastActiveEvent } = storeToRefs(useCalendar())
 
@@ -22,6 +24,8 @@ async function handleAction() {
 
   try {
     await updateEventFromSkeleton()
+
+    emit("event-updated")
   } catch (err) {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const apiError = (err as any).data as APIError