From 1ebf7409084851afff650da8b6db96e8fe01df54 Mon Sep 17 00:00:00 2001
From: zxhlyh <jasonapring2015@outlook.com>
Date: Sun, 4 Feb 2024 18:08:53 +0800
Subject: [PATCH] fix: webapp stop chat & citation (#2376)

---
 .../components/app/chat/citation/popup.tsx    | 24 ++++++++++---------
 .../debug/debug-with-single-model/index.tsx   |  6 +----
 .../app/configuration/debug/hooks.tsx         |  1 +
 .../chat/chat-with-history/chat-wrapper.tsx   |  2 ++
 .../base/chat/chat/answer/index.tsx           |  2 +-
 web/app/components/base/chat/chat/hooks.ts    |  8 ++-----
 web/app/components/base/chat/types.ts         |  1 +
 7 files changed, 21 insertions(+), 23 deletions(-)

diff --git a/web/app/components/app/chat/citation/popup.tsx b/web/app/components/app/chat/citation/popup.tsx
index be3034d374..d039d98e6b 100644
--- a/web/app/components/app/chat/citation/popup.tsx
+++ b/web/app/components/app/chat/citation/popup.tsx
@@ -32,7 +32,7 @@ const Popup: FC<PopupProps> = ({
 }) => {
   const { t } = useTranslation()
   const [open, setOpen] = useState(false)
-  const fileType = data.dataSourceType === 'upload_file'
+  const fileType = data.dataSourceType !== 'notion'
     ? (/\.([^.]*)$/g.exec(data.documentName)?.[1] || '')
     : 'notion'
 
@@ -65,22 +65,24 @@ const Popup: FC<PopupProps> = ({
               data.sources.map((source, index) => (
                 <Fragment key={index}>
                   <div className='group py-3'>
-                    {
-                      showHitInfo && (
-                        <div className='flex items-center justify-between mb-2'>
-                          <div className='flex items-center px-1.5 h-5 border border-gray-200 rounded-md'>
-                            <Hash02 className='mr-0.5 w-3 h-3 text-gray-400' />
-                            <div className='text-[11px] font-medium text-gray-500'>{source.segment_position}</div>
-                          </div>
+                    <div className='flex items-center justify-between mb-2'>
+                      <div className='flex items-center px-1.5 h-5 border border-gray-200 rounded-md'>
+                        <Hash02 className='mr-0.5 w-3 h-3 text-gray-400' />
+                        <div className='text-[11px] font-medium text-gray-500'>
+                          {source.segment_position || index + 1}
+                        </div>
+                      </div>
+                      {
+                        showHitInfo && (
                           <Link
                             href={`/datasets/${source.dataset_id}/documents/${source.document_id}`}
                             className='hidden items-center h-[18px] text-xs text-primary-600 group-hover:flex'>
                             {t('common.chat.citation.linkToDataset')}
                             <ArrowUpRight className='ml-1 w-3 h-3' />
                           </Link>
-                        </div>
-                      )
-                    }
+                        )
+                      }
+                    </div>
                     <div className='text-[13px] text-gray-800'>{source.content}</div>
                     {
                       showHitInfo && (
diff --git a/web/app/components/app/configuration/debug/debug-with-single-model/index.tsx b/web/app/components/app/configuration/debug/debug-with-single-model/index.tsx
index c235617eeb..6a8a416e81 100644
--- a/web/app/components/app/configuration/debug/debug-with-single-model/index.tsx
+++ b/web/app/components/app/configuration/debug/debug-with-single-model/index.tsx
@@ -54,11 +54,7 @@ const DebugWithSingleModel = forwardRef<DebugWithSingleModelRefType, DebugWithSi
     handleAnnotationEdited,
     handleAnnotationRemoved,
   } = useChat(
-    {
-      ...config,
-      supportAnnotation: true,
-      appId,
-    },
+    config,
     {
       inputs,
       promptVariables: modelConfig.configs.prompt_variables,
diff --git a/web/app/components/app/configuration/debug/hooks.tsx b/web/app/components/app/configuration/debug/hooks.tsx
index a77403db18..12022e706a 100644
--- a/web/app/components/app/configuration/debug/hooks.tsx
+++ b/web/app/components/app/configuration/debug/hooks.tsx
@@ -126,6 +126,7 @@ export const useConfigFromDebugContext = () => {
 
     supportAnnotation: true,
     appId,
+    supportCitationHitInfo: true,
   }
 
   return config
diff --git a/web/app/components/base/chat/chat-with-history/chat-wrapper.tsx b/web/app/components/base/chat/chat-with-history/chat-wrapper.tsx
index 1e58e37b64..a8a58b55f6 100644
--- a/web/app/components/base/chat/chat-with-history/chat-wrapper.tsx
+++ b/web/app/components/base/chat/chat-with-history/chat-wrapper.tsx
@@ -11,6 +11,7 @@ import ConfigPanel from './config-panel'
 import {
   fetchSuggestedQuestions,
   getUrl,
+  stopChatMessageResponding,
 } from '@/service/share'
 
 const ChatWrapper = () => {
@@ -47,6 +48,7 @@ const ChatWrapper = () => {
     appConfig,
     undefined,
     appPrevChatList,
+    taskId => stopChatMessageResponding('', taskId, isInstalledApp, appId),
   )
 
   useEffect(() => {
diff --git a/web/app/components/base/chat/chat/answer/index.tsx b/web/app/components/base/chat/chat/answer/index.tsx
index b86ecc105a..2c2b06c1e2 100644
--- a/web/app/components/base/chat/chat/answer/index.tsx
+++ b/web/app/components/base/chat/chat/answer/index.tsx
@@ -97,7 +97,7 @@ const Answer: FC<AnswerProps> = ({
             <SuggestedQuestions item={item} />
             {
               !!citation?.length && config?.retriever_resource?.enabled && !responsing && (
-                <Citation data={citation} showHitInfo />
+                <Citation data={citation} showHitInfo={config.supportCitationHitInfo} />
               )
             }
           </div>
diff --git a/web/app/components/base/chat/chat/hooks.ts b/web/app/components/base/chat/chat/hooks.ts
index 87cf0a9dc2..71e76f26ad 100644
--- a/web/app/components/base/chat/chat/hooks.ts
+++ b/web/app/components/base/chat/chat/hooks.ts
@@ -87,7 +87,6 @@ export const useChat = (
   const chatListRef = useRef<ChatItem[]>(prevChatList || [])
   const taskIdRef = useRef('')
   const [suggestedQuestions, setSuggestQuestions] = useState<string[]>([])
-  const abortControllerRef = useRef<AbortController | null>(null)
   const conversationMessagesAbortControllerRef = useRef<AbortController | null>(null)
   const suggestedQuestionsAbortControllerRef = useRef<AbortController | null>(null)
   const checkPromptVariables = useCheckPromptVariables()
@@ -131,8 +130,6 @@ export const useChat = (
     handleResponsing(false)
     if (stopChat && taskIdRef.current)
       stopChat(taskIdRef.current)
-    if (abortControllerRef.current)
-      abortControllerRef.current.abort()
     if (conversationMessagesAbortControllerRef.current)
       conversationMessagesAbortControllerRef.current.abort()
     if (suggestedQuestionsAbortControllerRef.current)
@@ -192,6 +189,8 @@ export const useChat = (
     }: SendCallback,
   ) => {
     setSuggestQuestions([])
+    if (!data.query || !data.query.trim())
+      return
     if (isResponsingRef.current) {
       notify({ type: 'info', message: t('appDebug.errorMessage.waitForResponse') })
       return false
@@ -257,9 +256,6 @@ export const useChat = (
       },
       {
         isPublicAPI,
-        getAbortController: (abortController) => {
-          abortControllerRef.current = abortController
-        },
         onData: (message: string, isFirstMessage: boolean, { conversationId: newConversationId, messageId, taskId }: any) => {
           if (!isAgentMode) {
             responseItem.content = responseItem.content + message
diff --git a/web/app/components/base/chat/types.ts b/web/app/components/base/chat/types.ts
index 88cfb986e8..db88a6ddc5 100644
--- a/web/app/components/base/chat/types.ts
+++ b/web/app/components/base/chat/types.ts
@@ -45,6 +45,7 @@ export type ChatConfig = Omit<ModelConfig, 'model'> & {
   supportAnnotation?: boolean
   appId?: string
   supportFeedback?: boolean
+  supportCitationHitInfo?: boolean
 }
 
 export type ChatItem = IChatItem