Skip to content

Add image insertion functionality#19

Merged
a-bonus merged 1 commit intoa-bonus:mainfrom
robnewton:feature/image-insertion
Oct 12, 2025
Merged

Add image insertion functionality#19
a-bonus merged 1 commit intoa-bonus:mainfrom
robnewton:feature/image-insertion

Conversation

@robnewton
Copy link
Copy Markdown
Contributor

Add Image Insertion Functionality

This PR adds comprehensive image insertion capabilities to the Google Docs MCP server, enabling users to insert images into documents either from public URLs or by uploading local files.

🎯 Features Added

Two New MCP Tools

  1. insertImageFromUrl - Insert images from publicly accessible URLs

    • Direct insertion from any public HTTP/HTTPS image URL
    • Optional width/height customization (in points)
    • Validates URL format before insertion
  2. insertLocalImage - Upload local images and insert them

    • Uploads image to Google Drive (same folder as document by default)
    • Makes image publicly readable for document display
    • Supports multiple formats: .jpg, .jpeg, .png, .gif, .bmp, .webp, .svg
    • Returns Drive URL for reference

🛠️ Implementation Details

Helper Functions (src/googleDocsApiHelpers.ts)

  • insertInlineImage(): Core image insertion logic

    • Uses Google Docs API insertInlineImage request
    • Handles optional sizing parameters
    • Proper error handling and validation
  • uploadImageToDrive(): Local file upload handler

    • Auto-detects MIME type from file extension
    • Creates public read permissions
    • Returns webContentLink for insertion

Tool Integration (src/server.ts)

Both tools follow existing patterns:

  • Use DocumentIdParameter schema
  • Proper error handling with UserError
  • Comprehensive logging
  • Parameter validation with Zod schemas

📚 Documentation

Updated README.md with:

  • New "Images" section in Document Structure
  • Detailed "Image Insertion" section with usage examples
  • Parameter descriptions for both tools
  • Security note about public image permissions
  • Advanced usage examples

✅ Testing

  • ✅ TypeScript compilation successful
  • ✅ Server starts without errors
  • ✅ Tools properly registered with MCP
  • ✅ Follows existing codebase patterns
  • ✅ No breaking changes to existing functionality

💡 Usage Examples

From URL:

"Insert an image from https://example.com/logo.png at index 100 in document YOUR_DOC_ID with width 300 and height 200"

Local file:

"Upload and insert the image at /Users/myname/Pictures/chart.png at index 200 in document YOUR_DOC_ID"

🔒 Security Considerations

  • Images uploaded via insertLocalImage are made publicly readable (required for Google Docs to display them)
  • Images remain in user's Google Drive and can be managed separately
  • Uses existing OAuth scopes (no new permissions required)

📝 Notes

  • The Google Docs API requires images to be publicly accessible URLs
  • insertLocalImage handles the workflow automatically: upload → make public → insert
  • Default behavior uploads to same folder as target document for better organization

🤖 Generated with Claude Code

Co-Authored-By: Claude noreply@anthropic.com

This commit adds comprehensive image insertion capabilities with two new tools:

1. insertImageFromUrl: Inserts images from publicly accessible URLs
   - Supports custom width/height in points
   - Uses Google Docs API insertInlineImage request
   - Validates URL format before insertion

2. insertLocalImage: Uploads local images and inserts them
   - Uploads image to Google Drive (same folder as document by default)
   - Makes image publicly readable for document display
   - Supports .jpg, .jpeg, .png, .gif, .bmp, .webp, .svg formats
   - Automatically determines MIME type from file extension
   - Returns Drive URL for uploaded image

Helper functions added to googleDocsApiHelpers.ts:
- insertInlineImage(): Core image insertion logic
- uploadImageToDrive(): Handles local file upload and permissions

Documentation:
- Updated README.md with detailed usage examples
- Added Image Insertion section with both tool descriptions
- Updated feature list and advanced usage examples

The implementation follows the existing codebase patterns and uses
the established error handling mechanisms (UserError for client issues).

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
@a-bonus
Copy link
Copy Markdown
Owner

a-bonus commented Oct 12, 2025

Awesome, thank you!

@a-bonus a-bonus merged commit 72ba1dc into a-bonus:main Oct 12, 2025
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.

2 participants