feat: Support images in tool responses

packages/opencode/src/session/index.ts

@@ -770,6 +770,22 @@ export namespace Session {
           return result
         },
         toModelOutput(result) {
+          if (result.metadata.type === "image") {
+            return {
+              type: 'content',
+              value: [
+                {
+                  type: 'text',
+                  text: `Image: ${result.title}`,
+                },
+                {
+                  type: 'media',
+                  data: result.output,
+                  mediaType: result.metadata.mediaType,
+                },
+              ],
+            }
+          }
           return {
             type: "text",
             value: result.output,
@@ -791,9 +807,37 @@ export namespace Session {
 
         return {
           output,
+          content: result.content,
         }
       }
       item.toModelOutput = (result) => {
+        // Check if there are any images in the content
+        const hasImages = result.content.some((item: any) => item.type === "image")
+        if (hasImages) {
+          // Preserve original order by processing sequentially
+          const contentItems = result.content.map((item: any) => {
+            if (item.type === "text") {
+              return {
+                type: "text" as const,
+                text: item.text,
+              }
+            }
+            if (item.type === "image") {
+              return {
+                type: "media" as const,
+                data: item.data,
+                mediaType: item.mimeType,
+              }
+            }
+            // Add support for other types if needed
+            return null;
+          }).filter(Boolean);
+          return {
+            type: "content",
+            value: contentItems,
+          }
+        }
+
         return {
           type: "text",
           value: result.output,

packages/opencode/src/tool/read.ts

@@ -52,7 +52,26 @@ export const ReadTool = Tool.define("read", {
     const limit = params.limit ?? DEFAULT_READ_LIMIT
     const offset = params.offset || 0
     const isImage = isImageFile(filepath)
-    if (isImage) throw new Error(`This is an image file of type: ${isImage}\nUse a different tool to process images`)
+    if (isImage) {
+      const buffer = await file.arrayBuffer()
+      const mimeType = getImageMimeType(isImage)
+      const uint8Array = new Uint8Array(buffer)
+      let binaryString = ''
+      for (let i = 0; i < uint8Array.length; i++) {
+        binaryString += String.fromCharCode(uint8Array[i])
+      }
+      const base64Data = btoa(binaryString)
+
+      return {
+        title: path.relative(App.info().path.root, filepath),
+        output: base64Data,
+        metadata: {
+          type: "image",
+          mediaType: mimeType,
+          preview: "[IMAGE]"
+        },
+      }
+    }
     const isBinary = await isBinaryFile(file)
     if (isBinary) throw new Error(`Cannot read binary file: ${filepath}`)
     const lines = await file.text().then((text) => text.split("\n"))
@@ -107,6 +126,25 @@ function isImageFile(filePath: string): string | false {
   }
 }
 
+function getImageMimeType(imageType: string): string {
+  switch (imageType) {
+    case "JPEG":
+      return "image/jpeg"
+    case "PNG":
+      return "image/png"
+    case "GIF":
+      return "image/gif"
+    case "BMP":
+      return "image/bmp"
+    case "SVG":
+      return "image/svg+xml"
+    case "WebP":
+      return "image/webp"
+    default:
+      return "application/octet-stream"
+  }
+}
+
 async function isBinaryFile(file: Bun.BunFile): Promise<boolean> {
   const buffer = await file.arrayBuffer()
   const bytes = new Uint8Array(buffer.slice(0, 512)) // Check first 512 bytes