From 78c138760296801b9fef3ed18f568c007c427843 Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Sun, 9 Jun 2024 10:44:45 +0200
Subject: [PATCH] Added delete for quick removal

---
 components/calendar/CalendarEvent.vue        | 12 +++++++++---
 components/calendar/CalendarEventDetails.vue |  1 -
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/components/calendar/CalendarEvent.vue b/components/calendar/CalendarEvent.vue
index fe1abba..c0f0811 100644
--- a/components/calendar/CalendarEvent.vue
+++ b/components/calendar/CalendarEvent.vue
@@ -10,7 +10,7 @@ const props = defineProps<{
 }>()
 
 const { areDatesIdentical } = useCalendar()
-const { revealEditEventModal } = useCalendarEvents()
+const { revealEditEventModal, revealDeleteEventModal } = useCalendarEvents()
 const { lastActiveEvent } = storeToRefs(useCalendarEvents())
 
 const spansMultipleDays = Boolean(props.event.startDate && props.event.endDate)
@@ -30,6 +30,12 @@ function handleDoubleClick() {
   revealEditEventModal()
 }
 
+function handleDelete() {
+  isPopoverDetailsOpen.value = false
+  lastActiveEvent.value = { ...props.event }
+  revealDeleteEventModal()
+}
+
 function handleClosePopover() {
   isPopoverDetailsOpen.value = false
 }
@@ -39,8 +45,7 @@ function handleClosePopover() {
   <UiPopover v-model:open="isPopoverDetailsOpen">
     <UiPopoverTrigger as-child>
       <button
-        id="test"
-        class="text-xs px-2 py-1 block w-full text-left rounded-sm"
+        class="text-xs px-2 py-1 block w-full text-left rounded-sm focus-visible:bg-red-200"
         :class="
           cn({
             'text-white bg-slate-600 hover:bg-slate-700': !event.category,
@@ -67,6 +72,7 @@ function handleClosePopover() {
           })
         "
         @dblclick="handleDoubleClick"
+        @keydown.delete="handleDelete"
       >
         <div class="line-clamp-2 [overflow-wrap:anywhere] hyphens-auto">
           {{ eventTitle }}
diff --git a/components/calendar/CalendarEventDetails.vue b/components/calendar/CalendarEventDetails.vue
index 7a14659..3ae0c96 100644
--- a/components/calendar/CalendarEventDetails.vue
+++ b/components/calendar/CalendarEventDetails.vue
@@ -67,7 +67,6 @@ function deployDeleteModal() {
     :side="'left'"
     :collision-padding="60"
     :hide-when-detached="true"
-    :disable-outside-pointer-events="true"
     :class="{
       'border-slate-800': !event.category,
       'border-lime-800': event.category?.name === 'naissance',