From ac53ef62162615debea6e1853ba31515b4e4bb29 Mon Sep 17 00:00:00 2001 From: chanx <1243304602@qq.com> Date: Fri, 1 Aug 2025 12:38:29 +0800 Subject: [PATCH] Fix: Fix share-chat bugs (#9150) ### What problem does this PR solve? Fix: Fix share-chat bugs #3221 ### Type of change - [x] Bug Fix (non-breaking change which fixes an issue) --- .../components/next-message-item/index.tsx | 6 +- web/src/hooks/logic-hooks.ts | 5 ++ web/src/hooks/use-agent-request.ts | 6 +- .../agent/chat/use-send-agent-message.ts | 15 +++- web/src/pages/agent/debug-content/index.tsx | 18 ++-- .../pages/agent/hooks/use-cache-chat-log.ts | 1 + web/src/pages/agent/interface.ts | 6 ++ .../pages/agents/agent-log-detail-modal.tsx | 23 ++++- web/src/pages/next-chats/share/index.tsx | 89 ++++++++++++++----- .../next-chats/share/parameter-dialog.tsx | 31 +++---- 10 files changed, 143 insertions(+), 57 deletions(-) diff --git a/web/src/components/next-message-item/index.tsx b/web/src/components/next-message-item/index.tsx index 735cd8eae..5a7c38380 100644 --- a/web/src/components/next-message-item/index.tsx +++ b/web/src/components/next-message-item/index.tsx @@ -44,6 +44,7 @@ interface IProps nickname?: string; avatar?: string; avatarDialog?: string | null; + agentName?: string; clickDocumentButton?: (documentId: string, chunk: IReferenceChunk) => void; index: number; showLikeButton?: boolean; @@ -60,6 +61,7 @@ function MessageItem({ loading = false, avatar, avatarDialog, + agentName, sendLoading = false, clickDocumentButton, removeMessageById, @@ -120,8 +122,8 @@ function MessageItem({ {visibleAvatar && (item.role === MessageType.User ? ( - ) : avatarDialog ? ( - + ) : avatarDialog || agentName ? ( + ) : ( ))} diff --git a/web/src/hooks/logic-hooks.ts b/web/src/hooks/logic-hooks.ts index 5610d66c2..ef809f478 100644 --- a/web/src/hooks/logic-hooks.ts +++ b/web/src/hooks/logic-hooks.ts @@ -487,6 +487,10 @@ export const useSelectDerivedMessages = () => { [setDerivedMessages], ); + const removeAllMessages = useCallback(() => { + setDerivedMessages([]); + }, [setDerivedMessages]); + return { ref, derivedMessages, @@ -498,6 +502,7 @@ export const useSelectDerivedMessages = () => { addNewestOneQuestion, addNewestOneAnswer, removeMessagesAfterCurrentMessage, + removeAllMessages, }; }; diff --git a/web/src/hooks/use-agent-request.ts b/web/src/hooks/use-agent-request.ts index 3cd803450..40d92ab13 100644 --- a/web/src/hooks/use-agent-request.ts +++ b/web/src/hooks/use-agent-request.ts @@ -10,7 +10,7 @@ import { DSL, IFlow, IFlowTemplate } from '@/interfaces/database/flow'; import { IDebugSingleRequestBody } from '@/interfaces/request/agent'; import i18n from '@/locales/config'; import { BeginId } from '@/pages/agent/constant'; -import { BeginQuery } from '@/pages/agent/interface'; +import { IInputs } from '@/pages/agent/interface'; import { useGetSharedChatSearchParams } from '@/pages/chat/shared-hooks'; import agentService, { fetchAgentLogsByCanvasId, @@ -596,9 +596,9 @@ export const useFetchExternalAgentInputs = () => { data, isFetching: loading, refetch, - } = useQuery>({ + } = useQuery({ queryKey: [AgentApiAction.FetchExternalAgentInputs], - initialData: {} as Record, + initialData: {} as IInputs, refetchOnReconnect: false, refetchOnMount: false, refetchOnWindowFocus: false, diff --git a/web/src/pages/agent/chat/use-send-agent-message.ts b/web/src/pages/agent/chat/use-send-agent-message.ts index 27dead043..96d4dbf72 100644 --- a/web/src/pages/agent/chat/use-send-agent-message.ts +++ b/web/src/pages/agent/chat/use-send-agent-message.ts @@ -182,9 +182,8 @@ export const useSendAgentMessage = ( const { handleInputChange, value, setValue } = useHandleMessageInputChange(); const inputs = useSelectBeginNodeDataInputs(); const [sessionId, setSessionId] = useState(null); - const { send, answerList, done, stopOutputMessage } = useSendMessageBySSE( - url || api.runCanvas, - ); + const { send, answerList, done, stopOutputMessage, resetAnswerList } = + useSendMessageBySSE(url || api.runCanvas); const messageId = useMemo(() => { return answerList[0]?.message_id; }, [answerList]); @@ -204,6 +203,7 @@ export const useSendAgentMessage = ( removeMessageById, addNewestOneQuestion, addNewestOneAnswer, + removeAllMessages, } = useSelectDerivedMessages(); const { addEventList: addEventListFun } = useContext(AgentChatLogContext); const { @@ -280,6 +280,14 @@ export const useSendAgentMessage = ( [addNewestOneQuestion, send], ); + // reset session + const resetSession = useCallback(() => { + stopOutputMessage(); + resetAnswerList(); + setSessionId(null); + removeAllMessages(); + }, [resetAnswerList, removeAllMessages, stopOutputMessage]); + const handlePressEnter = useCallback(() => { if (trim(value) === '') return; const id = uuid(); @@ -336,6 +344,7 @@ export const useSendAgentMessage = ( stopOutputMessage, send, sendFormMessage, + resetSession, findReferenceByMessageId, appendUploadResponseList, }; diff --git a/web/src/pages/agent/debug-content/index.tsx b/web/src/pages/agent/debug-content/index.tsx index f9b46fad1..f61687476 100644 --- a/web/src/pages/agent/debug-content/index.tsx +++ b/web/src/pages/agent/debug-content/index.tsx @@ -237,14 +237,16 @@ const DebugContent = ({ {parameters.map((x, idx) => { return
{renderWidget(x, idx.toString())}
; })} - - {btnText || t(isNext ? 'common.next' : 'flow.run')} - +
+ + {btnText || t(isNext ? 'common.next' : 'flow.run')} + +
diff --git a/web/src/pages/agent/hooks/use-cache-chat-log.ts b/web/src/pages/agent/hooks/use-cache-chat-log.ts index 85365c949..c61079003 100644 --- a/web/src/pages/agent/hooks/use-cache-chat-log.ts +++ b/web/src/pages/agent/hooks/use-cache-chat-log.ts @@ -41,6 +41,7 @@ export function useCacheChatLog() { const clearEventList = useCallback(() => { setEventList([]); + setMessageIdPool({}); }, []); const addEventList = useCallback((events: IEventList, message_id: string) => { diff --git a/web/src/pages/agent/interface.ts b/web/src/pages/agent/interface.ts index c11faa231..0a634c5d8 100644 --- a/web/src/pages/agent/interface.ts +++ b/web/src/pages/agent/interface.ts @@ -33,3 +33,9 @@ export interface BeginQuery { name: string; options: (number | string | boolean)[]; } + +export type IInputs = { + avatar: string; + title: string; + inputs: Record; +}; diff --git a/web/src/pages/agents/agent-log-detail-modal.tsx b/web/src/pages/agents/agent-log-detail-modal.tsx index bf8a6b01c..fd184f736 100644 --- a/web/src/pages/agents/agent-log-detail-modal.tsx +++ b/web/src/pages/agents/agent-log-detail-modal.tsx @@ -5,7 +5,7 @@ import { useFetchUserInfo } from '@/hooks/user-setting-hooks'; import { IAgentLogMessage } from '@/interfaces/database/agent'; import { IReferenceObject, Message } from '@/interfaces/database/chat'; import { buildMessageUuidWithRole } from '@/utils/chat'; -import React from 'react'; +import React, { useMemo } from 'react'; import { IMessage } from '../chat/interface'; interface CustomModalProps { @@ -23,13 +23,32 @@ export const AgentLogDetailModal: React.FC = ({ }) => { const { data: userInfo } = useFetchUserInfo(); const { data: canvasInfo } = useFetchAgent(); + + const shortMessage = useMemo(() => { + const content = derivedMessages[0]?.content || ''; + + const chineseCharCount = (content.match(/[\u4e00-\u9fa5]/g) || []).length; + const totalLength = content.length; + + if (chineseCharCount > 0) { + if (totalLength > 15) { + return content.substring(0, 15) + '...'; + } + } else { + if (totalLength > 30) { + return content.substring(0, 30) + '...'; + } + } + return content; + }, [derivedMessages]); + return (
diff --git a/web/src/pages/next-chats/share/index.tsx b/web/src/pages/next-chats/share/index.tsx index a4f14b1f6..270cfd1bc 100644 --- a/web/src/pages/next-chats/share/index.tsx +++ b/web/src/pages/next-chats/share/index.tsx @@ -3,8 +3,11 @@ import { NextMessageInput } from '@/components/message-input/next'; import MessageItem from '@/components/next-message-item'; import PdfDrawer from '@/components/pdf-drawer'; import { useClickDrawer } from '@/components/pdf-drawer/hooks'; +import { RAGFlowAvatar } from '@/components/ragflow-avatar'; import { useSwitchToDarkThemeOnMount } from '@/components/theme-provider'; +import { Button } from '@/components/ui/button'; import { MessageType } from '@/constants/chat'; +import { useFetchAppConf } from '@/hooks/logic-hooks'; import { useFetchExternalAgentInputs, useUploadCanvasFileWithProgress, @@ -12,10 +15,12 @@ import { import { cn } from '@/lib/utils'; import i18n from '@/locales/config'; import { useCacheChatLog } from '@/pages/agent/hooks/use-cache-chat-log'; +import { IInputs } from '@/pages/agent/interface'; import { useSendButtonDisabled } from '@/pages/chat/hooks'; import { buildMessageUuidWithRole } from '@/utils/chat'; import { isEmpty } from 'lodash'; -import React, { forwardRef, useCallback } from 'react'; +import { RefreshCcw } from 'lucide-react'; +import React, { forwardRef, useCallback, useState } from 'react'; import { useGetSharedChatSearchParams, useSendNextSharedMessage, @@ -38,6 +43,7 @@ const ChatContainer = () => { addEventList, setCurrentMessageId, currentEventListWithoutMessageById, + clearEventList, } = useCacheChatLog(); const { handlePressEnter, @@ -51,26 +57,20 @@ const ChatContainer = () => { findReferenceByMessageId, appendUploadResponseList, parameterDialogVisible, - hideParameterDialog, showParameterDialog, ok, + resetSession, } = useSendNextSharedMessage(addEventList); - const { data } = useFetchExternalAgentInputs(); + // const { data } = useFetchExternalAgentInputs(); const sendDisabled = useSendButtonDisabled(value); - - // useEffect(() => { - // if (derivedMessages.length) { - // const derivedMessagesFilter = derivedMessages.filter( - // (message) => message.role === MessageType.Assistant, - // ); - // if (derivedMessagesFilter.length) { - // const message = derivedMessagesFilter[derivedMessagesFilter.length - 1]; - // setCurrentMessageId(message.id); - // } - // } - // }, [derivedMessages, setCurrentMessageId]); - + const appConf = useFetchAppConf(); + const { data: inputsData } = useFetchExternalAgentInputs(); + const [agentInfo, setAgentInfo] = useState({ + avatar: '', + title: '', + inputs: {}, + }); const handleUploadFile: NonNullable = useCallback( async (files, options) => { @@ -87,20 +87,62 @@ const ChatContainer = () => { }, [locale, visibleAvatar]); React.useEffect(() => { - if (!isEmpty(data)) { + const { avatar, title, inputs } = inputsData; + setAgentInfo({ + avatar, + title, + inputs: inputs, + }); + }, [inputsData, setAgentInfo]); + + React.useEffect(() => { + if (!isEmpty(inputsData)) { showParameterDialog(); } - }, [data, showParameterDialog]); + }, [inputsData, showParameterDialog]); useSwitchToDarkThemeOnMount(); + const handleInputsModalOk = (params: any[]) => { + ok(params); + }; + const handleReset = () => { + resetSession(); + clearEventList(); + }; if (!conversationId) { return
empty
; } return (
-
-
+
+ + {appConf.appName} +
+
+
+
+ +
{agentInfo.title}
+
+ +
+
@@ -123,6 +165,8 @@ const ChatContainer = () => { sendLoading && derivedMessages?.length - 1 === i } + avatarDialog={agentInfo.avatar} + agentName={agentInfo.title} index={i} clickDocumentButton={clickDocumentButton} showLikeButton={false} @@ -164,8 +208,9 @@ const ChatContainer = () => { )} {parameterDialogVisible && ( )}
diff --git a/web/src/pages/next-chats/share/parameter-dialog.tsx b/web/src/pages/next-chats/share/parameter-dialog.tsx index 7868d32f2..a0f249b69 100644 --- a/web/src/pages/next-chats/share/parameter-dialog.tsx +++ b/web/src/pages/next-chats/share/parameter-dialog.tsx @@ -1,33 +1,30 @@ -import { - Dialog, - DialogContent, - DialogHeader, - DialogTitle, -} from '@/components/ui/dialog'; -import { useFetchExternalAgentInputs } from '@/hooks/use-agent-request'; +import { Modal } from '@/components/ui/modal'; import { IModalProps } from '@/interfaces/common'; import DebugContent from '@/pages/agent/debug-content'; import { buildBeginInputListFromObject } from '@/pages/agent/form/begin-form/utils'; +import { BeginQuery } from '@/pages/agent/interface'; interface IProps extends IModalProps { ok(parameters: any[]): void; + data: Record>; } -export function ParameterDialog({ hideModal, ok }: IProps) { - const { data } = useFetchExternalAgentInputs(); - +export function ParameterDialog({ ok, data }: IProps) { return ( - - - - Parameter - + +
- -
+
+ ); }