Calendar event cursor flashes (#8792)

Fixes #4692 

This is not the most beautiful fix (I think the right fix is to add 1px
somewhere), but this issue is old and deserved to be closed quickly
without spending too much time as this will likely be refactored and is
not very important

packages/twenty-front/src/modules/activities/calendar/components/CalendarCurrentEventCursor.tsx

@@ -20,6 +20,13 @@ type CalendarCurrentEventCursorProps = {
   calendarEvent: TimelineCalendarEvent;
 };
 
+const StyledDot = styled(motion.div)`
+  background-color: ${({ theme }) => theme.font.color.danger};
+  border-radius: 1px;
+  height: ${({ theme }) => theme.spacing(1)};
+  width: ${({ theme }) => theme.spacing(1)};
+`;
+
 const StyledCurrentEventCursor = styled(motion.div)`
   align-items: center;
   background-color: ${({ theme }) => theme.font.color.danger};
@@ -30,15 +37,6 @@ const StyledCurrentEventCursor = styled(motion.div)`
   right: 0;
   border-radius: ${({ theme }) => theme.border.radius.sm};
   transform: translateY(-50%);
-
-  &::before {
-    background-color: ${({ theme }) => theme.font.color.danger};
-    border-radius: 1px;
-    content: '';
-    display: block;
-    height: ${({ theme }) => theme.spacing(1)};
-    width: ${({ theme }) => theme.spacing(1)};
-  }
 `;
 
 export const CalendarCurrentEventCursor = ({
@@ -166,7 +164,18 @@ export const CalendarCurrentEventCursor = ({
           transition={{
             duration: theme.animation.duration.normal,
           }}
-        />
+        >
+          <motion.div
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            transition={{
+              delay: theme.animation.duration.normal,
+              duration: theme.animation.duration.normal,
+            }}
+          >
+            <StyledDot />
+          </motion.div>
+        </StyledCurrentEventCursor>
       )}
     </AnimatePresence>
   );