Merge pull request #57 from 10play/wait-for-image

Wait for image

Author: 17Amir17

widget/hooks/useWebSocketMessages.ts

@@ -259,8 +259,7 @@ export function useWebSocketMessages({ serverUrl, onGitMessage }: UseWebSocketMe
     currentPromptIdRef.current = null;
     setCurrentParts([]);
 
-    // Send prompt immediately with local file paths
-    // The server runs on the same machine and can read simulator temp files directly
+    // Upload images to the server first, then send the prompt with server-side paths
     const imagePaths = images && images.length > 0
       ? images.map((img) => img.uri)
       : undefined;

widget/services/websocket.ts

@@ -351,7 +351,7 @@ export class WebSocketClient {
     this.setStatus("disconnected");
   }
 
-  sendPrompt(content: string, imagePaths?: string[]): void {
+  async sendPrompt(content: string, imagePaths?: string[]): Promise<void> {
     if (!this.ws || this.ws.readyState !== WebSocket.OPEN) {
       this.options.onError(new Error("Not connected"));
       return;
@@ -364,13 +364,64 @@ export class WebSocketClient {
     };
 
     if (imagePaths && imagePaths.length > 0) {
-      message.imagePaths = imagePaths;
+      try {
+        console.log("[expo-air] Uploading", imagePaths.length, "image(s) to:", this.getUploadUrl());
+        const serverPaths = await this.uploadImages(imagePaths);
+        console.log("[expo-air] Upload returned paths:", serverPaths);
+        if (serverPaths.length > 0) {
+          message.imagePaths = serverPaths;
+        }
+      } catch (error) {
+        console.error("[expo-air] Image upload failed:", error);
+      }
     }
 
     this.ws.send(JSON.stringify(message));
     this.setStatus("sending");
   }
 
+  private getUploadUrl(): string {
+    let url = this.options.url;
+    // ws:// → http://, wss:// → https://
+    if (url.startsWith("wss://")) url = "https://" + url.slice(6);
+    else if (url.startsWith("ws://")) url = "http://" + url.slice(5);
+    // Insert /upload before the query string
+    const qIndex = url.indexOf("?");
+    if (qIndex >= 0) {
+      return url.slice(0, qIndex) + "/upload" + url.slice(qIndex);
+    }
+    return url + "/upload";
+  }
+
+  private async uploadImages(localPaths: string[]): Promise<string[]> {
+    const uploadUrl = this.getUploadUrl();
+
+    const formData = new FormData();
+    for (const path of localPaths) {
+      const uri = path.startsWith("file://") ? path : `file://${path}`;
+      const ext = path.split(".").pop()?.toLowerCase() || "jpg";
+      const mimeType = ext === "png" ? "image/png" : "image/jpeg";
+      formData.append("images", {
+        uri,
+        type: mimeType,
+        name: `image.${ext}`,
+      } as unknown as Blob);
+    }
+
+    const response = await fetch(uploadUrl, {
+      method: "POST",
+      body: formData,
+    });
+
+    if (!response.ok) {
+      const text = await response.text().catch(() => "");
+      throw new Error(`Upload failed: ${response.status} ${text}`);
+    }
+
+    const result = await response.json();
+    return result.paths || [];
+  }
+
   requestNewSession(): void {
     if (!this.ws || this.ws.readyState !== WebSocket.OPEN) {
       this.options.onError(new Error("Not connected"));