From 476ca5f949f264640f8492e26eafa9bd8131c1a7 Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Wed, 5 Jun 2024 18:05:14 +0200
Subject: [PATCH] Added rules for events' TransitionGroup

This fixes the stutter that happens when an event is added / removed from the list of the current day tile
---
 components/calendar/state/monthly/DayTile.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/components/calendar/state/monthly/DayTile.vue b/components/calendar/state/monthly/DayTile.vue
index 48f3bca..355f419 100644
--- a/components/calendar/state/monthly/DayTile.vue
+++ b/components/calendar/state/monthly/DayTile.vue
@@ -108,7 +108,7 @@ const eventsNotDisplayed: ComputedRef<number>  = computed<number>(() => eventsFo
         }"
       >
         <TransitionGroup name="event">
-          <li v-for="event in eventsToDisplay" :key="event.title" class="grid pointer-events-auto">
+          <li v-for="event in eventsToDisplay" :key="event.id" class="grid w-full pointer-events-auto">
             <CalendarEventButton :event :tile-date="date" />
           </li>
         </TransitionGroup>
@@ -165,8 +165,10 @@ const eventsNotDisplayed: ComputedRef<number>  = computed<number>(() => eventsFo
 .event-enter-active {
   transition: all 120ms ease-in-out;
 }
+.event-move,
 .event-leave-active {
-  transition: all 180ms ease-in-out;
+  position: absolute;
+  transition: all 100ms ease-in-out;
 }
 .event-enter-from,
 .event-leave-to {