From c9abb75fce4291b6f67b06f706a366ed4ff8a472 Mon Sep 17 00:00:00 2001
From: Nite Knite <nkCoding@gmail.com>
Date: Fri, 12 Apr 2024 12:19:27 +0800
Subject: [PATCH] feat: show citation info in run history (#3399)

---
 .../debug/debug-with-multiple-model/chat-item.tsx         | 2 +-
 .../configuration/debug/debug-with-single-model/index.tsx | 2 +-
 web/app/components/base/chat/chat/answer/index.tsx        | 4 ++--
 web/app/components/base/chat/chat/index.tsx               | 7 ++++---
 web/app/components/workflow/panel/chat-record/index.tsx   | 8 +++++---
 .../workflow/panel/debug-and-preview/chat-wrapper.tsx     | 2 +-
 6 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/web/app/components/app/configuration/debug/debug-with-multiple-model/chat-item.tsx b/web/app/components/app/configuration/debug/debug-with-multiple-model/chat-item.tsx
index 6c6722a8ec..39a063182e 100644
--- a/web/app/components/app/configuration/debug/debug-with-multiple-model/chat-item.tsx
+++ b/web/app/components/app/configuration/debug/debug-with-multiple-model/chat-item.tsx
@@ -121,7 +121,7 @@ const ChatItem: FC<ChatItemProps> = ({
       isResponding={isResponding}
       noChatInput
       noStopResponding
-      chatContainerclassName='p-4'
+      chatContainerClassName='p-4'
       chatFooterClassName='p-4 pb-0'
       suggestedQuestions={suggestedQuestions}
       onSend={doSend}
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 a14211efa1..9ffc7ad0ea 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
@@ -119,7 +119,7 @@ const DebugWithSingleModel = forwardRef<DebugWithSingleModelRefType, DebugWithSi
       config={config}
       chatList={chatList}
       isResponding={isResponding}
-      chatContainerclassName='p-6'
+      chatContainerClassName='p-6'
       chatFooterClassName='px-6 pt-10 pb-4'
       suggestedQuestions={suggestedQuestions}
       onSend={doSend}
diff --git a/web/app/components/base/chat/chat/answer/index.tsx b/web/app/components/base/chat/chat/answer/index.tsx
index c280939398..d338efc7e5 100644
--- a/web/app/components/base/chat/chat/answer/index.tsx
+++ b/web/app/components/base/chat/chat/answer/index.tsx
@@ -163,8 +163,8 @@ const Answer: FC<AnswerProps> = ({
             }
             <SuggestedQuestions item={item} />
             {
-              !!citation?.length && config?.retriever_resource?.enabled && !responding && (
-                <Citation data={citation} showHitInfo={config.supportCitationHitInfo} />
+              !!citation?.length && !responding && (
+                <Citation data={citation} showHitInfo={config?.supportCitationHitInfo} />
               )
             }
           </div>
diff --git a/web/app/components/base/chat/chat/index.tsx b/web/app/components/base/chat/chat/index.tsx
index f0a2b345bf..87332931f3 100644
--- a/web/app/components/base/chat/chat/index.tsx
+++ b/web/app/components/base/chat/chat/index.tsx
@@ -11,6 +11,7 @@ import {
 } from 'react'
 import { useTranslation } from 'react-i18next'
 import { debounce } from 'lodash-es'
+import classNames from 'classnames'
 import type {
   ChatConfig,
   ChatItem,
@@ -36,7 +37,7 @@ export type ChatProps = {
   onStopResponding?: () => void
   noChatInput?: boolean
   onSend?: OnSend
-  chatContainerclassName?: string
+  chatContainerClassName?: string
   chatContainerInnerClassName?: string
   chatFooterClassName?: string
   chatFooterInnerClassName?: string
@@ -60,7 +61,7 @@ const Chat: FC<ChatProps> = ({
   noStopResponding,
   onStopResponding,
   noChatInput,
-  chatContainerclassName,
+  chatContainerClassName,
   chatContainerInnerClassName,
   chatFooterClassName,
   chatFooterInnerClassName,
@@ -171,7 +172,7 @@ const Chat: FC<ChatProps> = ({
       <div className='relative h-full'>
         <div
           ref={chatContainerRef}
-          className={`relative h-full overflow-y-auto ${chatContainerclassName}`}
+          className={classNames('relative h-full overflow-y-auto', chatContainerClassName)}
         >
           {chatNode}
           <div
diff --git a/web/app/components/workflow/panel/chat-record/index.tsx b/web/app/components/workflow/panel/chat-record/index.tsx
index d88ac6f943..ecc653c431 100644
--- a/web/app/components/workflow/panel/chat-record/index.tsx
+++ b/web/app/components/workflow/panel/chat-record/index.tsx
@@ -35,7 +35,7 @@ const ChatRecord = () => {
           content: item.answer,
           feedback: item.feedback,
           isAnswer: true,
-          citation: item.retriever_resources,
+          citation: item.metadata?.retriever_resources,
           message_files: item.message_files?.filter((file: any) => file.belongs_to === 'assistant') || [],
           workflow_run_id: item.workflow_run_id,
         })
@@ -82,9 +82,11 @@ const ChatRecord = () => {
           </div>
           <div className='grow h-0'>
             <Chat
-              config={{} as any}
+              config={{
+                supportCitationHitInfo: true,
+              } as any}
               chatList={chatMessageList}
-              chatContainerclassName='px-4'
+              chatContainerClassName='px-4'
               chatContainerInnerClassName='pt-6'
               chatFooterClassName='px-4 rounded-b-2xl'
               chatFooterInnerClassName='pb-4'
diff --git a/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx b/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
index d3baa75cc5..015f85d101 100644
--- a/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
+++ b/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
@@ -94,7 +94,7 @@ const ChatWrapper = forwardRef<ChatWrapperRefType>((_, ref) => {
       } as any}
       chatList={chatList}
       isResponding={isResponding}
-      chatContainerclassName='px-4'
+      chatContainerClassName='px-4'
       chatContainerInnerClassName='pt-6'
       chatFooterClassName='px-4 rounded-bl-2xl'
       chatFooterInnerClassName='pb-4'