live message! (limit:1)

app/backend/InputOutputHandler.tsx

@@ -6,12 +6,20 @@ import axios from "axios";
 import { log } from 'console';
 
 const InputOutputBackend: React.FC = () => {
+  type Message = {
+    role: string
+    content:string
+  }
+
   const [accessToken, setAccessToken] = useState("")
   const postWorkerRef = useRef<Worker| null>(null)
   const getWorkerRef = useRef<Worker | null>(null)
-  const [messages, setMessages] = useState([{role:"assistant", content:"Hello! How can I help you?"}])
+  const [messages, setMessages] = useState<Message[]>([{role:"assistant", content:"Hello! How can I help you?"}])
   const [liveMessage, setLiveMessage] = useState("")
 
+  console.log(messages);
+  
+
   useEffect(() => {
     console.log("getting access");
     axios.get("http://localhost:5000/interstellar/api/ai_create")
@@ -56,6 +64,7 @@ const InputOutputBackend: React.FC = () => {
   
       getWorkerRef.current.postMessage({ action: "start", access_token:accessToken})
   
+      addMessage("assistant","")
       getWorkerRef.current.onmessage = (event) => {
         const data = event.data
         
@@ -63,7 +72,7 @@ const InputOutputBackend: React.FC = () => {
           setLiveMessage("error getting AI response: "+ data.error)
         } else {
           console.log("Received data:", data);
-          setLiveMessage(data)
+          editLastMessage(data.response)
         }
       }
 
@@ -75,13 +84,27 @@ const InputOutputBackend: React.FC = () => {
 
   const endGetWorker = () => {
     if (getWorkerRef.current) {
-      addMessage("assistant", liveMessage)
       getWorkerRef.current.postMessage({action:"terminate"})
       getWorkerRef.current.terminate()
       console.log(messages);
     }
   }
 
+  const editLastMessage = (newContent: string) => {
+  setMessages((prevMessages) => {
+    const updatedMessages = prevMessages.slice(); // Create a shallow copy of the current messages
+    if (updatedMessages.length > 0) {
+      const lastMessage = updatedMessages[updatedMessages.length - 1];
+      updatedMessages[updatedMessages.length - 1] = {
+        ...lastMessage, // Keep the existing role and other properties
+        content: newContent, // Update only the content
+      };
+    }
+    return updatedMessages; // Return the updated array
+  });
+};
+
+
   const addMessage = (role: string, content: string) => {
     setMessages(previous => [...previous,{role,content}])
   }  
@@ -89,7 +112,7 @@ const InputOutputBackend: React.FC = () => {
     if (postWorkerRef.current) {
       addMessage("user", inputValue)
       console.log("input:",inputValue);
-      postWorkerRef.current.postMessage({messages:messages, ai_model:"phi3.5", access_token:accessToken})
+      postWorkerRef.current.postMessage({messages:[...messages, { role: "user", content: inputValue }], ai_model:"phi3.5", access_token:accessToken})
       startGetWorker()
     }
   }

app/backend/threads/GetWorker.js

@@ -1,23 +1,23 @@
 import axios from "axios";
 
-let shouldRun = false
+let accesstoken
 onmessage = (event) => {
     const { action, access_token } = event.data
+    accesstoken=access_token
+    
     if (action === "start") {
-        shouldRun = true
+        fetchData()
-        fetchData(access_token)
     } else if (action === "terminate") {
-        shouldRun = false
     }
 }
 
 console.log('starting get loop');
 
-const fetchData = (access_token) => {
+const fetchData = () => {
-    if (!shouldRun) return
+    console.log(accesstoken);
     
     
-    const apiURL = "http://localhost:5000/interstellar/api/ai_get?access_token="+access_token
+    const apiURL = "http://localhost:5000/interstellar/api/ai_get?access_token="+accesstoken
     
     axios.get(apiURL)
         .then(response => {

app/backend/threads/PostWorker.js

@@ -2,16 +2,17 @@ import axios from "axios";
 
 onmessage = (e) => {
     const { messages = [{ role: "assistant", content: "Hello! How can I help you?" }], ai_model = "phi3.5", access_token } = e.data
-
+    messages.unshift({ role: "system", content: "You are a Helpful assistant" })
-    const promptedMessage = messages.unshift({role:"system", content:"You are a Helpful assistant"})
 
     const Message = {
-        messages: promptedMessage,
+        messages: messages,
         ai_model: "phi3.5",
         model_type:"local",
         access_token:access_token
     }
 
+    console.log(Message);
+    
 
     axios.post("http://localhost:5000/interstellar/api/ai_send",Message)
         .then(response => {