NikitolProject/miniperplx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: Remove animations from Messages and Tool call UI

Browse Source
This commit is contained in:
zaidmukaddam 2024-08-07 19:56:02 +05:30
parent 948c12525e
commit f8747586ab
1 changed files with 22 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
app/page.tsx
View File

@ -386,41 +386,28 @@ export default function Home() {
)} )}
</AnimatePresence> </AnimatePresence>
<AnimatePresence> <div className="space-y-4 sm:space-y-6">
<motion.div {messages.map((message, index) => (
initial={{ opacity: 0, y: 20 }} <div key={index}>
animate={{ opacity: 1, y: 0 }} {message.role === 'assistant' && message.content && (
exit={{ opacity: 0, y: -20 }} <Card className="bg-card text-card-foreground border border-muted !mb-8 sm:!mb-16">
transition={{ duration: 0.5, delay: 0.1 }} <CardContent className="p-3 sm:p-4">
className="space-y-4 sm:space-y-6" <h2 className="text-lg sm:text-xl font-semibold mb-2">Answer</h2>
> <div className="text-sm sm:text-base">
{messages.map((message, index) => ( {renderMarkdown(message.content)}
<motion.div </div>
key={index} </CardContent>
initial={{ opacity: 0, y: 20 }} </Card>
animate={{ opacity: 1, y: 0 }} )}
transition={{ duration: 0.5, delay: index * 0.1 }} {message.toolInvocations?.map((toolInvocation: ToolInvocation, toolIndex: number) => (
> <div key={`tool-${toolIndex}`}>
{message.role === 'assistant' && message.content && ( {renderToolInvocation(toolInvocation, toolIndex)}
<Card className="bg-card text-card-foreground border border-muted !mb-8 sm:!mb-16"> </div>
<CardContent className="p-3 sm:p-4"> ))}
<h2 className="text-lg sm:text-xl font-semibold mb-2">Answer</h2> </div>
<div className="text-sm sm:text-base"> ))}
{renderMarkdown(message.content)} <div ref={bottomRef} />
</div> </div>
</CardContent>
</Card>
)}
{message.toolInvocations?.map((toolInvocation: ToolInvocation, toolIndex: number) => (
<div key={`tool-${toolIndex}`}>
{renderToolInvocation(toolInvocation, toolIndex)}
</div>
))}
</motion.div>
))}
<div ref={bottomRef} />
</motion.div>
</AnimatePresence>
</div> </div>
<AnimatePresence> <AnimatePresence>