Migration to nuxt 4

Used codemods CLI and reworked most alias'd path that stopped working

app/components/calendar/dialog/UpdateEvent.vue

@@ -0,0 +1,47 @@
+<script lang="ts" setup>
+const { eventSkeleton, lastActiveEvent, isEditEventModalOpen } = storeToRefs(useCalendar())
+const { resetSkeleton } = useCalendar();
+
+// Watch the popover state
+watch(isEditEventModalOpen, (hasOpened, _o) => {
+  if (hasOpened && lastActiveEvent.value) {
+    eventSkeleton.value = structuredClone(toRaw(lastActiveEvent.value))
+  }
+})
+
+/**
+ * Prevents the modal from closing if's still loading
+ *
+ * @param e The closing event (can be keydown or click)
+ */
+function handleClosing() {
+  isEditEventModalOpen.value = false
+  setTimeout(() => resetSkeleton(), 100)
+}
+</script>
+
+<template>
+  <UiDialog v-model:open="isEditEventModalOpen">
+    <UiDialogContent
+      :disable-outside-pointer-events="true"
+      :trap-focus="true"
+      class="pl-3 md:min-w-96 max-md:translate-0 max-md:inset-0 max-md:w-full max-md:block"
+      @escape-key-down="handleClosing"
+      @focus-outside="handleClosing"
+      @interact-outside="handleClosing"
+      @pointer-down-outside="(e) => e.preventDefault()"
+    >
+      <header class="pl-8 grid gap-y-2 max-md:mb-8">
+        <UiDialogTitle>
+          {{ $t('entity.calendar.event.editDialog.title') }}
+        </UiDialogTitle>
+
+        <UiDialogDescription>
+          {{ $t('entity.calendar.event.editDialog.subtitle') }}
+        </UiDialogDescription>
+      </header>
+
+      <CalendarFormUpdateEvent @event-updated="handleClosing" />
+    </UiDialogContent>
+  </UiDialog>
+</template>