chat workflow run

web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx

@@ -1,23 +1,41 @@
+import {
+  memo,
+  useCallback,
+} from 'react'
+import { useStore } from '../../store'
 import UserInput from './user-input'
+import { useChat } from './hooks'
 import Chat from '@/app/components/base/chat/chat'
-import { useChat } from '@/app/components/base/chat/chat/hooks'
+import type { OnSend } from '@/app/components/base/chat/types'
 
 const ChatWrapper = () => {
   const {
+    conversationId,
+    chatList,
     handleStop,
     isResponding,
     suggestedQuestions,
+    handleSend,
   } = useChat()
 
+  const doSend = useCallback<OnSend>((query, files) => {
+    handleSend({
+      query,
+      files,
+      inputs: useStore.getState().inputs,
+      conversationId,
+    })
+  }, [conversationId, handleSend])
+
   return (
     <Chat
-      chatList={[]}
+      chatList={chatList}
       isResponding={isResponding}
       chatContainerclassName='px-4'
-      chatContainerInnerClassName='px-4'
-      chatFooterClassName='pb-4'
-      chatFooterInnerClassName='px-4'
-      onSend={() => {}}
+      chatContainerInnerClassName='pt-6'
+      chatFooterClassName='px-4'
+      chatFooterInnerClassName='pb-4'
+      onSend={doSend}
       onStopResponding={handleStop}
       chatNode={<UserInput />}
       allToolIcons={{}}
@@ -26,4 +44,4 @@ const ChatWrapper = () => {
   )
 }
 
-export default ChatWrapper
+export default memo(ChatWrapper)