Skip to content

Conversation

@ibetitsmike
Copy link
Contributor

When MCP tools like Chrome DevTools return images (e.g., screenshots), display them inline in the chat rather than just showing JSON.

Changes

  • Add ToolResultImages component to extract and display images from MCP tool results (transformed content format with type: media)
  • Update GenericToolCall to auto-expand and show images when present
  • Filter out base64 image data from JSON display (show [image data] placeholder)
  • Add tests for image extraction logic (6 tests)

How it works

MCP tools return images in this format after transformation:

{ type: "content", value: [{ type: "media", data: "base64...", mediaType: "image/png" }] }

The new component extracts these and renders them as clickable thumbnails that open the full image in a new tab.


Generated with mux • Model: claude-sonnet-4-20250514 • Thinking: low

When MCP tools like Chrome DevTools return images (e.g., screenshots),
display them inline in the chat rather than just showing JSON.

Changes:
- Add ToolResultImages component to extract and display images from
  MCP tool results (transformed content format with type: media)
- Update GenericToolCall to auto-expand and show images when present
- Filter out base64 image data from JSON display (show placeholder)
- Add tests for image extraction logic

---
_Generated with `mux` • Model: `anthropic:claude-opus-4-5` • Thinking: `high`_
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant