[EVAL] API key from Env Var support

[daniel-lxs]

🧪 Evaluation PR for Testing

This is an automated test PR created for evaluation purposes.

---

Related GitHub Issue

Closes: #4337

Description

This PR adds support for obtaining API keys from the environment. A checkbox is added to each configuration that allows inputting an API key -- when checked, a given environment variable (eg, OPENAI_API_KEY, etc) is consulted for the key and the user is not required to provide one in the configuration. Env Var key is predictable but not editable.

Test Procedure

I tested this using VS Code run configurations, where the expected environment variable could be provided or omitted.

Pre-Submission Checklist

• Issue Linked: This PR is linked to an approved GitHub Issue (see "Related GitHub Issue" above).
• Scope: My changes are focused on the linked issue (one major feature/fix per PR).
• Self-Review: I have performed a thorough self-review of my code.
• Testing: New and/or updated tests have been added to cover my changes (if applicable).
• Documentation Impact: I have considered if my changes require documentation updates (see "Documentation Updates" section below).

A documentation update is advised, to describe environment variable usage to supply API keys.

• Contribution Guidelines: I have read and agree to the Contributor Guidelines.

Summary

Adds support for using environment variables for API keys across multiple providers, updates UI components to reflect this, and enhances testing and translation capabilities.

• Behavior:
  • Adds support for API keys from environment variables for providers like anthropic, glama, openrouter, openai, gemini, mistral, deepseek, unbound, requesty, xai, groq, chutes, litellm.
  • Updates validateModelsAndKeysProvided() to check for environment variable usage for API keys.
• UI Components:
  • Introduces ApiKey component to handle API key input and environment variable toggle.
  • Updates various provider components to use the new ApiKey component.
• Testing:
  • Adds comprehensive tests for environment variable integration and the ApiKey component.

[roo-code-dan]

The validation updates for env var support are incomplete. While this PR correctly updates validation for openrouter, glama, unbound, requesty, litellm, anthropic, gemini, openai-native, mistral, and openai, it's missing updates for several other providers that now support env vars:

• cerebras (line 131-135)
• fireworks (line 136-140)
• io-intelligence (line 141-145)
• featherless (line 146-150)
• vercel-ai-gateway (line 155-159)
• huggingface (line 123-130)
• deepinfra (not in validation at all)
• doubao (not in validation at all)
• moonshot (not in validation at all)
• zai (not in validation at all)
• sambanova (not in validation at all)

These providers all have ConfigUseEnvVars flags added in the schema and are used in buildApiHandler, but their validation logic still only checks for the direct API key. This creates an inconsistency where users could enable env var mode but the validation would still fail.

[roo-code-dan]

Typo in constant name: MOONSHOOT should be MOONSHOT (missing 'T'). This typo is then propagated to the usage in buildApiHandler at line 165.

Suggested change

	MOONSHOOT: 'MOONSHOT_API_KEY',
	MOONSHOT: 'MOONSHOT_API_KEY',

[roo-code-dan]

This references the typo MOONSHOOT from constants.ts (line 25). Should be API_KEYS.MOONSHOT to match the corrected constant name.

Suggested change

	options.moonshotApiKey = getEnvVar(API_KEYS.MOONSHOOT, options.moonshotApiKey)
	options.moonshotApiKey = getEnvVar(API_KEYS.MOONSHOT, options.moonshotApiKey)

[roo-code-dan]

The test file is missing a mock for NativeOllamaHandler which is used in buildApiHandler at line 138. This will cause the test to fail when it tries to import the actual handler.

Suggested change

	OllamaHandler: vi.fn().mockImplementation((options) => ({ provider: "ollama", options })),
	OllamaHandler: vi.fn().mockImplementation((options) => ({ provider: "ollama", options })),
	NativeOllamaHandler: vi.fn().mockImplementation((options) => ({ provider: "ollama", options })),

[roo-code-dan]

The useEnvVar state is initialized from props but doesn't update when configUseEnvVars or apiKeyEnvVarExists change. If the environment variable becomes available after component mount (e.g., user sets it and reloads settings), or if configUseEnvVars changes externally, the checkbox state won't reflect the change. Consider using useEffect to sync state with props:

Suggested change

	const envVarExists = (window as any).ENV_VAR_EXISTS || {}
	const apiKeyEnvVarExists = !!envVarExists[apiKeyEnvVar]
	const [useEnvVar, setUseEnvVar] = useState(configUseEnvVars && apiKeyEnvVarExists)
	const envVarExists = (window as any).ENV_VAR_EXISTS || {}
	const apiKeyEnvVarExists = !!envVarExists[apiKeyEnvVar]
	const [useEnvVar, setUseEnvVar] = useState(configUseEnvVars && apiKeyEnvVarExists)
	useEffect(() => {
	setUseEnvVar(configUseEnvVars && apiKeyEnvVarExists)
	}, [configUseEnvVars, apiKeyEnvVarExists])

[roo-code-dan]

Trailing whitespace after the comma. This should be removed for consistency with the rest of the file.

Suggested change

	huggingFaceConfigUseEnvVars: z.boolean().optional(),
	huggingFaceConfigUseEnvVars: z.boolean().optional(),

[roo-code-dan]

Trailing whitespace after the comma. This should be removed for consistency.

Suggested change

	sambaNovaConfigUseEnvVars: z.boolean().optional(),
	sambaNovaConfigUseEnvVars: z.boolean().optional(),

[roo-code-dan]

Trailing whitespace after the comma. This should be removed for consistency.

Suggested change

	featherlessConfigUseEnvVars: z.boolean().optional(),
	featherlessConfigUseEnvVars: z.boolean().optional(),

[roo-code-dan]

Security concern: This logs the names of environment variables that exist to the console. While it doesn't log the actual values, revealing which API keys are configured could be considered an information disclosure issue in shared development environments or when console logs are captured. Consider removing this logging or making it debug-only:

Suggested change

	API_KEY_ENV_VAR_NAMES.forEach((envVar) => {
	const exists = !!process.env[envVar]
	result[envVar] = exists
	if (exists) {
	console.log(`[ClineProvider] Found environment variable: ${envVar}`)
	}
	})
	return result
	API_KEY_ENV_VAR_NAMES.forEach((envVar) => {
	const exists = !!process.env[envVar]
	result[envVar] = exists
	})