Update ChatScrollToBottom.tsx

This commit is contained in:
Nate Kelley 2025-04-10 12:17:31 -06:00
parent 21b893d632
commit 55d2a1dc3c
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
1 changed files with 13 additions and 10 deletions

View File

@ -2,22 +2,25 @@ import { type useAutoScroll } from '@/hooks/useAutoScroll';
import React from 'react';
import { ChevronDown } from '@/components/ui/icons';
import { cn } from '@/lib/utils';
import { AppTooltip } from '@/components/ui/tooltip';
export const ChatScrollToBottom: React.FC<{
isAutoScrollEnabled: boolean;
scrollToBottom: ReturnType<typeof useAutoScroll>['scrollToBottom'];
}> = React.memo(({ isAutoScrollEnabled, scrollToBottom }) => {
return (
<button
onClick={() => scrollToBottom('instant')}
className={cn(
'bg-background/90 hover:bg-item-hover/90 absolute -top-9 right-3 z-10 rounded-full border p-2 shadow transition-all duration-300 hover:scale-105 hover:shadow-md',
isAutoScrollEnabled
? 'pointer-events-none scale-90 opacity-0'
: 'pointer-events-auto scale-100 cursor-pointer opacity-100'
)}>
<ChevronDown />
</button>
<AppTooltip title="Stick to bottom">
<button
onClick={scrollToBottom}
className={cn(
'bg-background/90 hover:bg-item-hover/90 absolute -top-9 right-3 z-10 rounded-full border p-2 shadow transition-all duration-300 hover:scale-105 hover:shadow-md',
isAutoScrollEnabled
? 'pointer-events-none scale-90 opacity-0'
: 'pointer-events-auto scale-100 cursor-pointer opacity-100'
)}>
<ChevronDown />
</button>
</AppTooltip>
);
});