yt-chat-components 1.1.6 → 1.1.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yt-chat-components",
-  "version": "1.1.6",
+  "version": "1.1.7",
   "main": "build/static/js/bundle.min.js",
   "module": "build/static/js/bundle.min.js",
   "types": "build/static/js/index.d.ts",
@@ -23,7 +23,6 @@
     "lodash": "^4.17.21",
     "echarts": "^5.6.0",
     "echarts-for-react": "^3.0.2",
-    "lodash": "^4.17.21",
     "lucide-react": "^0.256.0",
     "react-draggable": "^4.4.6",
     "react": "^17.0.0 || ^18.0.0",

package/src/YtChatView/chatWidget/chatWindow/chatPlaceholder/index.tsx

@@ -1,23 +1,23 @@
-// @ts-nocheck
-import { MoreHorizontal } from "lucide-react";
-import { ChatMessagePlaceholderType } from "../types/chatWidget";
-// import './index.module.css'
-
-export default function ChatMessagePlaceholder({
-  bot_message_style,
-}: ChatMessagePlaceholderType) {
-  return (
-    <div
-      className="cl-chat-message cl-justify-start"
-    >
-        <div style={bot_message_style} className={"cl-bot_message"}>
-            <div className="cl-animate-pulse">
-              <div className="plh_textBox">
-                <div className="plh_text">深度思考中</div>
-                <MoreHorizontal />
-              </div>
-            </div>
-        </div>
-    </div>
-  );
-}
+// @ts-nocheck
+import { MoreHorizontal } from "lucide-react";
+import { ChatMessagePlaceholderType } from "../types/chatWidget";
+// import './index.module.css'
+
+export default function ChatMessagePlaceholder({
+  bot_message_style, aiStatus
+}: ChatMessagePlaceholderType) {
+  return (
+    <div
+      className="cl-chat-message cl-justify-start"
+    >
+        <div style={bot_message_style} className={"cl-bot_message"}>
+            <div className="cl-animate-pulse">
+              <div className="plh_textBox">
+                <div className="plh_text">{aiStatus ? aiStatus : "深度思考中"}</div>
+                <MoreHorizontal />
+              </div>
+            </div>
+        </div>
+    </div>
+  );
+}

package/src/YtChatView/chatWidget/chatWindow/index.tsx

@@ -127,7 +127,7 @@ export default function ChatWindow({
 }) {
   const ref = useRef<HTMLDivElement>(null);
   const lastMessage = useRef<HTMLDivElement>(null);
-  const [windowPosition, setWindowPosition] = useState({ left: '0', top: '0' });
+  const [aiStatus, setAiStatus] = useState(null);
   const inputRef = useRef<HTMLInputElement>(null); /* User input Ref */
   /* Initial listener for loss of focus that refocuses User input after a small delay */
   const [nowAIContent, setNowAIContent] = useState<string>('');
@@ -170,7 +170,7 @@ export default function ChatWindow({
   const handleDelayMessage = () => {
     if (delayMessageList.length > 0) {
       const message = delayMessageList.shift();
-      console.log("-- add = delay")
+      // console.log("-- add = delay")
       addMessage(message);
       handleDelayMessage();
     }
@@ -220,6 +220,11 @@ export default function ChatWindow({
       })
       delayMessageTimer()
     }
+    else if (event == 'status') {
+      // 更新状态
+      console.log("-- status = ", data)
+      setAiStatus(data.status)
+    }
     else if (event == 'end') {
       const res = {
         data: data['result'],
@@ -291,6 +296,7 @@ export default function ChatWindow({
         contentRef.current = null
       }
       setSendingMessage(false);
+      setAiStatus(null)
     }
   };
 
@@ -862,6 +868,9 @@ export default function ChatWindow({
               key={index}
               className="w_tagItemBox"
               onClick={() => {
+                if (sendingMessage){
+                  return
+                }
                 handleSendMessage(item?.name);
                 setFileList([]);
               }}
@@ -1085,7 +1094,7 @@ export default function ChatWindow({
                   message={{ message: nowAIContent}}
                   isSend={false}
                   handleSendMessage={handleSendMessage}
-                /> : <ChatMessagePlaceholder bot_message_style={bot_message_style} />
+                /> : <ChatMessagePlaceholder bot_message_style={bot_message_style} aiStatus={aiStatus} />
               )
             }
             <div ref={lastMessage}></div>