app/AI.tsx

@@ -1,13 +1,11 @@
 // AI.tsx
 import React from 'react';
-import InputOutputBackend from './InputOutputHandler';
+import InputBackend from './InputBackend';
 
 const AI: React.FC = () => {
   return (
     <div>
-      <div className="ai-container">
+      <InputBackend />
-        <InputOutputBackend />
-      </div>
     </div>
   );
 };

app/ConversationFrontend.tsx

@@ -23,7 +23,7 @@ const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>
         <div className="conversation resize" id="conversation" ref={ref}>
           {messages.map((message, index) => {
             const isUserMessage = message.startsWith('User:');
-            console.log(messages)
+            console.log("output: "+messages)
             return (
               <div
                 key={index}

app/InputBackend.tsx

@@ -40,6 +40,7 @@ const InputBackend: React.FC = () => {
     if (chatResponse && chatResponse.choices && chatResponse.choices.length > 0) {
       if (chatResponse.choices[0].message.content) {
         addMessage('AI: ' + chatResponse.choices[0].message.content);
+        console.log(messages)
       }
     } else {
       console.error('Error: Unexpected API response:', chatResponse);

app/InputOutputHandler.tsx

@@ -1,109 +0,0 @@
-"use client"
-import React, { useEffect, useRef, useState } from "react";
-import ConversationFrontend from "./ConversationFrontend";
-import InputFrontend from "./InputFrontend";
-
-const handleMicClick = () => {
-  console.log('Mic clicked!');
-  // Do something when the mic button is clicked
-};
-
-
-const handleResendClick = () => {
-  console.log('Resend button clicked');
-  // Handle resend action
-};
-
-const handleEditClick = () => {
-  console.log('Edit button clicked');
-  // Handle edit action
-};
-
-const handleCopyClick = () => {
-  console.log('Copy button clicked');
-  // Handle copy action
-};
-
-const InputOutputBackend: React.FC = () => {
-    const [accessToken, setAccessToken] = useState("")
-    const workerRef = useRef<Worker | null>(null)
-
-    const handleSendClick = (message: string) => {
-        var system = "You give really short answers (maximum of 30 sentences). The following is the chat history."
-        for (let index = 0; index < messages.length; index++) {
-            system += messages[index] + " ";
-        };
-
-        HandlePostRequest(message, "phi3.5", system)
-
-        addMessage('User: ' + message);
-    };
-
-    const [messages, setMessages] = useState([
-        'User: Hello!',
-        'AI: Hi there!',
-        'User: How are you?',
-        'AI: I’m good, thank you!'
-    ]);
-
-    const addMessage = (message: string) => {
-        setMessages((prevMessages) => [...prevMessages, message]);
-    };
-
-
-    useEffect(() => {
-        workerRef.current = new Worker(new URL("./ProcessAPI.js", import.meta.url))
-        workerRef.current.postMessage({})
-        workerRef.current.onmessage = (e) => {
-            setAccessToken(e.data)
-        }
-        
-        return () => {
-            if (workerRef.current) {
-                workerRef.current.terminate()
-            }
-        }
-    },[])
-    
-    const HandleGetRequest = (message: string, ai_model: string, system_prompt: string) => {
-        if (workerRef.current) {
-            workerRef.current.postMessage({ functionName: "getResponse", access_token: accessToken, message: message, ai_model: ai_model, system_prompt: system_prompt })
-            workerRef.current.onmessage = (e) => {
-                addMessage("AI: " + e.data)
-            }
-        }
-    }
-
-    const HandlePostRequest = (message: string, ai_model: string, system_prompt: string) => {
-        if (workerRef.current) {
-            workerRef.current.postMessage({ functionName: "postRequest", access_token: accessToken, message: message, ai_model: ai_model, system_prompt: system_prompt })
-            workerRef.current.onmessage = (e) => {
-                HandleGetRequest(message,ai_model,system_prompt)
-            }
-        }
-    }
-    
-    return (
-    <div>
-      <ConversationFrontend
-        messages={messages}
-        onResendClick={handleResendClick}
-        onEditClick={handleEditClick}
-        onCopyClick={handleCopyClick}
-      />
-      <InputFrontend
-        message=""
-        onSendClick={handleSendClick}
-        onMicClick={handleMicClick}
-      />
-    </div>
-  );
-}
-
-export default InputOutputBackend
-
-
-
-
-
- 

app/ProcessAPI.js

@@ -1,39 +0,0 @@
-import axios from 'axios'
-
-onmessage = function (e) {
-    const { functionName = "getAccess", access_token = "", message = "", ai_model = "phi3.5", system_prompt = "You are a helpful assistant" } = e.data
-    const data = {
-        "ai_model": ai_model,
-        "message": message,
-        "system_prompt": system_prompt,
-        "access_token": access_token
-    };
-    switch (functionName) {
-        case "getAccess":
-            axios.get('https://localhost:5000/interstellar/api/ai_create')
-                .then(Response => {
-                postMessage(Response.data.access_token)
-            }).catch(error => {
-            console.error("Error with GET Token request:", error)
-            })
-            break
-        case "postRequest":
-            axios.post('https://localhost:5000/interstellar/api/ai_send', data)
-                .then(Response => {
-                    postMessage(Response.data)
-                }).catch(error => {
-                console.error("Error:", error)
-                })
-            break
-        case "getResponse":
-            axios.get('https://localhost:5000/interstellar/api/ai_get?access_token='+access_token)
-            .then(Response => {
-                postMessage(Response.data.response)
-            }).catch(error => {
-            console.error("Error with GET response request:", error)
-            })
-            break
-    }
-    
-    
-}

app/ProcessAPI.tsx

@@ -0,0 +1,2 @@
+import React from "react";
+import axios from 'axios';

app/ProcessMemory.tsx

@@ -1,13 +0,0 @@
-import React from 'react'
-
-type Chat = {
-    name:string
-    messages:string[]
-}
-
-type History = {
-    chats:Chat[]
-}
-
-
-