Update script.js

Author: zorginkopen

script.js

@@ -2,53 +2,42 @@ const chat = document.getElementById("chat");
 const form = document.getElementById("input-form");
 const input = document.getElementById("user-input");
 
+let threadId = null; // Slaat de thread_id lokaal op
+
 form.addEventListener("submit", async (e) => {
   e.preventDefault();
   const message = input.value.trim();
   if (!message) return;
 
-  appendMessage("user", message);
+  appendMessage("Gebruiker", message);
   input.value = "";
 
-  const agentMsg = appendMessage("assistant", "..."); // tijdelijk placeholder
   try {
     const response = await fetch("https://chatproxy.azurewebsites.net/api/chatproxy", {
       method: "POST",
       headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ message })
+      body: JSON.stringify({ message, thread_id: threadId })
     });
 
-    if (!response.ok || !response.body) {
-      agentMsg.textContent = "Er ging iets mis met het ophalen van het antwoord.";
-      return;
+    if (!response.ok) {
+      const errorText = await response.text();
+      console.error("Responsetekst:", errorText);
+      throw new Error(`Serverfout: ${response.status}`);
     }
 
-    const reader = response.body.getReader();
-    const decoder = new TextDecoder("utf-8");
-    let done = false;
-    let finalText = "";
-
-    while (!done) {
-      const { value, done: readerDone } = await reader.read();
-      done = readerDone;
-      if (value) {
-        const chunk = decoder.decode(value, { stream: true });
-        finalText += chunk;
-        agentMsg.textContent = finalText;
-        chat.scrollTop = chat.scrollHeight;
-      }
-    }
+    const data = await response.json();
+    appendMessage("Agent", data.reply);
+    threadId = data.thread_id; // Bewaar thread_id voor vervolgvragen
   } catch (err) {
-    agentMsg.textContent = "Er ging iets mis.";
+    appendMessage("Agent", "Er ging iets mis.");
     console.error("Fout in fetch:", err);
   }
 });
 
 function appendMessage(sender, text) {
   const msg = document.createElement("div");
-  msg.className = `message ${sender}-message`;
-  msg.textContent = text;
+  msg.classList.add("message", sender === "Gebruiker" ? "user-message" : "agent-message");
+  msg.innerHTML = `<div><strong>${sender}:</strong> ${text}</div>`;
   chat.appendChild(msg);
   chat.scrollTop = chat.scrollHeight;
-  return msg;
 }