apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-05-19 18:35:18 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

scroll button

Browse source
This commit is contained in:
Arjun 2026-04-07 08:39:39 +05:30
parent a273d0e8b7
commit 96e6b79f77
3 changed files with 17 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

2
apps/x/apps/renderer/src/App.tsx
View file

@ -20,6 +20,7 @@ import {
Conversation, Conversation,
ConversationContent, ConversationContent,
ConversationEmptyState, ConversationEmptyState,
ConversationScrollButton,
} from '@/components/ai-elements/conversation'; } from '@/components/ai-elements/conversation';
import { import {
Message, Message,
@ -4420,6 +4421,7 @@ function App() {
</> </>
)} )}
</ConversationContent> </ConversationContent>
<ConversationScrollButton />
</Conversation> </Conversation>
</div> </div>
) )

8
apps/x/apps/renderer/src/components/ai-elements/conversation.tsx
View file

@ -292,16 +292,16 @@ export const ConversationScrollButton = ({
!isAtBottom && ( !isAtBottom && (
<Button <Button
className={cn( className={cn(
"absolute bottom-4 left-[50%] translate-x-[-50%] rounded-full", "absolute bottom-6 left-[50%] z-10 h-14 w-14 translate-x-[-50%] rounded-full border border-border/70 bg-background/95 text-foreground shadow-lg backdrop-blur-sm transition hover:bg-background",
className className
)} )}
aria-label="Scroll to latest message"
onClick={handleScrollToBottom} onClick={handleScrollToBottom}
size="icon"
type="button" type="button"
variant="outline" variant="ghost"
{...props} {...props}
> >
<ArrowDownIcon className="size-4" /> <ArrowDownIcon className="size-7" strokeWidth={1.75} />
</Button> </Button>
) )
); );

20
apps/x/apps/renderer/src/components/chat-sidebar.tsx
View file

@ -8,6 +8,7 @@ import {
Conversation, Conversation,
ConversationContent, ConversationContent,
ConversationEmptyState, ConversationEmptyState,
ConversationScrollButton,
} from '@/components/ai-elements/conversation' } from '@/components/ai-elements/conversation'
import { import {
Message, Message,
@ -487,11 +488,11 @@ export function ChatSidebar({
)} )}
data-chat-tab-panel={tab.id} data-chat-tab-panel={tab.id}
aria-hidden={!isActive} aria-hidden={!isActive}
> >
<Conversation <Conversation
anchorMessageId={viewportAnchors[tab.id]?.messageId} anchorMessageId={viewportAnchors[tab.id]?.messageId}
anchorRequestKey={viewportAnchors[tab.id]?.requestKey} anchorRequestKey={viewportAnchors[tab.id]?.requestKey}
className="relative flex-1" className="relative flex-1"
> >
<ConversationContent className={tabHasConversation ? 'mx-auto w-full max-w-4xl px-3 pb-28' : 'mx-auto w-full max-w-4xl min-h-full items-center justify-center px-3 pb-0'}> <ConversationContent className={tabHasConversation ? 'mx-auto w-full max-w-4xl px-3 pb-28' : 'mx-auto w-full max-w-4xl min-h-full items-center justify-center px-3 pb-0'}>
{!tabHasConversation ? ( {!tabHasConversation ? (
@ -550,10 +551,11 @@ export function ChatSidebar({
</Message> </Message>
)} )}
</> </>
)} )}
</ConversationContent> </ConversationContent>
</Conversation> <ConversationScrollButton />
</div> </Conversation>
</div>
) )
})} })}
</div> </div>