Files
gregorlohaus.com/src/app/chat/_components/Messages.tsx
2026-03-31 14:03:41 +02:00

26 lines
994 B
TypeScript

import { type UIMessage } from 'ai'
import * as Card from "~/components/ui/card"
import AnimateTextIn from '~/app/_components/Animated/AnimateIn';
import { UserMessage } from './UserMessage';
import { AssistantMessage } from './AssistantMessage';
import { ScrollArea } from '~/components/ui/scroll-area';
import { useTimeLine } from '~/app/_providers/GsapProvicer';
import {
memo
} from 'react';
const Messages = memo(({ messages}: { messages: UIMessage[]}) => {
return (
<ScrollArea data-scroller-priority='1' className="w-full h-[90%] max-w-4xl mx-auto">
{messages.map((message, i) => (
<Card.AnimatedCard scrollOnly={true} tlId='chat' position={i * 0.2} key={i}>
<Card.CardContent>
{message.role == 'assistant' && <AssistantMessage message={message} />}
{message.role == 'user' && <UserMessage message={message} />}
</Card.CardContent>
</Card.AnimatedCard>
))}
</ScrollArea>)
})
export default Messages;