Streaming wiht thoughts and actions working much better but still get error for web search

1 files changed, 17 insertions, 15 deletions

diff --git a/src/client/views/nodes/ChatBox/MessageComponent.tsx b/src/client/views/nodes/ChatBox/MessageComponent.tsx
index e82dcd5f7..0b8fa6b96 100644
--- a/src/client/views/nodes/ChatBox/MessageComponent.tsx
+++ b/src/client/views/nodes/ChatBox/MessageComponent.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { observer } from 'mobx-react';
-import { AssistantMessage, Citation, MessageContent, TEXT_TYPE } from './types';
+import { AssistantMessage, Citation, MessageContent, PROCESSING_TYPE, ProcessingInfo, TEXT_TYPE } from './types';
 import Markdown from 'react-markdown';
 
 interface MessageComponentProps {
@@ -68,22 +68,24 @@ const MessageComponentBox: React.FC<MessageComponentProps> = function ({ message
         }
     };
 
+    console.log(message.processing_info);
+
     return (
         <div className={`message ${message.role}`}>
-            {message.thoughts &&
-                message.thoughts.map((thought, idx) => (
-                    <div key={idx} className="thought">
-                        <i>Thought: {thought}</i>
-                    </div>
-                ))}
-            {message.actions &&
-                message.actions.map((action, idx) => (
-                    <div key={idx} className="action">
-                        <strong>Action:</strong> {action.action}
-                        <br />
-                        <strong>Input:</strong> {action.action_input}
-                    </div>
-                ))}
+            {message.processing_info &&
+                (message.processing_info as ProcessingInfo[]).map(item =>
+                    item.type === PROCESSING_TYPE.THOUGHT ? (
+                        <div key={item.index} className="thought">
+                            <strong>Thought:</strong> {item.content}
+                        </div>
+                    ) : item.type === PROCESSING_TYPE.ACTION ? (
+                        <div key={item.index} className="action">
+                            <strong>Action:</strong> {item.content}
+                        </div>
+                    ) : (
+                        <div key={item.index} className="error"></div>
+                    )
+                )}
             <div>{message.content && message.content.map(messageFragment => <React.Fragment key={messageFragment.index}>{renderContent(messageFragment)}</React.Fragment>)}</div>
             {message.follow_up_questions && message.follow_up_questions.length > 0 && (
                 <div className="follow-up-questions">