Adds animate and delay props to messages

This commit is contained in:
Lucas Oliveira 2025-10-21 18:30:41 -03:00 committed by Mike Fortman
parent e76f7300ba
commit 092ec306d5
2 changed files with 13 additions and 5 deletions

View file

@ -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

View file

@ -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