Add new models

2025-12-20 04:11:10 -05:00 · 2024-08-11 02:32:54 -04:00
parent f54774b943
commit 3c082e753b
3 changed files with 159 additions and 22 deletions
--- a/src/shared/api.ts
+++ b/src/shared/api.ts
@@ -25,9 +25,9 @@ export interface ModelInfo {
 export type ApiModelId = AnthropicModelId | OpenRouterModelId | BedrockModelId

 // Anthropic
+// https://docs.anthropic.com/en/docs/about-claude/models
 export type AnthropicModelId = keyof typeof anthropicModels
 export const anthropicDefaultModelId: AnthropicModelId = "claude-3-5-sonnet-20240620"
-// https://docs.anthropic.com/en/docs/about-claude/models
 export const anthropicModels = {
 	"claude-3-5-sonnet-20240620": {
 		maxTokens: 8192,
@@ -44,30 +44,19 @@ export const anthropicModels = {
 	"claude-3-sonnet-20240229": {
 		maxTokens: 4096,
 		supportsImages: true,
-		inputPrice: 2.5,
-		outputPrice: 12.5,
+		inputPrice: 3.0,
+		outputPrice: 15.0,
 	},
 	"claude-3-haiku-20240307": {
 		maxTokens: 4096,
 		supportsImages: true,
-		inputPrice: 2.5,
-		outputPrice: 12.5,
+		inputPrice: 0.25,
+		outputPrice: 1.25,
 	},
-} as const satisfies Record<string, ModelInfo>
-
-// OpenRouter
-export type OpenRouterModelId = keyof typeof openRouterModels
-export const openRouterDefaultModelId: OpenRouterModelId = "anthropic/claude-3.5-sonnet:beta"
-export const openRouterModels = {
-	"anthropic/claude-3.5-sonnet:beta": {
-		maxTokens: 4096,
-		supportsImages: true,
-		inputPrice: 3.0,
-		outputPrice: 15.0,
-	},
-} as const satisfies Record<string, ModelInfo>
+} as const satisfies Record<string, ModelInfo> // as const assertion makes the object deeply readonly

 // AWS Bedrock
+// https://docs.aws.amazon.com/bedrock/latest/userguide/conversation-inference.html
 export type BedrockModelId = keyof typeof bedrockModels
 export const bedrockDefaultModelId: BedrockModelId = "anthropic.claude-3-5-sonnet-20240620-v1:0"
 export const bedrockModels = {
@@ -77,4 +66,143 @@ export const bedrockModels = {
 		inputPrice: 3.0,
 		outputPrice: 15.0,
 	},
-} as const satisfies Record<string, ModelInfo> // as const assertion makes the object deeply readonly (just declaring it as const makes it mutable)
+	"anthropic.claude-3-opus-20240229-v1:0": {
+		maxTokens: 4096,
+		supportsImages: true,
+		inputPrice: 15.0,
+		outputPrice: 75.0,
+	},
+	"anthropic.claude-3-sonnet-20240229-v1:0": {
+		maxTokens: 4096,
+		supportsImages: true,
+		inputPrice: 3.0,
+		outputPrice: 15.0,
+	},
+	"anthropic.claude-3-haiku-20240307-v1:0": {
+		maxTokens: 4096,
+		supportsImages: true,
+		inputPrice: 0.25,
+		outputPrice: 1.25,
+	},
+} as const satisfies Record<string, ModelInfo>
+
+// OpenRouter
+// https://openrouter.ai/models?order=newest&supported_parameters=tools
+export type OpenRouterModelId = keyof typeof openRouterModels
+export const openRouterDefaultModelId: OpenRouterModelId = "anthropic/claude-3.5-sonnet"
+export const openRouterModels = {
+	"anthropic/claude-3.5-sonnet": {
+		maxTokens: 8192,
+		supportsImages: true,
+		inputPrice: 3.0,
+		outputPrice: 15.0,
+	},
+	"anthropic/claude-3-opus": {
+		maxTokens: 4096,
+		supportsImages: true,
+		inputPrice: 15,
+		outputPrice: 75,
+	},
+	"anthropic/claude-3-sonnet": {
+		maxTokens: 4096,
+		supportsImages: true,
+		inputPrice: 3,
+		outputPrice: 15,
+	},
+	"anthropic/claude-3-haiku": {
+		maxTokens: 4096,
+		supportsImages: true,
+		inputPrice: 0.25,
+		outputPrice: 1.25,
+	},
+	"openai/gpt-4o-2024-08-06": {
+		maxTokens: 16384,
+		supportsImages: true,
+		inputPrice: 2.5,
+		outputPrice: 10,
+	},
+	"openai/gpt-4o-mini-2024-07-18": {
+		maxTokens: 16384,
+		supportsImages: true,
+		inputPrice: 0.15,
+		outputPrice: 0.6,
+	},
+	"openai/gpt-4-turbo": {
+		maxTokens: 4096,
+		supportsImages: true,
+		inputPrice: 10,
+		outputPrice: 30,
+	},
+	"meta-llama/llama-3.1-405b-instruct": {
+		maxTokens: 2048,
+		supportsImages: false,
+		inputPrice: 2.7,
+		outputPrice: 2.7,
+	},
+	"meta-llama/llama-3.1-70b-instruct": {
+		maxTokens: 2048,
+		supportsImages: false,
+		inputPrice: 0.52,
+		outputPrice: 0.75,
+	},
+	"meta-llama/llama-3.1-8b-instruct": {
+		maxTokens: 2048,
+		supportsImages: false,
+		inputPrice: 0.06,
+		outputPrice: 0.06,
+	},
+	"google/gemini-pro-1.5": {
+		maxTokens: 8192,
+		supportsImages: true,
+		inputPrice: 2.5,
+		outputPrice: 7.5,
+	},
+	"google/gemini-flash-1.5": {
+		maxTokens: 8192,
+		supportsImages: true,
+		inputPrice: 0.25,
+		outputPrice: 0.75,
+	},
+	"deepseek/deepseek-coder": {
+		maxTokens: 4096,
+		supportsImages: false,
+		inputPrice: 0.14,
+		outputPrice: 0.28,
+	},
+	"mistralai/mistral-large": {
+		maxTokens: 8192,
+		supportsImages: false,
+		inputPrice: 3,
+		outputPrice: 9,
+	},
+	"mistralai/mistral-medium": {
+		maxTokens: 4096,
+		supportsImages: false,
+		inputPrice: 2.7,
+		outputPrice: 8.1,
+	},
+	"mistralai/mistral-small": {
+		maxTokens: 4096,
+		supportsImages: false,
+		inputPrice: 2,
+		outputPrice: 6,
+	},
+	"mistralai/mistral-7b-instruct-v0.1": {
+		maxTokens: 4096,
+		supportsImages: false,
+		inputPrice: 0.06,
+		outputPrice: 0.06,
+	},
+	"cohere/command-r-plus": {
+		maxTokens: 4000,
+		supportsImages: false,
+		inputPrice: 3,
+		outputPrice: 15,
+	},
+	"cohere/command-r": {
+		maxTokens: 4000,
+		supportsImages: false,
+		inputPrice: 0.5,
+		outputPrice: 1.5,
+	},
+} as const satisfies Record<string, ModelInfo>
--- a/webview-ui/scripts/build-react-no-split.js
+++ b/webview-ui/scripts/build-react-no-split.js
@@ -72,8 +72,8 @@ By modifying these rules, we can change how webpack processes different files in

 Why we need to modify the webpack config

-Create React App (CRA) is designed to only process files within the src directory for security reasons. Our project structure includes a shared directory outside of src. 
-To use files from this shared directory, we need to:
+Create React App (CRA) is designed to only process files within the src directory for security reasons. (CRA limits processing to the src directory to prevent accidental inclusion of sensitive files, reduce the attack surface, and ensure predictable builds, enhancing overall project security and consistency. Therefore it's essential that if you do include files outside src, you do so explicitly.)
+To use files from the shared directory, we need to:
 1. Modify ModuleScopePlugin to allow imports from the shared directory.
 2. Update the TypeScript loader rule to process TypeScript files from the shared directory.
 These changes tell webpack it's okay to import from the shared directory and ensure that TypeScript files in this directory are properly converted to JavaScript.
@@ -89,7 +89,8 @@ Note: This code assumes a specific structure in the CRA webpack config. If CRA u
 */
 config.module.rules[1].oneOf.forEach((rule) => {
 	if (rule.test && rule.test.toString().includes("ts|tsx")) {
-		rule.include = [...(rule.include || []), sharedDir]
+		// rule.include is path to src by default, but we can update rule.include to be an array as it matches an expected schema by react-scripts
+		rule.include = [rule.include, sharedDir].filter(Boolean)
 	}
 })

--- a/webview-ui/src/index.css
+++ b/webview-ui/src/index.css
@@ -129,3 +129,11 @@ https://github.com/microsoft/vscode-webview-ui-toolkit/tree/main/src/dropdown#wi
 	line-height: normal;
 	margin-bottom: 2px;
 }
+
+/* Fix scrollbar in dropdown */
+
+vscode-dropdown::part(listbox) {
+	border-color: var(--vscode-scrollbarSlider-background);
+	transition: none;
+	scrollbar-color: var(--vscode-scrollbarSlider-background) transparent;
+}