From 092ec306d51f36eb3240dc2830518fdd0c9e86ee Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Tue, 21 Oct 2025 18:30:41 -0300
Subject: [PATCH] Adds animate and delay props to messages

---
 frontend/src/app/chat/components/assistant-message.tsx | 9 +++++++--
 frontend/src/app/chat/components/user-message.tsx      | 9 ++++++---
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/frontend/src/app/chat/components/assistant-message.tsx b/frontend/src/app/chat/components/assistant-message.tsx
index 93fb77d3..4c600517 100644
--- a/frontend/src/app/chat/components/assistant-message.tsx
+++ b/frontend/src/app/chat/components/assistant-message.tsx
@@ -17,6 +17,8 @@ interface AssistantMessageProps {
 	showForkButton?: boolean;
 	onFork?: (e: React.MouseEvent) => void;
 	isCompleted?: boolean;
+	animate?: boolean;
+	delay?: number;
 }
 
 export function AssistantMessage({
@@ -29,12 +31,15 @@ export function AssistantMessage({
 	showForkButton = false,
 	onFork,
 	isCompleted = false,
+	animate = true,
+	delay = 0.2,
 }: AssistantMessageProps) {
+	
 	return (
 		<motion.div
-			initial={{ opacity: 0, y: -20 }}
+			initial={animate ? { opacity: 0, y: -20 } : { opacity: 1, y: 0 }}
 			animate={{ opacity: 1, y: 0 }}
-			transition={{ duration: 0.4, delay: 0.2, ease: "easeOut" }}
+			transition={animate ? { duration: 0.4, delay: delay, ease: "easeOut" } : { duration: 0 }}
 			className={isCompleted ? "opacity-50" : ""}
 		>
 			<Message
diff --git a/frontend/src/app/chat/components/user-message.tsx b/frontend/src/app/chat/components/user-message.tsx
index e5825551..0f9deed9 100644
--- a/frontend/src/app/chat/components/user-message.tsx
+++ b/frontend/src/app/chat/components/user-message.tsx
@@ -8,16 +8,19 @@ import { Message } from "./message";
 interface UserMessageProps {
 	content: string;
 	isCompleted?: boolean;
+	animate?: boolean;
 }
 
-export function UserMessage({ content, isCompleted }: UserMessageProps) {
+export function UserMessage({ content, isCompleted, animate = true }: UserMessageProps) {
 	const { user } = useAuth();
 
+	console.log("animate", animate);
+
 	return (
 		<motion.div
-			initial={{ opacity: 0, y: -20 }}
+			initial={animate ? { opacity: 0, y: -20 } : { opacity: 1, y: 0 }}
 			animate={{ opacity: 1, y: 0 }}
-			transition={{ duration: 0.4, delay: 0.2, ease: "easeOut" }}
+			transition={animate ? { duration: 0.4, delay: 0.2, ease: "easeOut" } : { duration: 0 }}
 			className={isCompleted ? "opacity-50" : ""}
 		>
 			<Message