From ea20a5cfda7472ff93e28d09e5df5a8606c3eebb Mon Sep 17 00:00:00 2001
From: retoor <retoor@molodetz.nl>
Date: Thu, 12 Jun 2025 19:59:37 +0000
Subject: [PATCH] feat: enable file upload button and add debug logging for
 WebSocket attachment transfer

Uncomment click handler in ChatInputComponent to trigger file dialog, add console.info statements in FileUploadGrid for file upload lifecycle events, comment out redundant click listener in UploadButtonElement, and add print debugging in ChannelAttachmentUploadView for binary/text WebSocket messages with async file.tell() call.
---
 src/snek/static/chat-input.js       | 4 ++--
 src/snek/static/file-upload-grid.js | 7 ++++---
 src/snek/static/upload-button.js    | 4 ++--
 src/snek/view/channel.py            | 9 +++++++--
 4 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/src/snek/static/chat-input.js b/src/snek/static/chat-input.js
index 0800f614..90f3979c 100644
--- a/src/snek/static/chat-input.js
+++ b/src/snek/static/chat-input.js
@@ -181,8 +181,8 @@ class ChatInputComponent extends NjetComponent {
       this.dispatchEvent(new CustomEvent("uploaded", e));
     });
     this.uploadButton.addEventListener("click", (e) => {
-    //    e.preventDefault();
-      //  this.fileUploadGrid.openFileDialog()
+        e.preventDefault();
+        this.fileUploadGrid.openFileDialog()
 
     })
     this.subscribe("file-uploading", (e) => {
diff --git a/src/snek/static/file-upload-grid.js b/src/snek/static/file-upload-grid.js
index 3aae7ba1..0a623f62 100644
--- a/src/snek/static/file-upload-grid.js
+++ b/src/snek/static/file-upload-grid.js
@@ -130,7 +130,8 @@ class FileUploadGrid extends NjetComponent {
     startUpload(file, tile, progress) {
 
         this.publish('file-uploading', {file: file, tile: tile, progress: progress});
-        
+        console.info("File uploading",file)
+
         const protocol = location.protocol === "https:" ? "wss://" : "ws://";
         const ws = new WebSocket(`${protocol}${location.host}/channel/${this.channelUid}/attachment.sock`);
             ws.binaryType = 'arraybuffer';
@@ -148,7 +149,7 @@ class FileUploadGrid extends NjetComponent {
         };
 
         ws.onmessage = (event) => {
-
+            cconsole.info(event.data)
 
             const data = JSON.parse(event.data);
             if (data.type === 'progress') {
@@ -161,7 +162,7 @@ class FileUploadGrid extends NjetComponent {
                 this.publish('file-uploaded', {file: file, tile: tile, progress: progress});
                 progress.style.width = '100%';
                 tile.classList.add('fug-done');
-
+                console.info("Closed")
                 ws.close();
 
                 this.reset()
diff --git a/src/snek/static/upload-button.js b/src/snek/static/upload-button.js
index 243fc8b4..a789c964 100644
--- a/src/snek/static/upload-button.js
+++ b/src/snek/static/upload-button.js
@@ -112,9 +112,9 @@ class UploadButtonElement extends HTMLElement {
     this.channelUid = this.getAttribute("channel");
     this.uploadButton = this.container.querySelector(".upload-button");
     this.fileInput = this.container.querySelector(".hidden-input");
-    this.uploadButton.addEventListener("click", () => {
+    /*this.uploadButton.addEventListener("click", () => {
       this.fileInput.click();
-    });
+    });*/
     this.fileInput.addEventListener("change", () => {
       this.uploadFiles();
     });
diff --git a/src/snek/view/channel.py b/src/snek/view/channel.py
index 0ed975d8..604725ae 100644
--- a/src/snek/view/channel.py
+++ b/src/snek/view/channel.py
@@ -192,13 +192,18 @@ class ChannelAttachmentUploadView(BaseView):
             channel_uid=channel_uid, name=filename, user_uid=user_uid
         )
         pathlib.Path(attachment["path"]).parent.mkdir(parents=True, exist_ok=True)
-        async with aiofiles.open(attachment["path"], "wb") as f:
+        
+        async with aiofiles.open(attachment["path"], "wb") as file:
+            print("File openend.", filename)
             async for msg in ws:
                 if msg.type == web.WSMsgType.BINARY:
+                    print("Binary",filename)
                     if file is not None:
                         await file.write(msg.data)
-                        await ws.send_json({"type": "progress", "filename": filename, "bytes": file.tell()})
+                        await ws.send_json({"type": "progress", "filename": filename, "bytes": await file.tell()})
                 elif msg.type == web.WSMsgType.TEXT:
+                    print("TExt",filename)
+                    print(msg.json())
                     data = msg.json()                   
                     if data.get('type') == 'end':
                         await ws.send_json({"type": "done", "filename": filename})