Allow webviews to make OpenRouter API calls (#1778)

* Allow webviews to make OpenRouter API calls

* Update package-lock.json

package-lock.json

@@ -12577,6 +12577,7 @@
 			"resolved": "https://registry.npmjs.org/npm-run-all/-/npm-run-all-4.1.5.tgz",
 			"integrity": "sha512-Oo82gJDAVcaMdi3nuoKFavkIHBRVqQ1qvMb+9LHk/cF4P6B2m8aP04hGf7oL6wZ9BuGwX1onlLhpuoofSyoQDQ==",
 			"dev": true,
+			"license": "MIT",
 			"dependencies": {
 				"ansi-styles": "^3.2.1",
 				"chalk": "^2.4.1",

src/core/webview/ClineProvider.ts

@@ -571,12 +571,14 @@ export class ClineProvider extends EventEmitter<ClineProviderEvents> implements
 		}
 
 		const nonce = getNonce()
+
 		const stylesUri = getUri(webview, this.contextProxy.extensionUri, [
 			"webview-ui",
 			"build",
 			"assets",
 			"index.css",
 		])
+
 		const codiconsUri = getUri(webview, this.contextProxy.extensionUri, [
 			"node_modules",
 			"@vscode",
@@ -693,7 +695,7 @@ export class ClineProvider extends EventEmitter<ClineProviderEvents> implements
             <meta charset="utf-8">
             <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
             <meta name="theme-color" content="#000000">
-            <meta http-equiv="Content-Security-Policy" content="default-src 'none'; font-src ${webview.cspSource}; style-src ${webview.cspSource} 'unsafe-inline'; img-src ${webview.cspSource} data:; script-src 'nonce-${nonce}' https://us-assets.i.posthog.com; connect-src https://us.i.posthog.com https://us-assets.i.posthog.com;">
+            <meta http-equiv="Content-Security-Policy" content="default-src 'none'; font-src ${webview.cspSource}; style-src ${webview.cspSource} 'unsafe-inline'; img-src ${webview.cspSource} data:; script-src 'nonce-${nonce}' https://us-assets.i.posthog.com; connect-src https://openrouter.ai https://us.i.posthog.com https://us-assets.i.posthog.com;">
             <link rel="stylesheet" type="text/css" href="${stylesUri}">
 			<link href="${codiconsUri}" rel="stylesheet" />
             <title>Roo Code</title>

webview-ui/src/components/ui/hooks/useOpenRouterModelProviders.ts

@@ -14,15 +14,15 @@ const openRouterEndpointsSchema = z.object({
 		description: z.string().optional(),
 		architecture: z
 			.object({
-				modality: z.string().optional(),
-				tokenizer: z.string().optional(),
+				modality: z.string().nullish(),
+				tokenizer: z.string().nullish(),
 			})
-			.optional(),
+			.nullish(),
 		endpoints: z.array(
 			z.object({
 				name: z.string(),
 				context_length: z.number(),
-				max_completion_tokens: z.number().optional(),
+				max_completion_tokens: z.number().nullish(),
 				pricing: z
 					.object({
 						prompt: z.union([z.string(), z.number()]).optional(),
@@ -58,7 +58,7 @@ async function getOpenRouterProvidersForModel(modelId: string) {
 			const outputPrice = parseApiPrice(endpoint.pricing?.completion)
 
 			const modelInfo: OpenRouterModelProvider = {
-				maxTokens: endpoint.max_completion_tokens,
+				maxTokens: endpoint.max_completion_tokens || endpoint.context_length,
 				contextWindow: endpoint.context_length,
 				supportsImages: architecture?.modality?.includes("image"),
 				supportsPromptCache: false,