Update frontend/app.js

frontend/app.js

@@ -1,6 +1,7 @@
-const API_BASE = ""; // empty uses same origin (recommended in Spaces)
+// Same-origin API calls
+const API_BASE = "";
 
-// Persist a session_id client-side to let backend track violations
+// Persist a session_id to let backend track violations
 function getSessionId() {
   let sid = localStorage.getItem("session_id");
   if (!sid) {
@@ -25,6 +26,12 @@ function disableInput(reason = "Input disabled.") {
   document.getElementById("status").textContent = reason;
 }
 
+function clearChat() {
+  const win = document.getElementById("chat-window");
+  win.innerHTML = "";
+  document.getElementById("status").textContent = "";
+}
+
 async function moderateText(text) {
   const sid = getSessionId();
   const res = await fetch(`${API_BASE}/moderate`, {
@@ -36,7 +43,7 @@ async function moderateText(text) {
     body: JSON.stringify({ text })
   });
   if (!res.ok) throw new Error(`Moderate failed: ${res.status}`);
-  return res.json(); // {allowed: boolean, banned: boolean, reason?: string, lock?: boolean}
+  return res.json(); // {allowed, banned, lock, reason?}
 }
 
 async function sendChat(text) {
@@ -50,10 +57,10 @@ async function sendChat(text) {
     body: JSON.stringify({ text })
   });
   if (!res.ok) throw new Error(`Chat failed: ${res.status}`);
-  return res.json(); // {reply: string}
+  return res.json(); // {reply}
 }
 
-document.getElementById("name-submit").addEventListener("click", async () => {
+function submitName() {
   const nameInput = document.getElementById("name-input");
   const name = (nameInput.value || "").trim();
   if (!name) return;
@@ -61,9 +68,9 @@ document.getElementById("name-submit").addEventListener("click", async () => {
   document.getElementById("chat-section").classList.remove("hidden");
   addMessage(`Welcome, ${name}!`, "bot");
   addMessage(name, "user"); // immediately show name in chat
-});
+}
 
-document.getElementById("send-btn").addEventListener("click", async () => {
+async function submitMessage() {
   const input = document.getElementById("chat-input");
   const text = (input.value || "").trim();
   if (!text) return;
@@ -84,4 +91,17 @@ document.getElementById("send-btn").addEventListener("click", async () => {
   } finally {
     input.value = "";
   }
+}
+
+// Wire up buttons and Enter key
+document.getElementById("name-submit").addEventListener("click", submitName);
+document.getElementById("name-input").addEventListener("keydown", (e) => {
+  if (e.key === "Enter") submitName();
 });
+
+document.getElementById("send-btn").addEventListener("click", submitMessage);
+document.getElementById("chat-input").addEventListener("keydown", (e) => {
+  if (e.key === "Enter") submitMessage();
+});
+
+document.getElementById("clear-btn").addEventListener("click", clearChat);