animate reasoning title

This commit is contained in:
Nate Kelley 2025-02-11 17:09:12 -07:00
parent af55cdc137
commit 2ba75e242b
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
3 changed files with 40 additions and 18 deletions

View File

@ -78,12 +78,12 @@ const TextContainer: React.FC<{
styles.hideSecondaryText, styles.hideSecondaryText,
'flex w-full items-center space-x-1.5 overflow-hidden' 'flex w-full items-center space-x-1.5 overflow-hidden'
)}> )}>
<AnimatedThoughtTitle title={title} /> <AnimatedThoughtTitle title={title} type="default" />
{secondaryTitle && ( <AnimatedThoughtTitle
<Text size="sm" type="tertiary" className="secondary-text truncate" lineHeight={lineHeight}> title={secondaryTitle}
{secondaryTitle} type="tertiary"
</Text> className="secondary-text truncate"
)} />
</div> </div>
); );
}); });
@ -96,17 +96,33 @@ const animations = {
exit: { opacity: 0 } exit: { opacity: 0 }
}; };
const AnimatedThoughtTitle = React.memo(({ title }: { title: string }) => { const AnimatedThoughtTitle = React.memo(
return ( ({
<AnimatePresence initial={false} mode="wait"> title,
<motion.div className="flex" {...animations} key={title}> type,
<Text size="sm" className="whitespace-nowrap" lineHeight={lineHeight}> className = ''
{title} }: {
</Text> title: string | undefined;
</motion.div> type: 'tertiary' | 'default';
</AnimatePresence> className?: string;
); }) => {
}); return (
<AnimatePresence initial={false} mode="wait">
{title && (
<motion.div className="flex" {...animations} key={title}>
<Text
size="sm"
className={`whitespace-nowrap ${className}`}
type={type}
lineHeight={lineHeight}>
{title}
</Text>
</motion.div>
)}
</AnimatePresence>
);
}
);
AnimatedThoughtTitle.displayName = 'AnimatedThoughtTitle'; AnimatedThoughtTitle.displayName = 'AnimatedThoughtTitle';
const useStyles = createStyles(({ token, css }) => ({ const useStyles = createStyles(({ token, css }) => ({

View File

@ -44,6 +44,12 @@ export const useInitialChatLayout = ({
} }
}, [chatId]); }, [chatId]);
// useEffect(() => {
// if (isReasoningFile) {
// setIsCollapseOpen(false);
// }
// }, [isReasoningFile]);
return { return {
isPureFile, isPureFile,
isPureChat, isPureChat,

View File

@ -30,7 +30,7 @@ export const useChatSelectors = ({
); );
const getChatMessagesMemoized = useMemoizedFn((chatId: string) => { const getChatMessagesMemoized = useMemoizedFn((chatId: string) => {
const chatMessageIds = chatsRef.current[chatId].messages || []; const chatMessageIds = chatsRef.current[chatId]?.messages || [];
return chatMessageIds.map((messageId) => chatsMessagesRef.current[messageId]); return chatMessageIds.map((messageId) => chatsMessagesRef.current[messageId]);
}); });