Update static/application.js

static/application.js

@@ -237,7 +237,7 @@ document.head.appendChild(style);
  
 });
 */
-document.addEventListener("DOMContentLoaded", () => {
+document.addEventListener("DOMContentLoaded", () => { 
   const convo = document.querySelector(".convo");
   const input = document.querySelector(".qt input");
   const sendBtn = document.querySelector(".sendingQA");
@@ -300,7 +300,20 @@ document.addEventListener("DOMContentLoaded", () => {
 
     filePreviewBubble = document.createElement("div");
     filePreviewBubble.className = "file-preview-bubble bubble right";
-    filePreviewBubble.textContent = `${type === "document" ? "📎" : "🖼️"} Selected: ${file.name}`;
+
+    if (type === "document") {
+      filePreviewBubble.textContent = `📎 Selected: ${file.name}`;
+    } else if (type === "image") {
+      const img = document.createElement("img");
+      img.src = URL.createObjectURL(file);
+      img.alt = "Selected Image";
+      img.style.maxWidth = "200px"; // Adjust the size of the image as needed
+      img.style.maxHeight = "200px"; // Adjust the size of the image as needed
+      img.style.borderRadius = "8px"; // Optional, for rounded corners
+      filePreviewBubble.appendChild(img);
+      filePreviewBubble.appendChild(document.createTextNode(` Selected: ${file.name}`));
+    }
+
     convo.appendChild(filePreviewBubble);
     convo.scrollTop = convo.scrollHeight;
   }