From 3b12a76a651fae7e835da3eb3138c548f3ab7318 Mon Sep 17 00:00:00 2001 From: anovazzi1 Date: Mon, 15 May 2023 10:25:27 -0300 Subject: [PATCH] removed save on browser application state to prevent bugs and fixed error on star for websockets --- src/frontend/src/contexts/tabsContext.tsx | 68 +++++++++++---------- src/frontend/src/modals/chatModal/index.tsx | 43 ++++++++----- 2 files changed, 65 insertions(+), 46 deletions(-) diff --git a/src/frontend/src/contexts/tabsContext.tsx b/src/frontend/src/contexts/tabsContext.tsx index db122ebb2..51f754902 100644 --- a/src/frontend/src/contexts/tabsContext.tsx +++ b/src/frontend/src/contexts/tabsContext.tsx @@ -38,7 +38,7 @@ export function TabsProvider({ children }: { children: ReactNode }) { const { setNoticeData } = useContext(alertContext); const [tabIndex, setTabIndex] = useState(0); const [flows, setFlows] = useState>([]); - const [id, setId] = useState(""); + const [id, setId] = useState(uuidv4()); const { templates } = useContext(typesContext); const newNodeId = useRef(0); @@ -47,46 +47,50 @@ export function TabsProvider({ children }: { children: ReactNode }) { return newNodeId.current; } function save() { - if (flows.length !== 0) - window.localStorage.setItem( - "tabsData", - JSON.stringify({ tabIndex, flows, id, nodeId: newNodeId.current }) - ); + //disabled until flows can be saved on local storage again without bugs + // if (flows.length !== 0) + // window.localStorage.setItem( + // "tabsData", + // JSON.stringify({ tabIndex, flows, id, nodeId: newNodeId.current }) + // ); } useEffect(() => { + //disabled until flows can be saved on local storage again without bugs //save tabs locally - save(); + // save(); + }, [flows, id, tabIndex, newNodeId]); - useEffect(() => { - //get tabs locally saved - let cookie = window.localStorage.getItem("tabsData"); - if (cookie && Object.keys(templates).length > 0) { - let cookieObject: LangFlowState = JSON.parse(cookie); - cookieObject.flows.forEach((flow) => { - flow.data.nodes.forEach((node) => { - if (Object.keys(templates[node.data.type]["template"]).length > 0) { - node.data.node.template = updateTemplate( - templates[node.data.type][ - "template" - ] as unknown as APITemplateType, + // useEffect(() => { + // //get tabs locally saved + // let cookie = window.localStorage.getItem("tabsData"); + // if (cookie && Object.keys(templates).length > 0) { + // let cookieObject: LangFlowState = JSON.parse(cookie); + // cookieObject.flows.forEach((flow) => { + // flow.data.nodes.forEach((node) => { + // if (Object.keys(templates[node.data.type]["template"]).length > 0) { + // node.data.node.template = updateTemplate( + // templates[node.data.type][ + // "template" + // ] as unknown as APITemplateType, + + // node.data.node.template as APITemplateType + // ); + // } + // }); + // }); + // setTabIndex(cookieObject.tabIndex); + // setFlows(cookieObject.flows); + // setId(cookieObject.id); + // newNodeId.current = cookieObject.nodeId; + // } + // }, [templates]); - node.data.node.template as APITemplateType - ); - } - }); - }); - setTabIndex(cookieObject.tabIndex); - setFlows(cookieObject.flows); - setId(cookieObject.id); - newNodeId.current = cookieObject.nodeId; - } - }, [templates]); function hardReset() { newNodeId.current = 0; setTabIndex(0); setFlows([]); - setId(""); + setId(uuidv4()); } /** @@ -182,7 +186,7 @@ export function TabsProvider({ children }: { children: ReactNode }) { let newFlow: FlowType = { description, name: flow?.name ?? "New Flow", - id: id.toString(), + id: uuidv4(), data, }; diff --git a/src/frontend/src/modals/chatModal/index.tsx b/src/frontend/src/modals/chatModal/index.tsx index 51fd054ec..379a42f88 100644 --- a/src/frontend/src/modals/chatModal/index.tsx +++ b/src/frontend/src/modals/chatModal/index.tsx @@ -30,10 +30,16 @@ export default function ChatModal({ const ws = useRef(null); const [lockChat, setLockChat] = useState(false); const isOpen = useRef(open); + const id = useRef(flow.id); useEffect(() => { isOpen.current = open; }, [open]); + useEffect(() => { + id.current = flow.id; + },[flow.id]) + + var isStream = false; const addChatHistory = ( @@ -164,10 +170,9 @@ export default function ChatModal({ try { const urlWs = process.env.NODE_ENV === "development" - ? `ws://localhost:7860/chat/${flow.id}` + ? `ws://localhost:7860/chat/${id.current}` : `${window.location.protocol === "https:" ? "wss" : "ws"}://${window.location.host - }/chat/${flow.id}`; - + }/chat/${id.current}`; const newWs = new WebSocket(urlWs); newWs.onopen = () => { console.log("WebSocket connection established!"); @@ -184,6 +189,26 @@ export default function ChatModal({ }; newWs.onerror = (ev) => { console.log(ev, "error"); + if(flow.id===""){ + connectWS(); + } + else{ + setErrorData({ + title: "There was an error on web connection, please: ", + list: [ + "Refresh the page", + "Use a new flow tab", + "Check if the backend is up", + ], + }); + } + }; + ws.current = newWs; + } catch { + if(flow.id===""){ + connectWS(); + } + else{ setErrorData({ title: "There was an error on web connection, please: ", list: [ @@ -192,17 +217,7 @@ export default function ChatModal({ "Check if the backend is up", ], }); - }; - ws.current = newWs; - } catch { - setErrorData({ - title: "There was an error on web connection, please: ", - list: [ - "Refresh the page", - "Use a new flow tab", - "Check if the backend is up", - ], - }); + } } }