Merge branch 'feat/universal-chat-fe' into deploy/dev

web/app/components/explore/universal-chat/hooks/use-conversation.ts

 import { useState } from 'react'
 import produce from 'immer'
+import { useGetState } from 'ahooks'
 import type { ConversationItem } from '@/models/share'
 
 const storageConversationIdKey = 'conversationIdInfo'
@@ -8,7 +9,7 @@ type ConversationInfoType = Omit<ConversationItem, 'inputs' | 'id'>
 function useConversation() {
   const [conversationList, setConversationList] = useState<ConversationItem[]>([])
   const [pinnedConversationList, setPinnedConversationList] = useState<ConversationItem[]>([])
-  const [currConversationId, doSetCurrConversationId] = useState<string>('-1')
+  const [currConversationId, doSetCurrConversationId, getCurrConversationId] = useGetState<string>('-1')
   // when set conversation id, we do not have set appId
   const setCurrConversationId = (id: string, appId: string, isSetToLocalStroge = true, newConversationName = '') => {
     doSetCurrConversationId(id)
@@ -53,6 +54,7 @@ function useConversation() {
     pinnedConversationList,
     setPinnedConversationList,
     currConversationId,
+    getCurrConversationId,
     setCurrConversationId,
     getConversationIdFromStorage,
     isNewConversation,

web/app/components/explore/universal-chat/index.tsx

@@ -73,7 +73,6 @@ const Main: FC<IMainProps> = () => {
   const [inited, setInited] = useState<boolean>(false)
   // in mobile, show sidebar by click button
   const [isShowSidebar, { setTrue: showSidebar, setFalse: hideSidebar }] = useBoolean(false)
-
   /*
   * conversation info
   */
@@ -86,6 +85,7 @@ const Main: FC<IMainProps> = () => {
     pinnedConversationList,
     setPinnedConversationList,
     currConversationId,
+    getCurrConversationId,
     setCurrConversationId,
     getConversationIdFromStorage,
     isNewConversation,
@@ -219,7 +219,7 @@ const Main: FC<IMainProps> = () => {
     }
 
     // update chat list of current conversation
-    if (!isNewConversation && !conversationIdChangeBecauseOfNew && !isResponsing) {
+    if (!isNewConversation && !conversationIdChangeBecauseOfNew) {
       fetchChatList(currConversationId).then((res: any) => {
         const { data } = res
         const newChatList: IChatItem[] = generateNewChatListWithOpenstatement(notSyncToStateIntroduction, notSyncToStateInputs)
@@ -413,6 +413,7 @@ const Main: FC<IMainProps> = () => {
   const [messageTaskId, setMessageTaskId] = useState('')
   const [hasStopResponded, setHasStopResponded, getHasStopResponded] = useGetState(false)
   const [errorHappened, setErrorHappened] = useState(false)
+  const [isResponsingConIsCurrCon, setIsResponsingConCurrCon, getIsResponsingConIsCurrCon] = useGetState(true)
   const handleSend = async (message: string) => {
     if (isResponsing) {
       notify({ type: 'info', message: t('appDebug.errorMessage.waitForResponse') })
@@ -471,6 +472,7 @@ const Main: FC<IMainProps> = () => {
     setResponsingTrue()
     setErrorHappened(false)
     setIsShowSuggestion(false)
+    setIsResponsingConCurrCon(true)
 
     sendChatMessage(data, {
       getAbortController: (abortController) => {
@@ -483,6 +485,13 @@ const Main: FC<IMainProps> = () => {
           tempNewConversationId = newConversationId
 
         setMessageTaskId(taskId)
+
+        // has switched to other conversation
+        if (tempNewConversationId !== getCurrConversationId()) {
+          setIsResponsingConCurrCon(false)
+          return
+        }
+
         // closesure new list is outdated.
         const newListWithAnswer = produce(
           getChatList().filter(item => item.id !== responseItem.id && item.id !== placeholderAnswerId),
@@ -492,6 +501,7 @@ const Main: FC<IMainProps> = () => {
 
             draft.push({ ...responseItem })
           })
+
         setChatList(newListWithAnswer)
       },
       async onCompleted(hasError?: boolean) {
@@ -508,7 +518,7 @@ const Main: FC<IMainProps> = () => {
         setConversationIdChangeBecauseOfNew(false)
         resetNewConversationInputs()
         setCurrConversationId(tempNewConversationId, APP_ID, true)
-        if (suggestedQuestionsAfterAnswerConfig?.enabled && !getHasStopResponded()) {
+        if (getIsResponsingConIsCurrCon() && suggestedQuestionsAfterAnswerConfig?.enabled && !getHasStopResponded()) {
           const { data }: any = await fetchSuggestedQuestions(responseItem.id)
           setSuggestQuestions(data)
           setIsShowSuggestion(true)
@@ -519,6 +529,11 @@ const Main: FC<IMainProps> = () => {
         // thought finished then start to return message. Warning: use push agent_thoughts.push would caused problem when the thought is more then 2
         responseItem.id = thought.message_id;
         (responseItem as any).agent_thoughts = [...(responseItem as any).agent_thoughts, thought] // .push(thought)
+        // has switched to other conversation
+        if (tempNewConversationId !== getCurrConversationId()) {
+          setIsResponsingConCurrCon(false)
+          return
+        }
         const newListWithAnswer = produce(
           getChatList().filter(item => item.id !== responseItem.id && item.id !== placeholderAnswerId),
           (draft) => {
@@ -675,7 +690,7 @@ const Main: FC<IMainProps> = () => {
                 isHideFeedbackEdit
                 onFeedback={handleFeedback}
                 isResponsing={isResponsing}
-                canStopResponsing={!!messageTaskId}
+                canStopResponsing={!!messageTaskId && isResponsingConIsCurrCon}
                 abortResponsing={async () => {
                   await stopChatMessageResponding(messageTaskId)
                   setHasStopResponded(true)

web/app/components/share/chat/hooks/use-conversation.ts

 import { useState } from 'react'
 import produce from 'immer'
+import { useGetState } from 'ahooks'
 import type { ConversationItem } from '@/models/share'
 
 const storageConversationIdKey = 'conversationIdInfo'
@@ -8,7 +9,7 @@ type ConversationInfoType = Omit<ConversationItem, 'inputs' | 'id'>
 function useConversation() {
   const [conversationList, setConversationList] = useState<ConversationItem[]>([])
   const [pinnedConversationList, setPinnedConversationList] = useState<ConversationItem[]>([])
-  const [currConversationId, doSetCurrConversationId] = useState<string>('-1')
+  const [currConversationId, doSetCurrConversationId, getCurrConversationId] = useGetState<string>('-1')
   // when set conversation id, we do not have set appId
   const setCurrConversationId = (id: string, appId: string, isSetToLocalStroge = true, newConversationName = '') => {
     doSetCurrConversationId(id)
@@ -53,6 +54,7 @@ function useConversation() {
     pinnedConversationList,
     setPinnedConversationList,
     currConversationId,
+    getCurrConversationId,
     setCurrConversationId,
     getConversationIdFromStorage,
     isNewConversation,

web/app/components/share/chat/index.tsx

@@ -90,6 +90,7 @@ const Main: FC<IMainProps> = ({
     pinnedConversationList,
     setPinnedConversationList,
     currConversationId,
+    getCurrConversationId,
     setCurrConversationId,
     getConversationIdFromStorage,
     isNewConversation,
@@ -214,7 +215,7 @@ const Main: FC<IMainProps> = ({
     }
 
     // update chat list of current conversation
-    if (!isNewConversation && !conversationIdChangeBecauseOfNew && !isResponsing) {
+    if (!isNewConversation && !conversationIdChangeBecauseOfNew) {
       fetchChatList(currConversationId, isInstalledApp, installedAppInfo?.id).then((res: any) => {
         const { data } = res
         const newChatList: IChatItem[] = generateNewChatListWithOpenstatement(notSyncToStateIntroduction, notSyncToStateInputs)
@@ -423,6 +424,7 @@ const Main: FC<IMainProps> = ({
   const [suggestQuestions, setSuggestQuestions] = useState<string[]>([])
   const [messageTaskId, setMessageTaskId] = useState('')
   const [hasStopResponded, setHasStopResponded, getHasStopResponded] = useGetState(false)
+  const [isResponsingConIsCurrCon, setIsResponsingConCurrCon, getIsResponsingConIsCurrCon] = useGetState(true)
 
   const handleSend = async (message: string) => {
     if (isResponsing) {
@@ -465,6 +467,7 @@ const Main: FC<IMainProps> = ({
     setHasStopResponded(false)
     setResponsingTrue()
     setIsShowSuggestion(false)
+    setIsResponsingConCurrCon(true)
     sendChatMessage(data, {
       getAbortController: (abortController) => {
         setAbortController(abortController)
@@ -476,6 +479,11 @@ const Main: FC<IMainProps> = ({
           tempNewConversationId = newConversationId
 
         setMessageTaskId(taskId)
+        // has switched to other conversation
+        if (tempNewConversationId !== getCurrConversationId()) {
+          setIsResponsingConCurrCon(false)
+          return
+        }
         // closesure new list is outdated.
         const newListWithAnswer = produce(
           getChatList().filter(item => item.id !== responseItem.id && item.id !== placeholderAnswerId),
@@ -501,7 +509,7 @@ const Main: FC<IMainProps> = ({
         resetNewConversationInputs()
         setChatNotStarted()
         setCurrConversationId(tempNewConversationId, appId, true)
-        if (suggestedQuestionsAfterAnswerConfig?.enabled && !getHasStopResponded()) {
+        if (getIsResponsingConIsCurrCon() && suggestedQuestionsAfterAnswerConfig?.enabled && !getHasStopResponded()) {
           const { data }: any = await fetchSuggestedQuestions(responseItem.id, isInstalledApp, installedAppInfo?.id)
           setSuggestQuestions(data)
           setIsShowSuggestion(true)
@@ -630,7 +638,7 @@ const Main: FC<IMainProps> = ({
                     isHideFeedbackEdit
                     onFeedback={handleFeedback}
                     isResponsing={isResponsing}
-                    canStopResponsing={!!messageTaskId}
+                    canStopResponsing={!!messageTaskId && isResponsingConIsCurrCon}
                     abortResponsing={async () => {
                       await stopChatMessageResponding(appId, messageTaskId, isInstalledApp, installedAppInfo?.id)
                       setHasStopResponded(true)