From 89d158dc8bdcba29e67d61c40c38c4f2bf43b936 Mon Sep 17 00:00:00 2001 From: Akarshan Date: Thu, 30 Oct 2025 11:01:21 +0530 Subject: [PATCH] feat: update ScrollToBottom to use message status for button visibility MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Use the `MessageStatus` enum to determine when the “Generate AI Response” button should appear. Previously the visibility logic checked the last message’s role or the presence of tool calls, which could be unreliable since we moved to combined tool call/reasoning block. By checking that the last message exists and its status is not `Ready` which is that the message is finished generating when an eot token is found, the button is shown only while the AI has stopped generating before it could end properly, improving UX and aligning the UI state with the underlying message state. The change also imports `MessageStatus` and cleans up formatting for readability. --- web-app/src/containers/ScrollToBottom.tsx | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/web-app/src/containers/ScrollToBottom.tsx b/web-app/src/containers/ScrollToBottom.tsx index b1259480f..c2ae8403f 100644 --- a/web-app/src/containers/ScrollToBottom.tsx +++ b/web-app/src/containers/ScrollToBottom.tsx @@ -8,6 +8,7 @@ import { cn } from '@/lib/utils' import { ArrowDown } from 'lucide-react' import { useTranslation } from '@/i18n/react-i18next-compat' import { useAppState } from '@/hooks/useAppState' +import { MessageStatus } from '@janhq/core' const ScrollToBottom = ({ threadId, @@ -18,8 +19,10 @@ const ScrollToBottom = ({ }) => { const { t } = useTranslation() const appMainViewBgColor = useAppearance((state) => state.appMainViewBgColor) - const { showScrollToBottomBtn, scrollToBottom } = - useThreadScrolling(threadId, scrollContainerRef) + const { showScrollToBottomBtn, scrollToBottom } = useThreadScrolling( + threadId, + scrollContainerRef + ) const { messages } = useMessages( useShallow((state) => ({ messages: state.messages[threadId], @@ -28,12 +31,9 @@ const ScrollToBottom = ({ const streamingContent = useAppState((state) => state.streamingContent) + const lastMsg = messages[messages.length - 1] const showGenerateAIResponseBtn = - (messages[messages.length - 1]?.role === 'user' || - (messages[messages.length - 1]?.metadata && - 'tool_calls' in (messages[messages.length - 1].metadata ?? {}))) && - !streamingContent - + !!lastMsg && lastMsg.status !== MessageStatus.Ready && !streamingContent return (