Update public/chat.html

public/chat.html

@@ -148,6 +148,44 @@
             }
         });
 
+      sendImageButton.addEventListener('click', () => {
+    imageInput.click(); // Open file picker when the camera button is clicked
+});
+
+imageInput.addEventListener('change', async () => {
+    const file = imageInput.files[0];
+    if (!file) return;
+
+    const formData = new FormData();
+    formData.append('image', file); // Append the selected image
+    formData.append('jid', jid); // Add recipient JID
+    formData.append('caption', messageInput.value.trim()); // Optional caption
+
+    try {
+        const res = await fetch('/upload-image', {
+            method: 'POST',
+            headers: {
+                Authorization: `Bearer ${userKey}`, // Include user key for authentication
+            },
+            body: formData,
+        });
+
+        if (res.ok) {
+            imageInput.value = ''; // Clear file input
+            messageInput.value = ''; // Clear caption input
+            replyTo = null;
+            replyPreview.style.display = 'none';
+        } else {
+            const errorText = await res.text();
+            console.error('Failed to send image:', errorText);
+            alert(`Error: ${errorText}`);
+        }
+    } catch (error) {
+        console.error('Failed to send image:', error);
+        alert('An error occurred while sending the image.');
+    }
+});
+
         // Check if the user is already verified
         if (userKey) {
             verifyKey(userKey).then((isValid) => {