jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

chat working as old with websocket, need to improve error handling and file events

Browse source
This commit is contained in:
anovazzi1 2023-04-25 17:51:16 -03:00
commit 61a3b9aad4
1 changed files with 28 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

38
src/frontend/src/modals/chatModal/index.tsx
View file

@ -10,7 +10,7 @@ import { typesContext } from "../../contexts/typesContext";
import ChatMessage from "./chatMessage"; import ChatMessage from "./chatMessage";
import { FaEraser } from "react-icons/fa"; import { FaEraser } from "react-icons/fa";
import { sendAllProps } from "../../types/api"; import { sendAllProps } from "../../types/api";
import { ChatMessageType } from "../../types/chat"; import { ChatMessageType, ChatType } from "../../types/chat";
const _ = require("lodash"); const _ = require("lodash");
@ -23,8 +23,7 @@ export default function ChatModal({
setOpen: Function; setOpen: Function;
flow: FlowType; flow: FlowType;
}) { }) {
const { updateFlow, lockChat, setLockChat} = const { updateFlow, lockChat, setLockChat } = useContext(TabsContext);
useContext(TabsContext);
const [chatValue, setChatValue] = useState(""); const [chatValue, setChatValue] = useState("");
const [chatHistory, setChatHistory] = useState<ChatMessageType[]>([]); const [chatHistory, setChatHistory] = useState<ChatMessageType[]>([]);
const { reactFlowInstance } = useContext(typesContext); const { reactFlowInstance } = useContext(typesContext);
@ -35,7 +34,6 @@ export default function ChatModal({
isSend: boolean, isSend: boolean,
thought?: string thought?: string
) => { ) => {
setChatHistory((old) => { setChatHistory((old) => {
let newChat = _.cloneDeep(old); let newChat = _.cloneDeep(old);
if (thought) { if (thought) {
@ -55,9 +53,31 @@ export default function ChatModal({
newWs.onmessage = (event) => { newWs.onmessage = (event) => {
const data = JSON.parse(event.data); const data = JSON.parse(event.data);
console.log("Received data:", data); console.log("Received data:", data);
if(Array.isArray(data)){ //get chat history
console.log("entrou") if (Array.isArray(data)) {
setChatHistory([{isSend:true,message:"sdsdsad"}]) console.log("entrou");
setChatHistory((_) => {
let newChatHistory: ChatMessageType[] = [];
data.forEach(
(chatItem: {
intermediate_steps?: "string";
is_bot: boolean;
message: string;
type: string;
}) => {
newChatHistory.push({
isSend: !chatItem.is_bot,
message: chatItem.message,
thought:chatItem.intermediate_steps
});
}
);
return newChatHistory;
});
}
if(data.type==='end'){
addChatHistory(data.message, false, data.intermediate_steps);
} }
// Do something with the data received from the WebSocket // Do something with the data received from the WebSocket
}; };
@ -72,7 +92,6 @@ export default function ChatModal({
if (ws) { if (ws) {
ws.send(JSON.stringify(data)); ws.send(JSON.stringify(data));
} }
return { data: { result: "sdsdsad", thought: "dsdsad" } };
} }
useEffect(() => { useEffect(() => {
@ -143,8 +162,7 @@ export default function ChatModal({
name: flow.name, name: flow.name,
description: flow.description, description: flow.description,
}) })
.then((r) => { .then(() => {
addChatHistory(r.data.result, false, r.data.thought);
setLockChat(false); setLockChat(false);
}) })
.catch((error) => { .catch((error) => {