feat: add Google Gemini 3 Pro Image Preview to image generation models (#9440)

Co-authored-by: Roo Code <[email protected]>
Co-authored-by: Matt Rubens <[email protected]>

packages/types/src/image-generation.ts

@@ -0,0 +1,20 @@
+/**
+ * Image generation model constants
+ */
+
+export interface ImageGenerationModel {
+	value: string
+	label: string
+}
+
+export const IMAGE_GENERATION_MODELS: ImageGenerationModel[] = [
+	{ value: "google/gemini-2.5-flash-image", label: "Gemini 2.5 Flash Image" },
+	{ value: "google/gemini-3-pro-image-preview", label: "Gemini 3 Pro Image Preview" },
+	{ value: "openai/gpt-5-image", label: "GPT-5 Image" },
+	{ value: "openai/gpt-5-image-mini", label: "GPT-5 Image Mini" },
+]
+
+/**
+ * Get array of model values only (for backend validation)
+ */
+export const IMAGE_GENERATION_MODEL_IDS = IMAGE_GENERATION_MODELS.map((m) => m.value)

packages/types/src/index.ts

@@ -7,6 +7,7 @@ export * from "./experiment.js"
 export * from "./followup.js"
 export * from "./global-settings.js"
 export * from "./history.js"
+export * from "./image-generation.js"
 export * from "./ipc.js"
 export * from "./marketplace.js"
 export * from "./mcp.js"

src/core/tools/GenerateImageTool.ts

@@ -1,7 +1,7 @@
 import path from "path"
 import fs from "fs/promises"
 import * as vscode from "vscode"
-import type { GenerateImageParams } from "@roo-code/types"
+import { GenerateImageParams, IMAGE_GENERATION_MODEL_IDS } from "@roo-code/types"
 import { Task } from "../task/Task"
 import { formatResponse } from "../prompts/responses"
 import { fileExistsAtPath } from "../../utils/fs"
@@ -12,8 +12,6 @@ import { OpenRouterHandler } from "../../api/providers/openrouter"
 import { BaseTool, ToolCallbacks } from "./BaseTool"
 import type { ToolUse } from "../../shared/tools"
 
-const IMAGE_GENERATION_MODELS = ["google/gemini-2.5-flash-image", "openai/gpt-5-image", "openai/gpt-5-image-mini"]
-
 export class GenerateImageTool extends BaseTool<"generate_image"> {
 	readonly name = "generate_image" as const
 
@@ -137,7 +135,7 @@ export class GenerateImageTool extends BaseTool<"generate_image"> {
 			return
 		}
 
-		const selectedModel = state?.openRouterImageGenerationSelectedModel || IMAGE_GENERATION_MODELS[0]
+		const selectedModel = state?.openRouterImageGenerationSelectedModel || IMAGE_GENERATION_MODEL_IDS[0]
 
 		const fullPath = path.resolve(task.cwd, removeClosingTag("path", relPath))
 		const isOutsideWorkspace = isPathOutsideWorkspace(fullPath)

webview-ui/src/components/settings/ImageGenerationSettings.tsx

@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from "react"
 import { VSCodeCheckbox, VSCodeTextField, VSCodeDropdown, VSCodeOption } from "@vscode/webview-ui-toolkit/react"
+import { IMAGE_GENERATION_MODELS } from "@roo-code/types"
 import { useAppTranslation } from "@/i18n/TranslationContext"
 
 interface ImageGenerationSettingsProps {
@@ -11,14 +12,6 @@ interface ImageGenerationSettingsProps {
 	setImageGenerationSelectedModel: (model: string) => void
 }
 
-// Hardcoded list of image generation models
-const IMAGE_GENERATION_MODELS = [
-	{ value: "google/gemini-2.5-flash-image", label: "Gemini 2.5 Flash Image" },
-	{ value: "openai/gpt-5-image", label: "GPT-5 Image" },
-	{ value: "openai/gpt-5-image-mini", label: "GPT-5 Image Mini" },
-	// Add more models as they become available
-]
-
 export const ImageGenerationSettings = ({
 	enabled,
 	onChange,