Update static/application.js

static/application.js

@@ -57,16 +57,16 @@ document.addEventListener("DOMContentLoaded", function () {
         return bubble;
     }
 
- function showFilePreview(filename, icon = "📎") {
-    if (filePreviewDiv) filePreviewDiv.remove();
+    function showFilePreview(filename, icon = "📎") {
+        if (filePreviewDiv) filePreviewDiv.remove();
 
-    filePreviewDiv = document.createElement("div");
-    filePreviewDiv.className = "file-preview";
-    filePreviewDiv.innerHTML = `${icon} <strong>Selected:</strong> ${filename}`;
+        filePreviewDiv = document.createElement("div");
+        filePreviewDiv.className = "file-preview-bubble";
+        filePreviewDiv.innerHTML = `${icon} <strong>Selected:</strong> ${filename}`;
 
-    const qtContainer = document.querySelector(".qt");
-    qtContainer.parentElement.insertBefore(filePreviewDiv, qtContainer); 
-}
+        convo.appendChild(filePreviewDiv);
+        scrollToBottom();
+    }
 
     sendBtn.addEventListener("click", async () => {
         const question = userInput.value.trim();
@@ -77,13 +77,10 @@ document.addEventListener("DOMContentLoaded", function () {
             return;
         }
 
-        // Remove preview
-        if (filePreviewDiv) filePreviewDiv.remove();
+        if (filePreviewDiv) filePreviewDiv.remove();  // Remove preview bubble
 
-        // Show user message + file
         createMessageBubble(question, "You", null, selectedFile.name);
 
-        // Show thinking placeholder
         const thinkingBubble = createMessageBubble("Chris is thinking...", "Chris");
 
         const formData = new FormData();
@@ -98,8 +95,8 @@ document.addEventListener("DOMContentLoaded", function () {
 
             const result = await response.json();
 
-            // Replace thinking bubble with actual answer
             thinkingBubble.querySelector(".text").innerText = result.answer || "No response received.";
+
             if (result.audio) {
                 const audio = document.createElement("audio");
                 audio.controls = true;
@@ -112,12 +109,11 @@ document.addEventListener("DOMContentLoaded", function () {
         } catch (err) {
             thinkingBubble.querySelector(".text").innerText = "⚠️ Chris had trouble connecting.";
         }
-        scrollToBottom();
+
         userInput.value = "";
         selectedFile = null;
     });
 
-    // File icon handlers
     imageIcon.addEventListener("click", () => {
         const input = document.createElement("input");
         input.type = "file";