Fix image generation UI: add image preview, serving endpoint, and proper error handling

- Fixed function name mismatch: generateImage() -> generateManualImage()
- Fixed status div ID mismatch in HTML
- Added /image/view/{filename} endpoint to serve generated images from ComfyUI output
- Implemented proper image preview with DOM element creation instead of innerHTML
- Added robust error handling with onload/onerror event handlers
- Added debug logging to image serving endpoint for troubleshooting
- Images now display directly in the Web UI after generation

bot/api.py

@@ -990,6 +990,49 @@ async def test_image_detection(req: dict):
     except Exception as e:
         return {"status": "error", "message": f"Error: {e}"}
 
+@app.get("/image/view/{filename}")
+async def view_generated_image(filename: str):
+    """Serve generated images from ComfyUI output directory"""
+    try:
+        print(f"🖼️ Image view request for: {filename}")
+        
+        # Try multiple possible paths for ComfyUI output
+        possible_paths = [
+            f"/app/ComfyUI/output/{filename}",
+            f"/home/koko210Serve/ComfyUI/output/{filename}",
+            f"./ComfyUI/output/{filename}",
+        ]
+        
+        image_path = None
+        for path in possible_paths:
+            if os.path.exists(path):
+                image_path = path
+                print(f"✅ Found image at: {path}")
+                break
+            else:
+                print(f"❌ Not found at: {path}")
+        
+        if not image_path:
+            print(f"❌ Image not found anywhere: {filename}")
+            return {"status": "error", "message": f"Image not found: {filename}"}
+        
+        # Determine content type based on file extension
+        ext = filename.lower().split('.')[-1]
+        content_type = "image/png"
+        if ext == "jpg" or ext == "jpeg":
+            content_type = "image/jpeg"
+        elif ext == "gif":
+            content_type = "image/gif"
+        elif ext == "webp":
+            content_type = "image/webp"
+        
+        print(f"📤 Serving image: {image_path} as {content_type}")
+        return FileResponse(image_path, media_type=content_type)
+        
+    except Exception as e:
+        print(f"❌ Error serving image: {e}")
+        return {"status": "error", "message": f"Error serving image: {e}"}
+
 @app.post("/servers/{guild_id}/autonomous/tweet")
 async def trigger_autonomous_tweet_for_server(guild_id: int):
     """Trigger autonomous tweet sharing for a specific server"""