diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml index 501180c3d53..dc66b4f390b 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.yml +++ b/.github/ISSUE_TEMPLATE/bug_report.yml @@ -33,7 +33,7 @@ body: id: model attributes: label: Which Model are you using? - description: Please specify the model you're using (e.g. Claude 3.5 Sonnet) + description: Please specify the model you're using (e.g. Claude 3.7 Sonnet) validations: required: true - type: textarea diff --git a/CHANGELOG.md b/CHANGELOG.md index ff8cfdc3e85..02a4a30cbd2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,35 @@ # Roo Code Changelog +## [3.7.5] + +- Fix context window truncation math (see [#1173](https://github.com/RooVetGit/Roo-Code/issues/1173)) +- Fix various issues with the model picker (thanks @System233!) +- Fix model input / output cost parsing (thanks @System233!) +- Add drag-and-drop for files +- Enable the "Thinking Budget" slider for Claude 3.7 Sonnet on OpenRouter + +## [3.7.4] + +- Fix a bug that prevented the "Thinking" setting from properly updating when switching profiles. + +## [3.7.3] + +- Support for ["Thinking"](https://docs.anthropic.com/en/docs/build-with-claude/extended-thinking) Sonnet 3.7 when using the Anthropic provider. + +## [3.7.2] + +- Fix computer use and prompt caching for OpenRouter's `anthropic/claude-3.7-sonnet:beta` (thanks @cte!) +- Fix sliding window calculations for Sonnet 3.7 that were causing a context window overflow (thanks @cte!) +- Encourage diff editing more strongly in the system prompt (thanks @hannesrudolph!) + +## [3.7.1] + +- Add AWS Bedrock support for Sonnet 3.7 and update some defaults to Sonnet 3.7 instead of 3.5 + +## [3.7.0] + +- Introducing Roo Code 3.7, with support for the new Claude Sonnet 3.7. Because who cares about skipping version numbers anymore? Thanks @lupuletic and @cte for the PRs! + ## [3.3.26] - Adjust the default prompt for Debug mode to focus more on diagnosis and to require user confirmation before moving on to implementation @@ -479,7 +509,7 @@ Join us at https://www.reddit.com/r/RooCode to share your custom modes and be pa ## [2.1.14] - Fix bug where diffs were not being applied correctly and try Aider's [unified diff prompt](https://github.com/Aider-AI/aider/blob/3995accd0ca71cea90ef76d516837f8c2731b9fe/aider/coders/udiff_prompts.py#L75-L105) -- If diffs are enabled, automatically reject create_file commands that lead to truncated output +- If diffs are enabled, automatically reject write_to_file commands that lead to truncated output ## [2.1.13] diff --git a/README.md b/README.md index 53f29e07259..60161110e26 100644 --- a/README.md +++ b/README.md @@ -34,204 +34,78 @@ Check out the [CHANGELOG](CHANGELOG.md) for detailed updates and fixes. --- -## New in 3.3: Code Actions, More Powerful Modes, and a new Discord! 🚀 +## New in 3.7: Claude 3.7 Sonnet Support 🚀 -This release brings significant improvements to how you interact with Roo Code: +We're excited to announce support for Anthropic's latest model, Claude 3.7 Sonnet! The model shows notable improvements in: -### Code Actions +- Front-end development and full-stack updates +- Agentic workflows for multi-step processes +- More accurate math, coding, and instruction-following -Roo Code now integrates directly with VS Code's native code actions system, providing quick fixes and refactoring options right in your editor. Look for the lightbulb 💡 to access Roo Code's capabilities without switching context. - -### Enhanced Mode Capabilities - -- **Markdown Editing**: Addressing one of the most requested features, Ask and Architect modes can now create and edit markdown files! -- **Custom File Restrictions**: In general, custom modes can now be restricted to specific file patterns (for example, a technical writer who can only edit markdown files 👋). There's no UI for this yet, but who needs that when you can just ask Roo to set it up for you? -- **Self-Initiated Mode Switching**: Modes can intelligently request to switch between each other based on the task at hand. For instance, Code mode might request to switch to Test Engineer mode once it's ready to write tests. - -### Join Our Discord! - -We've launched a new Discord community! Join us at [https://roocode.com/discord](https://roocode.com/discord) to: - -- Share your custom modes -- Get help and support -- Connect with other Roo Code users -- Stay updated on the latest features - -## New in 3.2: Introducing Custom Modes, plus rebranding from Roo Cline → Roo Code! 🚀 - -### Introducing Roo Code - -Our biggest update yet is here - we're officially changing our name from Roo Cline to Roo Code! After growing beyond 50,000 installations across VS Marketplace and Open VSX, we're ready to chart our own course. Our heartfelt thanks to everyone in the Cline community who helped us reach this milestone. - -### Custom Modes - -To mark this new chapter, we're introducing the power to shape Roo Code into any role you need. You can now create an entire team of agents with deeply customized prompts: - -- QA Engineers who write thorough test cases and catch edge cases -- Product Managers who excel at user stories and feature prioritization -- UI/UX Designers who craft beautiful, accessible interfaces -- Code Reviewers who ensure quality and maintainability - -The best part is that Roo can help you create these new modes! Just type "Create a new mode for " in the chat to get started, and go into the Prompts tab or (carefully) edit the JSON representation to customize the prompt and allowed tools to your liking. - -We can't wait to hear more about what you build and how we can continue to evolve the Roo Code platform to support you. Please join us in our new https://www.reddit.com/r/RooCode subreddit to share your custom modes and be part of our next chapter. 🚀 - -## New in 3.1: Chat Mode Prompt Customization & Prompt Enhancements - -Hot off the heels of **v3.0** introducing Code, Architect, and Ask chat modes, one of the most requested features has arrived: **customizable prompts for each mode**! 🎉 - -You can now tailor the **role definition** and **custom instructions** for every chat mode to perfectly fit your workflow. Want to adjust Architect mode to focus more on system scalability? Or tweak Ask mode for deeper research queries? Done. Plus, you can define these via **mode-specific `.clinerules-[mode]` files**. You’ll find all of this in the new **Prompts** tab in the top menu. - -The second big feature in this release is a complete revamp of **prompt enhancements**. This feature helps you craft messages to get even better results from Cline. Here’s what’s new: - -- Works with **any provider** and API configuration, not just OpenRouter. -- Fully customizable prompts to match your unique needs. -- Same simple workflow: just hit the ✨ **Enhance Prompt** button in the chat input to try it out. - -Whether you’re using GPT-4, other APIs, or switching configurations, this gives you total control over how your prompts are optimized. - -As always, we’d love to hear your thoughts and ideas! What features do you want to see in **v3.2**? Drop by https://www.reddit.com/r/roocline and join the discussion - we're building Roo Cline together. 🚀 - -## New in 3.0 - Chat Modes! - -You can now choose between different prompts for Roo Cline to better suit your workflow. Here’s what’s available: - -- **Code:** (existing behavior) The default mode where Cline helps you write code and execute tasks. - -- **Architect:** "You are Cline, a software architecture expert..." Ideal for thinking through high-level technical design and system architecture. Can’t write code or run commands. - -- **Ask:** "You are Cline, a knowledgeable technical assistant..." Perfect for asking questions about the codebase or digging into concepts. Also can’t write code or run commands. - -**Switching Modes:** -It’s super simple! There’s a dropdown in the bottom left of the chat input to switch modes. Right next to it, you’ll find a way to switch between the API configuration profiles associated with the current mode (configured on the settings screen). - -**Why Add This?** - -- It keeps Cline from being overly eager to jump into solving problems when you just want to think or ask questions. -- Each mode remembers the API configuration you last used with it. For example, you can use more thoughtful models like OpenAI o1 for Architect and Ask, while sticking with Sonnet or DeepSeek for coding tasks. -- It builds on research suggesting better results when separating "thinking" from "coding," explained well in this very thoughtful [article](https://aider.chat/2024/09/26/architect.html) from aider. - -Right now, switching modes is a manual process. In the future, we’d love to give Cline the ability to suggest mode switches based on context. For now, we’d really appreciate your feedback on this feature. +Try it today in your provider of choice! --- -## Key Features - -### Adaptive Autonomy +## What Can Roo Code Do? -Roo Code communicates in **natural language** and proposes actions—file edits, terminal commands, browser tests, etc. You choose how it behaves: +- 🚀 **Generate Code** from natural language descriptions +- 🔧 **Refactor & Debug** existing code +- 📝 **Write & Update** documentation +- 🤔 **Answer Questions** about your codebase +- 🔄 **Automate** repetitive tasks +- 🏗️ **Create** new files and projects -- **Manual Approval**: Review and approve every step to keep total control. -- **Autonomous/Auto-Approve**: Grant Roo Code the ability to run tasks without interruption, speeding up routine workflows. -- **Hybrid**: Auto-approve specific actions (e.g., file writes) but require confirmation for riskier tasks (like deploying code). +## Quick Start -No matter your preference, you always have the final say on what Roo Code does. - ---- +1. [Install Roo Code](https://docs.roocode.com/getting-started/installing) +2. [Connect Your AI Provider](https://docs.roocode.com/getting-started/connecting-api-provider) +3. [Try Your First Task](https://docs.roocode.com/getting-started/your-first-task) -### Supports Any API or Model - -Use Roo Code with: - -- **OpenRouter**, Anthropic, Glama, OpenAI, Google Gemini, AWS Bedrock, Azure, GCP Vertex, or local models (LM Studio/Ollama)—anything **OpenAI-compatible**. -- Different models per mode. For instance, an advanced model for architecture vs. a cheaper model for daily coding tasks. -- **Usage Tracking**: Roo Code monitors token and cost usage for each session. - ---- - -### Custom Modes - -**Custom Modes** let you shape Roo Code’s persona, instructions, and permissions: - -- **Built-in**: - - **Code** – Default, multi-purpose coding assistant - - **Architect** – High-level system and design insights - - **Ask** – Research and Q&A for deeper exploration -- **User-Created**: Type `Create a new mode for ` and Roo Code generates a brand-new persona for that role—complete with tailored prompts and optional tool restrictions. - -Modes can each have unique instructions and skill sets. Manage them in the **Prompts** tab. - -**Advanced Mode Features:** - -- **File Restrictions**: Modes can be restricted to specific file types (e.g., Ask and Architect modes can edit markdown files) -- **Custom File Rules**: Define your own file access patterns (e.g., `.test.ts` for test files only) -- **Direct Mode Switching**: Modes can request to switch to other modes when needed (e.g., switching to Code mode for implementation) -- **Self-Creation**: Roo Code can help create new modes, complete with role definitions and file restrictions - ---- - -### File & Editor Operations - -Roo Code can: - -- **Create and edit** files in your project (showing you diffs). -- **React** to linting or compile-time errors automatically (missing imports, syntax errors, etc.). -- **Track changes** via your editor’s timeline so you can review or revert if needed. - ---- - -### Command Line Integration - -Easily run commands in your terminal—Roo Code: - -- Installs packages, runs builds, or executes tests. -- Monitors output and adapts if it detects errors. -- Lets you keep dev servers running in the background while continuing to work. - -You approve or decline each command, or set auto-approval for routine operations. - ---- - -### Browser Automation - -Roo Code can also open a **browser** session to: - -- Launch your local or remote web app. -- Click, type, scroll, and capture screenshots. -- Collect console logs to debug runtime or UI/UX issues. - -Ideal for **end-to-end testing** or visually verifying changes without constant copy-pasting. - ---- +## Key Features -### Adding Tools with MCP +### Multiple Modes -Extend Roo Code with the **Model Context Protocol (MCP)**: +Roo Code adapts to your needs with specialized [modes](https://docs.roocode.com/basic-usage/modes): -- “Add a tool that manages AWS EC2 resources.” -- “Add a tool that queries the company Jira.” -- “Add a tool that pulls the latest PagerDuty incidents.” +- **Code Mode:** For general-purpose coding tasks +- **Architect Mode:** For planning and technical leadership +- **Ask Mode:** For answering questions and providing information +- **Debug Mode:** For systematic problem diagnosis +- **[Custom Modes](https://docs.roocode.com/advanced-usage/custom-modes):** Create unlimited specialized personas for security auditing, performance optimization, documentation, or any other task -Roo Code can build and configure new tools autonomously (with your approval) to expand its capabilities instantly. +### Smart Tools ---- +Roo Code comes with powerful [tools](https://docs.roocode.com/basic-usage/using-tools) that can: -### Context Mentions +- Read and write files in your project +- Execute commands in your VS Code terminal +- Control a web browser +- Use external tools via [MCP (Model Context Protocol)](https://docs.roocode.com/advanced-usage/mcp) -When you need to provide extra context: +MCP extends Roo Code's capabilities by allowing you to add unlimited custom tools. Integrate with external APIs, connect to databases, or create specialized development tools - MCP provides the framework to expand Roo Code's functionality to meet your specific needs. -- **@file** – Embed a file’s contents in the conversation. -- **@folder** – Include entire folder structures. -- **@problems** – Pull in workspace errors/warnings for Roo Code to fix. -- **@url** – Fetch docs from a URL, converting them to markdown. -- **@git** – Supply a list of Git commits or diffs for Roo Code to analyze code history. +### Customization -Help Roo Code focus on the most relevant details without blowing the token budget. +Make Roo Code work your way with: ---- +- [Custom Instructions](https://docs.roocode.com/advanced-usage/custom-instructions) for personalized behavior +- [Custom Modes](https://docs.roocode.com/advanced-usage/custom-modes) for specialized tasks +- [Local Models](https://docs.roocode.com/advanced-usage/local-models) for offline use +- [Auto-Approval Settings](https://docs.roocode.com/advanced-usage/auto-approving-actions) for faster workflows -## Installation +## Resources -Roo Code is available on: +### Documentation -- **[VSCode Marketplace](https://marketplace.visualstudio.com/items?itemName=RooVeterinaryInc.roo-cline)** -- **[Open-VSX](https://open-vsx.org/extension/RooVeterinaryInc/roo-cline)** +- [Basic Usage Guide](https://docs.roocode.com/basic-usage/the-chat-interface) +- [Advanced Features](https://docs.roocode.com/advanced-usage/auto-approving-actions) +- [Frequently Asked Questions](https://docs.roocode.com/faq) -1. **Search “Roo Code”** in your editor’s Extensions panel to install directly. -2. Or grab the `.vsix` file from Marketplace / Open-VSX and **drag-and-drop** into your editor. -3. **Open** Roo Code from the Activity Bar or Command Palette to start chatting. +### Community -> **Tip**: Use `Cmd/Ctrl + Shift + P` → “Roo Code: Open in New Tab” to dock the AI assistant alongside your file explorer. +- **Discord:** [Join our Discord server](https://discord.gg/roocode) for real-time help and discussions +- **Reddit:** [Visit our subreddit](https://www.reddit.com/r/RooCode) to share experiences and tips +- **GitHub:** Report [issues](https://github.com/RooVetGit/Roo-Code/issues) or request [features](https://github.com/RooVetGit/Roo-Code/discussions/categories/feature-requests?discussions_q=is%3Aopen+category%3A%22Feature+Requests%22+sort%3Atop) --- diff --git a/package-lock.json b/package-lock.json index 9822548678d..a6c75bd69b3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,15 +1,15 @@ { "name": "roo-cline", - "version": "3.3.26", + "version": "3.7.5", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "roo-cline", - "version": "3.3.26", + "version": "3.7.5", "dependencies": { "@anthropic-ai/bedrock-sdk": "^0.10.2", - "@anthropic-ai/sdk": "^0.26.0", + "@anthropic-ai/sdk": "^0.37.0", "@anthropic-ai/vertex-sdk": "^0.4.1", "@aws-sdk/client-bedrock-runtime": "^3.706.0", "@google/generative-ai": "^0.18.0", @@ -122,9 +122,10 @@ } }, "node_modules/@anthropic-ai/sdk": { - "version": "0.26.1", - "resolved": "https://registry.npmjs.org/@anthropic-ai/sdk/-/sdk-0.26.1.tgz", - "integrity": "sha512-HeMJP1bDFfQPQS3XTJAmfXkFBdZ88wvfkE05+vsoA9zGn5dHqEaHOPsqkazf/i0gXYg2XlLxxZrf6rUAarSqzw==", + "version": "0.37.0", + "resolved": "https://registry.npmjs.org/@anthropic-ai/sdk/-/sdk-0.37.0.tgz", + "integrity": "sha512-tHjX2YbkUBwEgg0JZU3EFSSAQPoK4qQR/NFYa8Vtzd5UAyXzZksCw2In69Rml4R/TyHPBfRYaLK35XiOe33pjw==", + "license": "MIT", "dependencies": { "@types/node": "^18.11.18", "@types/node-fetch": "^2.6.4", diff --git a/package.json b/package.json index c4c38e78571..2ff4977757b 100644 --- a/package.json +++ b/package.json @@ -1,9 +1,9 @@ { "name": "roo-cline", "displayName": "Roo Code (prev. Roo Cline)", - "description": "An AI-powered autonomous coding agent that lives in your editor.", + "description": "A whole dev team of AI agents in your editor.", "publisher": "RooVeterinaryInc", - "version": "3.3.26", + "version": "3.7.5", "icon": "assets/icons/rocket.png", "galleryBanner": { "color": "#617A91", @@ -77,7 +77,7 @@ { "command": "roo-cline.mcpButtonClicked", "title": "MCP Servers", - "icon": "$(server)" + "icon": "$(extensions)" }, { "command": "roo-cline.promptsButtonClicked", @@ -304,7 +304,7 @@ }, "dependencies": { "@anthropic-ai/bedrock-sdk": "^0.10.2", - "@anthropic-ai/sdk": "^0.26.0", + "@anthropic-ai/sdk": "^0.37.0", "@anthropic-ai/vertex-sdk": "^0.4.1", "@aws-sdk/client-bedrock-runtime": "^3.706.0", "@google/generative-ai": "^0.18.0", diff --git a/src/api/providers/__tests__/anthropic.test.ts b/src/api/providers/__tests__/anthropic.test.ts index df0050ab9cd..ff7bdb40549 100644 --- a/src/api/providers/__tests__/anthropic.test.ts +++ b/src/api/providers/__tests__/anthropic.test.ts @@ -1,50 +1,13 @@ +// npx jest src/api/providers/__tests__/anthropic.test.ts + import { AnthropicHandler } from "../anthropic" import { ApiHandlerOptions } from "../../../shared/api" -import { ApiStream } from "../../transform/stream" -import { Anthropic } from "@anthropic-ai/sdk" -// Mock Anthropic client -const mockBetaCreate = jest.fn() const mockCreate = jest.fn() + jest.mock("@anthropic-ai/sdk", () => { return { Anthropic: jest.fn().mockImplementation(() => ({ - beta: { - promptCaching: { - messages: { - create: mockBetaCreate.mockImplementation(async () => ({ - async *[Symbol.asyncIterator]() { - yield { - type: "message_start", - message: { - usage: { - input_tokens: 100, - output_tokens: 50, - cache_creation_input_tokens: 20, - cache_read_input_tokens: 10, - }, - }, - } - yield { - type: "content_block_start", - index: 0, - content_block: { - type: "text", - text: "Hello", - }, - } - yield { - type: "content_block_delta", - delta: { - type: "text_delta", - text: " world", - }, - } - }, - })), - }, - }, - }, messages: { create: mockCreate.mockImplementation(async (options) => { if (!options.stream) { @@ -65,16 +28,26 @@ jest.mock("@anthropic-ai/sdk", () => { type: "message_start", message: { usage: { - input_tokens: 10, - output_tokens: 5, + input_tokens: 100, + output_tokens: 50, + cache_creation_input_tokens: 20, + cache_read_input_tokens: 10, }, }, } yield { type: "content_block_start", + index: 0, content_block: { type: "text", - text: "Test response", + text: "Hello", + }, + } + yield { + type: "content_block_delta", + delta: { + type: "text_delta", + text: " world", }, } }, @@ -95,7 +68,6 @@ describe("AnthropicHandler", () => { apiModelId: "claude-3-5-sonnet-20241022", } handler = new AnthropicHandler(mockOptions) - mockBetaCreate.mockClear() mockCreate.mockClear() }) @@ -126,17 +98,6 @@ describe("AnthropicHandler", () => { describe("createMessage", () => { const systemPrompt = "You are a helpful assistant." - const messages: Anthropic.Messages.MessageParam[] = [ - { - role: "user", - content: [ - { - type: "text" as const, - text: "Hello!", - }, - ], - }, - ] it("should handle prompt caching for supported models", async () => { const stream = handler.createMessage(systemPrompt, [ @@ -173,9 +134,8 @@ describe("AnthropicHandler", () => { expect(textChunks[0].text).toBe("Hello") expect(textChunks[1].text).toBe(" world") - // Verify beta API was used - expect(mockBetaCreate).toHaveBeenCalled() - expect(mockCreate).not.toHaveBeenCalled() + // Verify API + expect(mockCreate).toHaveBeenCalled() }) }) diff --git a/src/api/providers/__tests__/glama.test.ts b/src/api/providers/__tests__/glama.test.ts index c3fc90e32b4..5e017ccd0ad 100644 --- a/src/api/providers/__tests__/glama.test.ts +++ b/src/api/providers/__tests__/glama.test.ts @@ -1,9 +1,11 @@ -import { GlamaHandler } from "../glama" -import { ApiHandlerOptions } from "../../../shared/api" -import OpenAI from "openai" +// npx jest src/api/providers/__tests__/glama.test.ts + import { Anthropic } from "@anthropic-ai/sdk" import axios from "axios" +import { GlamaHandler } from "../glama" +import { ApiHandlerOptions } from "../../../shared/api" + // Mock OpenAI client const mockCreate = jest.fn() const mockWithResponse = jest.fn() @@ -71,8 +73,8 @@ describe("GlamaHandler", () => { beforeEach(() => { mockOptions = { - apiModelId: "anthropic/claude-3-5-sonnet", - glamaModelId: "anthropic/claude-3-5-sonnet", + apiModelId: "anthropic/claude-3-7-sonnet", + glamaModelId: "anthropic/claude-3-7-sonnet", glamaApiKey: "test-api-key", } handler = new GlamaHandler(mockOptions) diff --git a/src/api/providers/__tests__/openrouter.test.ts b/src/api/providers/__tests__/openrouter.test.ts index 18f81ce2fdf..aabd7f71a84 100644 --- a/src/api/providers/__tests__/openrouter.test.ts +++ b/src/api/providers/__tests__/openrouter.test.ts @@ -1,3 +1,5 @@ +// npx jest src/api/providers/__tests__/openrouter.test.ts + import { OpenRouterHandler } from "../openrouter" import { ApiHandlerOptions, ModelInfo } from "../../../shared/api" import OpenAI from "openai" @@ -55,7 +57,7 @@ describe("OpenRouterHandler", () => { const handler = new OpenRouterHandler({}) const result = handler.getModel() - expect(result.id).toBe("anthropic/claude-3.5-sonnet:beta") + expect(result.id).toBe("anthropic/claude-3.7-sonnet") expect(result.info.supportsPromptCache).toBe(true) }) diff --git a/src/api/providers/__tests__/vertex.test.ts b/src/api/providers/__tests__/vertex.test.ts index a51033af2d6..ebe60ba0c68 100644 --- a/src/api/providers/__tests__/vertex.test.ts +++ b/src/api/providers/__tests__/vertex.test.ts @@ -1,7 +1,10 @@ -import { VertexHandler } from "../vertex" +// npx jest src/api/providers/__tests__/vertex.test.ts + import { Anthropic } from "@anthropic-ai/sdk" import { AnthropicVertex } from "@anthropic-ai/vertex-sdk" +import { VertexHandler } from "../vertex" + // Mock Vertex SDK jest.mock("@anthropic-ai/vertex-sdk", () => ({ AnthropicVertex: jest.fn().mockImplementation(() => ({ @@ -289,7 +292,7 @@ describe("VertexHandler", () => { vertexRegion: "us-central1", }) const modelInfo = invalidHandler.getModel() - expect(modelInfo.id).toBe("claude-3-5-sonnet-v2@20241022") // Default model + expect(modelInfo.id).toBe("claude-3-7-sonnet@20250219") // Default model }) }) }) diff --git a/src/api/providers/anthropic.ts b/src/api/providers/anthropic.ts index 9a14756f5d2..ad58a1cf6b2 100644 --- a/src/api/providers/anthropic.ts +++ b/src/api/providers/anthropic.ts @@ -1,5 +1,7 @@ import { Anthropic } from "@anthropic-ai/sdk" import { Stream as AnthropicStream } from "@anthropic-ai/sdk/streaming" +import { CacheControlEphemeral } from "@anthropic-ai/sdk/resources" +import { BetaThinkingConfigParam } from "@anthropic-ai/sdk/resources/beta" import { anthropicDefaultModelId, AnthropicModelId, @@ -18,6 +20,7 @@ export class AnthropicHandler implements ApiHandler, SingleCompletionHandler { constructor(options: ApiHandlerOptions) { this.options = options + this.client = new Anthropic({ apiKey: this.options.apiKey, baseURL: this.options.anthropicBaseUrl || undefined, @@ -25,45 +28,60 @@ export class AnthropicHandler implements ApiHandler, SingleCompletionHandler { } async *createMessage(systemPrompt: string, messages: Anthropic.Messages.MessageParam[]): ApiStream { - let stream: AnthropicStream - const modelId = this.getModel().id + let stream: AnthropicStream + const cacheControl: CacheControlEphemeral = { type: "ephemeral" } + let { id: modelId, info: modelInfo } = this.getModel() + const maxTokens = modelInfo.maxTokens || 8192 + let temperature = this.options.modelTemperature ?? ANTHROPIC_DEFAULT_TEMPERATURE + let thinking: BetaThinkingConfigParam | undefined = undefined + + // Anthropic "Thinking" models require a temperature of 1.0. + if (modelId === "claude-3-7-sonnet-20250219:thinking") { + // The `:thinking` variant is a virtual identifier for the + // `claude-3-7-sonnet-20250219` model with a thinking budget. + // We can handle this more elegantly in the future. + modelId = "claude-3-7-sonnet-20250219" + const budgetTokens = this.options.anthropicThinking ?? Math.max(maxTokens * 0.8, 1024) + thinking = { type: "enabled", budget_tokens: budgetTokens } + temperature = 1.0 + } + switch (modelId) { - // 'latest' alias does not support cache_control + case "claude-3-7-sonnet-20250219": case "claude-3-5-sonnet-20241022": case "claude-3-5-haiku-20241022": case "claude-3-opus-20240229": case "claude-3-haiku-20240307": { - /* - The latest message will be the new user message, one before will be the assistant message from a previous request, and the user message before that will be a previously cached user message. So we need to mark the latest user message as ephemeral to cache it for the next request, and mark the second to last user message as ephemeral to let the server know the last message to retrieve from the cache for the current request.. - */ + /** + * The latest message will be the new user message, one before will + * be the assistant message from a previous request, and the user message before that will be a previously cached user message. So we need to mark the latest user message as ephemeral to cache it for the next request, and mark the second to last user message as ephemeral to let the server know the last message to retrieve from the cache for the current request.. + */ const userMsgIndices = messages.reduce( (acc, msg, index) => (msg.role === "user" ? [...acc, index] : acc), [] as number[], ) + const lastUserMsgIndex = userMsgIndices[userMsgIndices.length - 1] ?? -1 const secondLastMsgUserIndex = userMsgIndices[userMsgIndices.length - 2] ?? -1 - stream = await this.client.beta.promptCaching.messages.create( + + stream = await this.client.messages.create( { model: modelId, - max_tokens: this.getModel().info.maxTokens || 8192, - temperature: this.options.modelTemperature ?? ANTHROPIC_DEFAULT_TEMPERATURE, - system: [{ text: systemPrompt, type: "text", cache_control: { type: "ephemeral" } }], // setting cache breakpoint for system prompt so new tasks can reuse it + max_tokens: maxTokens, + temperature, + thinking, + // Setting cache breakpoint for system prompt so new tasks can reuse it. + system: [{ text: systemPrompt, type: "text", cache_control: cacheControl }], messages: messages.map((message, index) => { if (index === lastUserMsgIndex || index === secondLastMsgUserIndex) { return { ...message, content: typeof message.content === "string" - ? [ - { - type: "text", - text: message.content, - cache_control: { type: "ephemeral" }, - }, - ] + ? [{ type: "text", text: message.content, cache_control: cacheControl }] : message.content.map((content, contentIndex) => contentIndex === message.content.length - 1 - ? { ...content, cache_control: { type: "ephemeral" } } + ? { ...content, cache_control: cacheControl } : content, ), } @@ -97,8 +115,8 @@ export class AnthropicHandler implements ApiHandler, SingleCompletionHandler { default: { stream = (await this.client.messages.create({ model: modelId, - max_tokens: this.getModel().info.maxTokens || 8192, - temperature: this.options.modelTemperature ?? ANTHROPIC_DEFAULT_TEMPERATURE, + max_tokens: maxTokens, + temperature, system: [{ text: systemPrompt, type: "text" }], messages, // tools, @@ -112,8 +130,9 @@ export class AnthropicHandler implements ApiHandler, SingleCompletionHandler { for await (const chunk of stream) { switch (chunk.type) { case "message_start": - // tells us cache reads/writes/input/output + // Tells us cache reads/writes/input/output. const usage = chunk.message.usage + yield { type: "usage", inputTokens: usage.input_tokens || 0, @@ -121,45 +140,53 @@ export class AnthropicHandler implements ApiHandler, SingleCompletionHandler { cacheWriteTokens: usage.cache_creation_input_tokens || undefined, cacheReadTokens: usage.cache_read_input_tokens || undefined, } + break case "message_delta": - // tells us stop_reason, stop_sequence, and output tokens along the way and at the end of the message - + // Tells us stop_reason, stop_sequence, and output tokens + // along the way and at the end of the message. yield { type: "usage", inputTokens: 0, outputTokens: chunk.usage.output_tokens || 0, } + break case "message_stop": - // no usage data, just an indicator that the message is done + // No usage data, just an indicator that the message is done. break case "content_block_start": switch (chunk.content_block.type) { - case "text": - // we may receive multiple text blocks, in which case just insert a line break between them + case "thinking": + // We may receive multiple text blocks, in which + // case just insert a line break between them. if (chunk.index > 0) { - yield { - type: "text", - text: "\n", - } + yield { type: "reasoning", text: "\n" } } - yield { - type: "text", - text: chunk.content_block.text, + + yield { type: "reasoning", text: chunk.content_block.thinking } + break + case "text": + // We may receive multiple text blocks, in which + // case just insert a line break between them. + if (chunk.index > 0) { + yield { type: "text", text: "\n" } } + + yield { type: "text", text: chunk.content_block.text } break } break case "content_block_delta": switch (chunk.delta.type) { + case "thinking_delta": + yield { type: "reasoning", text: chunk.delta.thinking } + break case "text_delta": - yield { - type: "text", - text: chunk.delta.text, - } + yield { type: "text", text: chunk.delta.text } break } + break case "content_block_stop": break @@ -169,10 +196,12 @@ export class AnthropicHandler implements ApiHandler, SingleCompletionHandler { getModel(): { id: AnthropicModelId; info: ModelInfo } { const modelId = this.options.apiModelId + if (modelId && modelId in anthropicModels) { const id = modelId as AnthropicModelId return { id, info: anthropicModels[id] } } + return { id: anthropicDefaultModelId, info: anthropicModels[anthropicDefaultModelId] } } @@ -187,14 +216,17 @@ export class AnthropicHandler implements ApiHandler, SingleCompletionHandler { }) const content = response.content[0] + if (content.type === "text") { return content.text } + return "" } catch (error) { if (error instanceof Error) { throw new Error(`Anthropic completion error: ${error.message}`) } + throw error } } diff --git a/src/api/providers/bedrock.ts b/src/api/providers/bedrock.ts index 8f897fda2a7..3bca70338df 100644 --- a/src/api/providers/bedrock.ts +++ b/src/api/providers/bedrock.ts @@ -9,7 +9,7 @@ import { Anthropic } from "@anthropic-ai/sdk" import { ApiHandler, SingleCompletionHandler } from "../" import { ApiHandlerOptions, BedrockModelId, ModelInfo, bedrockDefaultModelId, bedrockModels } from "../../shared/api" import { ApiStream } from "../transform/stream" -import { convertToBedrockConverseMessages, convertToAnthropicMessage } from "../transform/bedrock-converse-format" +import { convertToBedrockConverseMessages } from "../transform/bedrock-converse-format" const BEDROCK_DEFAULT_TEMPERATURE = 0.3 diff --git a/src/api/providers/glama.ts b/src/api/providers/glama.ts index 72b41e5f58b..946d28d24fb 100644 --- a/src/api/providers/glama.ts +++ b/src/api/providers/glama.ts @@ -1,10 +1,12 @@ import { Anthropic } from "@anthropic-ai/sdk" import axios from "axios" import OpenAI from "openai" -import { ApiHandler, SingleCompletionHandler } from "../" + import { ApiHandlerOptions, ModelInfo, glamaDefaultModelId, glamaDefaultModelInfo } from "../../shared/api" +import { parseApiPrice } from "../../utils/cost" import { convertToOpenAiMessages } from "../transform/openai-format" import { ApiStream } from "../transform/stream" +import { ApiHandler, SingleCompletionHandler } from "../" const GLAMA_DEFAULT_TEMPERATURE = 0 @@ -69,7 +71,7 @@ export class GlamaHandler implements ApiHandler, SingleCompletionHandler { let maxTokens: number | undefined if (this.getModel().id.startsWith("anthropic/")) { - maxTokens = 8_192 + maxTokens = this.getModel().info.maxTokens } const requestOptions: OpenAI.Chat.ChatCompletionCreateParams = { @@ -177,7 +179,7 @@ export class GlamaHandler implements ApiHandler, SingleCompletionHandler { } if (this.getModel().id.startsWith("anthropic/")) { - requestOptions.max_tokens = 8192 + requestOptions.max_tokens = this.getModel().info.maxTokens } const response = await this.client.chat.completions.create(requestOptions) @@ -190,3 +192,44 @@ export class GlamaHandler implements ApiHandler, SingleCompletionHandler { } } } + +export async function getGlamaModels() { + const models: Record = {} + + try { + const response = await axios.get("https://glama.ai/api/gateway/v1/models") + const rawModels = response.data + + for (const rawModel of rawModels) { + const modelInfo: ModelInfo = { + maxTokens: rawModel.maxTokensOutput, + contextWindow: rawModel.maxTokensInput, + supportsImages: rawModel.capabilities?.includes("input:image"), + supportsComputerUse: rawModel.capabilities?.includes("computer_use"), + supportsPromptCache: rawModel.capabilities?.includes("caching"), + inputPrice: parseApiPrice(rawModel.pricePerToken?.input), + outputPrice: parseApiPrice(rawModel.pricePerToken?.output), + description: undefined, + cacheWritesPrice: parseApiPrice(rawModel.pricePerToken?.cacheWrite), + cacheReadsPrice: parseApiPrice(rawModel.pricePerToken?.cacheRead), + } + + switch (rawModel.id) { + case rawModel.id.startsWith("anthropic/claude-3-7-sonnet"): + modelInfo.maxTokens = 16384 + break + case rawModel.id.startsWith("anthropic/"): + modelInfo.maxTokens = 8192 + break + default: + break + } + + models[rawModel.id] = modelInfo + } + } catch (error) { + console.error(`Error fetching Glama models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`) + } + + return models +} diff --git a/src/api/providers/lmstudio.ts b/src/api/providers/lmstudio.ts index 7efa037f464..beb3bd1b793 100644 --- a/src/api/providers/lmstudio.ts +++ b/src/api/providers/lmstudio.ts @@ -1,5 +1,7 @@ import { Anthropic } from "@anthropic-ai/sdk" import OpenAI from "openai" +import axios from "axios" + import { ApiHandler, SingleCompletionHandler } from "../" import { ApiHandlerOptions, ModelInfo, openAiModelInfoSaneDefaults } from "../../shared/api" import { convertToOpenAiMessages } from "../transform/openai-format" @@ -72,3 +74,17 @@ export class LmStudioHandler implements ApiHandler, SingleCompletionHandler { } } } + +export async function getLmStudioModels(baseUrl = "http://localhost:1234") { + try { + if (!URL.canParse(baseUrl)) { + return [] + } + + const response = await axios.get(`${baseUrl}/v1/models`) + const modelsArray = response.data?.data?.map((model: any) => model.id) || [] + return [...new Set(modelsArray)] + } catch (error) { + return [] + } +} diff --git a/src/api/providers/ollama.ts b/src/api/providers/ollama.ts index afb6117b54f..de7df5d2618 100644 --- a/src/api/providers/ollama.ts +++ b/src/api/providers/ollama.ts @@ -1,5 +1,7 @@ import { Anthropic } from "@anthropic-ai/sdk" import OpenAI from "openai" +import axios from "axios" + import { ApiHandler, SingleCompletionHandler } from "../" import { ApiHandlerOptions, ModelInfo, openAiModelInfoSaneDefaults } from "../../shared/api" import { convertToOpenAiMessages } from "../transform/openai-format" @@ -88,3 +90,17 @@ export class OllamaHandler implements ApiHandler, SingleCompletionHandler { } } } + +export async function getOllamaModels(baseUrl = "http://localhost:11434") { + try { + if (!URL.canParse(baseUrl)) { + return [] + } + + const response = await axios.get(`${baseUrl}/api/tags`) + const modelsArray = response.data?.models?.map((model: any) => model.name) || [] + return [...new Set(modelsArray)] + } catch (error) { + return [] + } +} diff --git a/src/api/providers/openai.ts b/src/api/providers/openai.ts index cea500df263..f1c404d50ae 100644 --- a/src/api/providers/openai.ts +++ b/src/api/providers/openai.ts @@ -1,5 +1,6 @@ import { Anthropic } from "@anthropic-ai/sdk" import OpenAI, { AzureOpenAI } from "openai" +import axios from "axios" import { ApiHandlerOptions, @@ -166,3 +167,27 @@ export class OpenAiHandler implements ApiHandler, SingleCompletionHandler { } } } + +export async function getOpenAiModels(baseUrl?: string, apiKey?: string) { + try { + if (!baseUrl) { + return [] + } + + if (!URL.canParse(baseUrl)) { + return [] + } + + const config: Record = {} + + if (apiKey) { + config["headers"] = { Authorization: `Bearer ${apiKey}` } + } + + const response = await axios.get(`${baseUrl}/models`, config) + const modelsArray = response.data?.data?.map((model: any) => model.id) || [] + return [...new Set(modelsArray)] + } catch (error) { + return [] + } +} diff --git a/src/api/providers/openrouter.ts b/src/api/providers/openrouter.ts index 1fcf25260ef..0a9488e816f 100644 --- a/src/api/providers/openrouter.ts +++ b/src/api/providers/openrouter.ts @@ -1,29 +1,31 @@ import { Anthropic } from "@anthropic-ai/sdk" +import { BetaThinkingConfigParam } from "@anthropic-ai/sdk/resources/beta" import axios from "axios" import OpenAI from "openai" -import { ApiHandler } from "../" +import delay from "delay" + import { ApiHandlerOptions, ModelInfo, openRouterDefaultModelId, openRouterDefaultModelInfo } from "../../shared/api" +import { parseApiPrice } from "../../utils/cost" import { convertToOpenAiMessages } from "../transform/openai-format" import { ApiStreamChunk, ApiStreamUsageChunk } from "../transform/stream" -import delay from "delay" +import { convertToR1Format } from "../transform/r1-format" import { DEEP_SEEK_DEFAULT_TEMPERATURE } from "./openai" +import { ApiHandler, SingleCompletionHandler } from ".." const OPENROUTER_DEFAULT_TEMPERATURE = 0 -// Add custom interface for OpenRouter params +// Add custom interface for OpenRouter params. type OpenRouterChatCompletionParams = OpenAI.Chat.ChatCompletionCreateParams & { transforms?: string[] include_reasoning?: boolean + thinking?: BetaThinkingConfigParam } -// Add custom interface for OpenRouter usage chunk +// Add custom interface for OpenRouter usage chunk. interface OpenRouterApiStreamUsageChunk extends ApiStreamUsageChunk { fullResponseText: string } -import { SingleCompletionHandler } from ".." -import { convertToR1Format } from "../transform/r1-format" - export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { private options: ApiHandlerOptions private client: OpenAI @@ -52,21 +54,12 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { ...convertToOpenAiMessages(messages), ] + const { id: modelId, info: modelInfo } = this.getModel() + // prompt caching: https://openrouter.ai/docs/prompt-caching // this is specifically for claude models (some models may 'support prompt caching' automatically without this) - switch (this.getModel().id) { - case "anthropic/claude-3.5-sonnet": - case "anthropic/claude-3.5-sonnet:beta": - case "anthropic/claude-3.5-sonnet-20240620": - case "anthropic/claude-3.5-sonnet-20240620:beta": - case "anthropic/claude-3-5-haiku": - case "anthropic/claude-3-5-haiku:beta": - case "anthropic/claude-3-5-haiku-20241022": - case "anthropic/claude-3-5-haiku-20241022:beta": - case "anthropic/claude-3-haiku": - case "anthropic/claude-3-haiku:beta": - case "anthropic/claude-3-opus": - case "anthropic/claude-3-opus:beta": + switch (true) { + case modelId.startsWith("anthropic/"): openAiMessages[0] = { role: "system", content: [ @@ -102,30 +95,11 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { break } - // Not sure how openrouter defaults max tokens when no value is provided, but the anthropic api requires this value and since they offer both 4096 and 8192 variants, we should ensure 8192. - // (models usually default to max tokens allowed) - let maxTokens: number | undefined - switch (this.getModel().id) { - case "anthropic/claude-3.5-sonnet": - case "anthropic/claude-3.5-sonnet:beta": - case "anthropic/claude-3.5-sonnet-20240620": - case "anthropic/claude-3.5-sonnet-20240620:beta": - case "anthropic/claude-3-5-haiku": - case "anthropic/claude-3-5-haiku:beta": - case "anthropic/claude-3-5-haiku-20241022": - case "anthropic/claude-3-5-haiku-20241022:beta": - maxTokens = 8_192 - break - } - let defaultTemperature = OPENROUTER_DEFAULT_TEMPERATURE let topP: number | undefined = undefined // Handle models based on deepseek-r1 - if ( - this.getModel().id.startsWith("deepseek/deepseek-r1") || - this.getModel().id === "perplexity/sonar-reasoning" - ) { + if (modelId.startsWith("deepseek/deepseek-r1") || modelId === "perplexity/sonar-reasoning") { // Recommended temperature for DeepSeek reasoning models defaultTemperature = DEEP_SEEK_DEFAULT_TEMPERATURE // DeepSeek highly recommends using user instead of system role @@ -134,24 +108,38 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { topP = 0.95 } + let temperature = this.options.modelTemperature ?? defaultTemperature + let thinking: BetaThinkingConfigParam | undefined = undefined + + if (modelInfo.thinking) { + const maxTokens = modelInfo.maxTokens || 8192 + const budgetTokens = this.options.anthropicThinking ?? Math.max(maxTokens * 0.8, 1024) + thinking = { type: "enabled", budget_tokens: budgetTokens } + temperature = 1.0 + } + // https://openrouter.ai/docs/transforms let fullResponseText = "" - const stream = await this.client.chat.completions.create({ - model: this.getModel().id, - max_tokens: maxTokens, - temperature: this.options.modelTemperature ?? defaultTemperature, + + const completionParams: OpenRouterChatCompletionParams = { + model: modelId, + max_tokens: modelInfo.maxTokens, + temperature, + thinking, // OpenRouter is temporarily supporting this. top_p: topP, messages: openAiMessages, stream: true, include_reasoning: true, // This way, the transforms field will only be included in the parameters when openRouterUseMiddleOutTransform is true. ...(this.options.openRouterUseMiddleOutTransform && { transforms: ["middle-out"] }), - } as OpenRouterChatCompletionParams) + } + + const stream = await this.client.chat.completions.create(completionParams) let genId: string | undefined for await (const chunk of stream as unknown as AsyncIterable) { - // openrouter returns an error object instead of the openai sdk throwing an error + // OpenRouter returns an error object instead of the OpenAI SDK throwing an error. if ("error" in chunk) { const error = chunk.error as { message?: string; code?: number } console.error(`OpenRouter API Error: ${error?.code} - ${error?.message}`) @@ -163,12 +151,14 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { } const delta = chunk.choices[0]?.delta + if ("reasoning" in delta && delta.reasoning) { yield { type: "reasoning", text: delta.reasoning, } as ApiStreamChunk } + if (delta?.content) { fullResponseText += delta.content yield { @@ -176,6 +166,7 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { text: delta.content, } as ApiStreamChunk } + // if (chunk.usage) { // yield { // type: "usage", @@ -185,10 +176,12 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { // } } - // retry fetching generation details + // Retry fetching generation details. let attempt = 0 + while (attempt++ < 10) { await delay(200) // FIXME: necessary delay to ensure generation endpoint is ready + try { const response = await axios.get(`https://openrouter.ai/api/v1/generation?id=${genId}`, { headers: { @@ -198,7 +191,7 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { }) const generation = response.data?.data - console.log("OpenRouter generation details:", response.data) + yield { type: "usage", // cacheWriteTokens: 0, @@ -209,6 +202,7 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { totalCost: generation?.total_cost || 0, fullResponseText, } as OpenRouterApiStreamUsageChunk + return } catch (error) { // ignore if fails @@ -216,13 +210,13 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { } } } - getModel(): { id: string; info: ModelInfo } { + + getModel() { const modelId = this.options.openRouterModelId const modelInfo = this.options.openRouterModelInfo - if (modelId && modelInfo) { - return { id: modelId, info: modelInfo } - } - return { id: openRouterDefaultModelId, info: openRouterDefaultModelInfo } + return modelId && modelInfo + ? { id: modelId, info: modelInfo } + : { id: openRouterDefaultModelId, info: openRouterDefaultModelInfo } } async completePrompt(prompt: string): Promise { @@ -245,7 +239,81 @@ export class OpenRouterHandler implements ApiHandler, SingleCompletionHandler { if (error instanceof Error) { throw new Error(`OpenRouter completion error: ${error.message}`) } + throw error } } } + +export async function getOpenRouterModels() { + const models: Record = {} + + try { + const response = await axios.get("https://openrouter.ai/api/v1/models") + const rawModels = response.data.data + + for (const rawModel of rawModels) { + const modelInfo: ModelInfo = { + maxTokens: rawModel.top_provider?.max_completion_tokens, + contextWindow: rawModel.context_length, + supportsImages: rawModel.architecture?.modality?.includes("image"), + supportsPromptCache: false, + inputPrice: parseApiPrice(rawModel.pricing?.prompt), + outputPrice: parseApiPrice(rawModel.pricing?.completion), + description: rawModel.description, + thinking: rawModel.id === "anthropic/claude-3.7-sonnet:thinking", + } + + // NOTE: this needs to be synced with api.ts/openrouter default model info. + switch (true) { + case rawModel.id.startsWith("anthropic/claude-3.7-sonnet"): + modelInfo.supportsComputerUse = true + modelInfo.supportsPromptCache = true + modelInfo.cacheWritesPrice = 3.75 + modelInfo.cacheReadsPrice = 0.3 + modelInfo.maxTokens = 16384 + break + case rawModel.id.startsWith("anthropic/claude-3.5-sonnet-20240620"): + modelInfo.supportsPromptCache = true + modelInfo.cacheWritesPrice = 3.75 + modelInfo.cacheReadsPrice = 0.3 + modelInfo.maxTokens = 8192 + break + case rawModel.id.startsWith("anthropic/claude-3.5-sonnet"): + modelInfo.supportsComputerUse = true + modelInfo.supportsPromptCache = true + modelInfo.cacheWritesPrice = 3.75 + modelInfo.cacheReadsPrice = 0.3 + modelInfo.maxTokens = 8192 + break + case rawModel.id.startsWith("anthropic/claude-3-5-haiku"): + modelInfo.supportsPromptCache = true + modelInfo.cacheWritesPrice = 1.25 + modelInfo.cacheReadsPrice = 0.1 + modelInfo.maxTokens = 8192 + break + case rawModel.id.startsWith("anthropic/claude-3-opus"): + modelInfo.supportsPromptCache = true + modelInfo.cacheWritesPrice = 18.75 + modelInfo.cacheReadsPrice = 1.5 + modelInfo.maxTokens = 8192 + break + case rawModel.id.startsWith("anthropic/claude-3-haiku"): + default: + modelInfo.supportsPromptCache = true + modelInfo.cacheWritesPrice = 0.3 + modelInfo.cacheReadsPrice = 0.03 + modelInfo.maxTokens = 8192 + break + } + + models[rawModel.id] = modelInfo + } + } catch (error) { + console.error( + `Error fetching OpenRouter models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`, + ) + } + + return models +} diff --git a/src/api/providers/requesty.ts b/src/api/providers/requesty.ts index 67f43aabc57..5e570ca2a2b 100644 --- a/src/api/providers/requesty.ts +++ b/src/api/providers/requesty.ts @@ -1,6 +1,9 @@ -import { OpenAiHandler, OpenAiHandlerOptions } from "./openai" +import axios from "axios" + import { ModelInfo, requestyModelInfoSaneDefaults, requestyDefaultModelId } from "../../shared/api" -import { ApiStream, ApiStreamUsageChunk } from "../transform/stream" +import { parseApiPrice } from "../../utils/cost" +import { ApiStreamUsageChunk } from "../transform/stream" +import { OpenAiHandler, OpenAiHandlerOptions } from "./openai" export class RequestyHandler extends OpenAiHandler { constructor(options: OpenAiHandlerOptions) { @@ -38,3 +41,65 @@ export class RequestyHandler extends OpenAiHandler { } } } + +export async function getRequestyModels() { + const models: Record = {} + + try { + const response = await axios.get("https://router.requesty.ai/v1/models") + const rawModels = response.data.data + + for (const rawModel of rawModels) { + // { + // id: "anthropic/claude-3-5-sonnet-20240620", + // object: "model", + // created: 1740552655, + // owned_by: "system", + // input_price: 0.0000028, + // caching_price: 0.00000375, + // cached_price: 3e-7, + // output_price: 0.000015, + // max_output_tokens: 8192, + // context_window: 200000, + // supports_caching: true, + // description: + // "Anthropic's previous most intelligent model. High level of intelligence and capability. Excells in coding.", + // } + + const modelInfo: ModelInfo = { + maxTokens: rawModel.max_output_tokens, + contextWindow: rawModel.context_window, + supportsPromptCache: rawModel.supports_caching, + inputPrice: parseApiPrice(rawModel.input_price), + outputPrice: parseApiPrice(rawModel.output_price), + description: rawModel.description, + cacheWritesPrice: parseApiPrice(rawModel.caching_price), + cacheReadsPrice: parseApiPrice(rawModel.cached_price), + } + + switch (rawModel.id) { + case rawModel.id.startsWith("anthropic/claude-3-7-sonnet"): + modelInfo.supportsComputerUse = true + modelInfo.supportsImages = true + modelInfo.maxTokens = 16384 + break + case rawModel.id.startsWith("anthropic/claude-3-5-sonnet-20241022"): + modelInfo.supportsComputerUse = true + modelInfo.supportsImages = true + modelInfo.maxTokens = 8192 + break + case rawModel.id.startsWith("anthropic/"): + modelInfo.maxTokens = 8192 + break + default: + break + } + + models[rawModel.id] = modelInfo + } + } catch (error) { + console.error(`Error fetching Requesty models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`) + } + + return models +} diff --git a/src/api/providers/unbound.ts b/src/api/providers/unbound.ts index 0599ffa4436..5e3ad8843b3 100644 --- a/src/api/providers/unbound.ts +++ b/src/api/providers/unbound.ts @@ -1,9 +1,11 @@ import { Anthropic } from "@anthropic-ai/sdk" +import axios from "axios" import OpenAI from "openai" -import { ApiHandler, SingleCompletionHandler } from "../" + import { ApiHandlerOptions, ModelInfo, unboundDefaultModelId, unboundDefaultModelInfo } from "../../shared/api" import { convertToOpenAiMessages } from "../transform/openai-format" import { ApiStream, ApiStreamUsageChunk } from "../transform/stream" +import { ApiHandler, SingleCompletionHandler } from "../" interface UnboundUsage extends OpenAI.CompletionUsage { cache_creation_input_tokens?: number @@ -71,7 +73,7 @@ export class UnboundHandler implements ApiHandler, SingleCompletionHandler { let maxTokens: number | undefined if (this.getModel().id.startsWith("anthropic/")) { - maxTokens = 8_192 + maxTokens = this.getModel().info.maxTokens } const { data: completion, response } = await this.client.chat.completions @@ -150,7 +152,7 @@ export class UnboundHandler implements ApiHandler, SingleCompletionHandler { } if (this.getModel().id.startsWith("anthropic/")) { - requestOptions.max_tokens = 8192 + requestOptions.max_tokens = this.getModel().info.maxTokens } const response = await this.client.chat.completions.create(requestOptions) @@ -163,3 +165,46 @@ export class UnboundHandler implements ApiHandler, SingleCompletionHandler { } } } + +export async function getUnboundModels() { + const models: Record = {} + + try { + const response = await axios.get("https://api.getunbound.ai/models") + + if (response.data) { + const rawModels: Record = response.data + + for (const [modelId, model] of Object.entries(rawModels)) { + const modelInfo: ModelInfo = { + maxTokens: model?.maxTokens ? parseInt(model.maxTokens) : undefined, + contextWindow: model?.contextWindow ? parseInt(model.contextWindow) : 0, + supportsImages: model?.supportsImages ?? false, + supportsPromptCache: model?.supportsPromptCaching ?? false, + supportsComputerUse: model?.supportsComputerUse ?? false, + inputPrice: model?.inputTokenPrice ? parseFloat(model.inputTokenPrice) : undefined, + outputPrice: model?.outputTokenPrice ? parseFloat(model.outputTokenPrice) : undefined, + cacheWritesPrice: model?.cacheWritePrice ? parseFloat(model.cacheWritePrice) : undefined, + cacheReadsPrice: model?.cacheReadPrice ? parseFloat(model.cacheReadPrice) : undefined, + } + + switch (true) { + case modelId.startsWith("anthropic/claude-3-7-sonnet"): + modelInfo.maxTokens = 16384 + break + case modelId.startsWith("anthropic/"): + modelInfo.maxTokens = 8192 + break + default: + break + } + + models[modelId] = modelInfo + } + } + } catch (error) { + console.error(`Error fetching Unbound models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`) + } + + return models +} diff --git a/src/api/providers/vscode-lm.ts b/src/api/providers/vscode-lm.ts index e2bf8609aea..28e24231a28 100644 --- a/src/api/providers/vscode-lm.ts +++ b/src/api/providers/vscode-lm.ts @@ -1,5 +1,6 @@ import { Anthropic } from "@anthropic-ai/sdk" import * as vscode from "vscode" + import { ApiHandler, SingleCompletionHandler } from "../" import { calculateApiCost } from "../../utils/cost" import { ApiStream } from "../transform/stream" @@ -545,3 +546,15 @@ export class VsCodeLmHandler implements ApiHandler, SingleCompletionHandler { } } } + +export async function getVsCodeLmModels() { + try { + const models = await vscode.lm.selectChatModels({}) + return models || [] + } catch (error) { + console.error( + `Error fetching VS Code LM models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`, + ) + return [] + } +} diff --git a/src/api/transform/__tests__/bedrock-converse-format.test.ts b/src/api/transform/__tests__/bedrock-converse-format.test.ts index c46eb94a2e0..c56b8a07fc4 100644 --- a/src/api/transform/__tests__/bedrock-converse-format.test.ts +++ b/src/api/transform/__tests__/bedrock-converse-format.test.ts @@ -1,250 +1,167 @@ -import { convertToBedrockConverseMessages, convertToAnthropicMessage } from "../bedrock-converse-format" +// npx jest src/api/transform/__tests__/bedrock-converse-format.test.ts + +import { convertToBedrockConverseMessages } from "../bedrock-converse-format" import { Anthropic } from "@anthropic-ai/sdk" import { ContentBlock, ToolResultContentBlock } from "@aws-sdk/client-bedrock-runtime" -import { StreamEvent } from "../../providers/bedrock" - -describe("bedrock-converse-format", () => { - describe("convertToBedrockConverseMessages", () => { - test("converts simple text messages correctly", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { role: "user", content: "Hello" }, - { role: "assistant", content: "Hi there" }, - ] - - const result = convertToBedrockConverseMessages(messages) - - expect(result).toEqual([ - { - role: "user", - content: [{ text: "Hello" }], - }, - { - role: "assistant", - content: [{ text: "Hi there" }], - }, - ]) - }) - - test("converts messages with images correctly", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { - role: "user", - content: [ - { - type: "text", - text: "Look at this image:", - }, - { - type: "image", - source: { - type: "base64", - data: "SGVsbG8=", // "Hello" in base64 - media_type: "image/jpeg" as const, - }, - }, - ], - }, - ] - - const result = convertToBedrockConverseMessages(messages) - - if (!result[0] || !result[0].content) { - fail("Expected result to have content") - return - } - - expect(result[0].role).toBe("user") - expect(result[0].content).toHaveLength(2) - expect(result[0].content[0]).toEqual({ text: "Look at this image:" }) - - const imageBlock = result[0].content[1] as ContentBlock - if ("image" in imageBlock && imageBlock.image && imageBlock.image.source) { - expect(imageBlock.image.format).toBe("jpeg") - expect(imageBlock.image.source).toBeDefined() - expect(imageBlock.image.source.bytes).toBeDefined() - } else { - fail("Expected image block not found") - } - }) - - test("converts tool use messages correctly", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { - role: "assistant", - content: [ - { - type: "tool_use", - id: "test-id", - name: "read_file", - input: { - path: "test.txt", - }, - }, - ], - }, - ] - - const result = convertToBedrockConverseMessages(messages) - - if (!result[0] || !result[0].content) { - fail("Expected result to have content") - return - } - - expect(result[0].role).toBe("assistant") - const toolBlock = result[0].content[0] as ContentBlock - if ("toolUse" in toolBlock && toolBlock.toolUse) { - expect(toolBlock.toolUse).toEqual({ - toolUseId: "test-id", - name: "read_file", - input: "\n\ntest.txt\n\n", - }) - } else { - fail("Expected tool use block not found") - } - }) - - test("converts tool result messages correctly", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { - role: "assistant", - content: [ - { - type: "tool_result", - tool_use_id: "test-id", - content: [{ type: "text", text: "File contents here" }], - }, - ], - }, - ] - - const result = convertToBedrockConverseMessages(messages) - - if (!result[0] || !result[0].content) { - fail("Expected result to have content") - return - } - - expect(result[0].role).toBe("assistant") - const resultBlock = result[0].content[0] as ContentBlock - if ("toolResult" in resultBlock && resultBlock.toolResult) { - const expectedContent: ToolResultContentBlock[] = [{ text: "File contents here" }] - expect(resultBlock.toolResult).toEqual({ - toolUseId: "test-id", - content: expectedContent, - status: "success", - }) - } else { - fail("Expected tool result block not found") - } - }) - - test("handles text content correctly", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { - role: "user", - content: [ - { - type: "text", - text: "Hello world", - }, - ], - }, - ] - - const result = convertToBedrockConverseMessages(messages) - - if (!result[0] || !result[0].content) { - fail("Expected result to have content") - return - } - - expect(result[0].role).toBe("user") - expect(result[0].content).toHaveLength(1) - const textBlock = result[0].content[0] as ContentBlock - expect(textBlock).toEqual({ text: "Hello world" }) - }) + +describe("convertToBedrockConverseMessages", () => { + test("converts simple text messages correctly", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "Hello" }, + { role: "assistant", content: "Hi there" }, + ] + + const result = convertToBedrockConverseMessages(messages) + + expect(result).toEqual([ + { + role: "user", + content: [{ text: "Hello" }], + }, + { + role: "assistant", + content: [{ text: "Hi there" }], + }, + ]) }) - describe("convertToAnthropicMessage", () => { - test("converts metadata events correctly", () => { - const event: StreamEvent = { - metadata: { - usage: { - inputTokens: 10, - outputTokens: 20, + test("converts messages with images correctly", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ + { + type: "text", + text: "Look at this image:", }, - }, - } - - const result = convertToAnthropicMessage(event, "test-model") + { + type: "image", + source: { + type: "base64", + data: "SGVsbG8=", // "Hello" in base64 + media_type: "image/jpeg" as const, + }, + }, + ], + }, + ] + + const result = convertToBedrockConverseMessages(messages) + + if (!result[0] || !result[0].content) { + fail("Expected result to have content") + return + } + + expect(result[0].role).toBe("user") + expect(result[0].content).toHaveLength(2) + expect(result[0].content[0]).toEqual({ text: "Look at this image:" }) + + const imageBlock = result[0].content[1] as ContentBlock + if ("image" in imageBlock && imageBlock.image && imageBlock.image.source) { + expect(imageBlock.image.format).toBe("jpeg") + expect(imageBlock.image.source).toBeDefined() + expect(imageBlock.image.source.bytes).toBeDefined() + } else { + fail("Expected image block not found") + } + }) - expect(result).toEqual({ - id: "", - type: "message", + test("converts tool use messages correctly", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "assistant", - model: "test-model", - usage: { - input_tokens: 10, - output_tokens: 20, - }, - }) - }) - - test("converts content block start events correctly", () => { - const event: StreamEvent = { - contentBlockStart: { - start: { - text: "Hello", + content: [ + { + type: "tool_use", + id: "test-id", + name: "read_file", + input: { + path: "test.txt", + }, }, - }, - } - - const result = convertToAnthropicMessage(event, "test-model") + ], + }, + ] + + const result = convertToBedrockConverseMessages(messages) + + if (!result[0] || !result[0].content) { + fail("Expected result to have content") + return + } + + expect(result[0].role).toBe("assistant") + const toolBlock = result[0].content[0] as ContentBlock + if ("toolUse" in toolBlock && toolBlock.toolUse) { + expect(toolBlock.toolUse).toEqual({ + toolUseId: "test-id", + name: "read_file", + input: "\n\ntest.txt\n\n", + }) + } else { + fail("Expected tool use block not found") + } + }) - expect(result).toEqual({ - type: "message", + test("converts tool result messages correctly", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "assistant", - content: [{ type: "text", text: "Hello" }], - model: "test-model", + content: [ + { + type: "tool_result", + tool_use_id: "test-id", + content: [{ type: "text", text: "File contents here" }], + }, + ], + }, + ] + + const result = convertToBedrockConverseMessages(messages) + + if (!result[0] || !result[0].content) { + fail("Expected result to have content") + return + } + + expect(result[0].role).toBe("assistant") + const resultBlock = result[0].content[0] as ContentBlock + if ("toolResult" in resultBlock && resultBlock.toolResult) { + const expectedContent: ToolResultContentBlock[] = [{ text: "File contents here" }] + expect(resultBlock.toolResult).toEqual({ + toolUseId: "test-id", + content: expectedContent, + status: "success", }) - }) + } else { + fail("Expected tool result block not found") + } + }) - test("converts content block delta events correctly", () => { - const event: StreamEvent = { - contentBlockDelta: { - delta: { - text: " world", + test("handles text content correctly", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ + { + type: "text", + text: "Hello world", }, - }, - } + ], + }, + ] - const result = convertToAnthropicMessage(event, "test-model") + const result = convertToBedrockConverseMessages(messages) - expect(result).toEqual({ - type: "message", - role: "assistant", - content: [{ type: "text", text: " world" }], - model: "test-model", - }) - }) - - test("converts message stop events correctly", () => { - const event: StreamEvent = { - messageStop: { - stopReason: "end_turn" as const, - }, - } + if (!result[0] || !result[0].content) { + fail("Expected result to have content") + return + } - const result = convertToAnthropicMessage(event, "test-model") - - expect(result).toEqual({ - type: "message", - role: "assistant", - stop_reason: "end_turn", - stop_sequence: null, - model: "test-model", - }) - }) + expect(result[0].role).toBe("user") + expect(result[0].content).toHaveLength(1) + const textBlock = result[0].content[0] as ContentBlock + expect(textBlock).toEqual({ text: "Hello world" }) }) }) diff --git a/src/api/transform/__tests__/gemini-format.test.ts b/src/api/transform/__tests__/gemini-format.test.ts new file mode 100644 index 00000000000..fe6b2564047 --- /dev/null +++ b/src/api/transform/__tests__/gemini-format.test.ts @@ -0,0 +1,338 @@ +// npx jest src/api/transform/__tests__/gemini-format.test.ts + +import { Anthropic } from "@anthropic-ai/sdk" + +import { convertAnthropicMessageToGemini } from "../gemini-format" + +describe("convertAnthropicMessageToGemini", () => { + it("should convert a simple text message", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: "Hello, world!", + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "user", + parts: [{ text: "Hello, world!" }], + }) + }) + + it("should convert assistant role to model role", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "assistant", + content: "I'm an assistant", + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "model", + parts: [{ text: "I'm an assistant" }], + }) + }) + + it("should convert a message with text blocks", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { type: "text", text: "First paragraph" }, + { type: "text", text: "Second paragraph" }, + ], + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "user", + parts: [{ text: "First paragraph" }, { text: "Second paragraph" }], + }) + }) + + it("should convert a message with an image", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { type: "text", text: "Check out this image:" }, + { + type: "image", + source: { + type: "base64", + media_type: "image/jpeg", + data: "base64encodeddata", + }, + }, + ], + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "user", + parts: [ + { text: "Check out this image:" }, + { + inlineData: { + data: "base64encodeddata", + mimeType: "image/jpeg", + }, + }, + ], + }) + }) + + it("should throw an error for unsupported image source type", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { + type: "image", + source: { + type: "url", // Not supported + url: "https://example.com/image.jpg", + } as any, + }, + ], + } + + expect(() => convertAnthropicMessageToGemini(anthropicMessage)).toThrow("Unsupported image source type") + }) + + it("should convert a message with tool use", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "assistant", + content: [ + { type: "text", text: "Let me calculate that for you." }, + { + type: "tool_use", + id: "calc-123", + name: "calculator", + input: { operation: "add", numbers: [2, 3] }, + }, + ], + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "model", + parts: [ + { text: "Let me calculate that for you." }, + { + functionCall: { + name: "calculator", + args: { operation: "add", numbers: [2, 3] }, + }, + }, + ], + }) + }) + + it("should convert a message with tool result as string", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { type: "text", text: "Here's the result:" }, + { + type: "tool_result", + tool_use_id: "calculator-123", + content: "The result is 5", + }, + ], + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "user", + parts: [ + { text: "Here's the result:" }, + { + functionResponse: { + name: "calculator", + response: { + name: "calculator", + content: "The result is 5", + }, + }, + }, + ], + }) + }) + + it("should handle empty tool result content", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { + type: "tool_result", + tool_use_id: "calculator-123", + content: null as any, // Empty content + }, + ], + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + // Should skip the empty tool result + expect(result).toEqual({ + role: "user", + parts: [], + }) + }) + + it("should convert a message with tool result as array with text only", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { + type: "tool_result", + tool_use_id: "search-123", + content: [ + { type: "text", text: "First result" }, + { type: "text", text: "Second result" }, + ], + }, + ], + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "user", + parts: [ + { + functionResponse: { + name: "search", + response: { + name: "search", + content: "First result\n\nSecond result", + }, + }, + }, + ], + }) + }) + + it("should convert a message with tool result as array with text and images", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { + type: "tool_result", + tool_use_id: "search-123", + content: [ + { type: "text", text: "Search results:" }, + { + type: "image", + source: { + type: "base64", + media_type: "image/png", + data: "image1data", + }, + }, + { + type: "image", + source: { + type: "base64", + media_type: "image/jpeg", + data: "image2data", + }, + }, + ], + }, + ], + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "user", + parts: [ + { + functionResponse: { + name: "search", + response: { + name: "search", + content: "Search results:\n\n(See next part for image)", + }, + }, + }, + { + inlineData: { + data: "image1data", + mimeType: "image/png", + }, + }, + { + inlineData: { + data: "image2data", + mimeType: "image/jpeg", + }, + }, + ], + }) + }) + + it("should convert a message with tool result containing only images", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { + type: "tool_result", + tool_use_id: "imagesearch-123", + content: [ + { + type: "image", + source: { + type: "base64", + media_type: "image/png", + data: "onlyimagedata", + }, + }, + ], + }, + ], + } + + const result = convertAnthropicMessageToGemini(anthropicMessage) + + expect(result).toEqual({ + role: "user", + parts: [ + { + functionResponse: { + name: "imagesearch", + response: { + name: "imagesearch", + content: "\n\n(See next part for image)", + }, + }, + }, + { + inlineData: { + data: "onlyimagedata", + mimeType: "image/png", + }, + }, + ], + }) + }) + + it("should throw an error for unsupported content block type", () => { + const anthropicMessage: Anthropic.Messages.MessageParam = { + role: "user", + content: [ + { + type: "unknown_type", // Unsupported type + data: "some data", + } as any, + ], + } + + expect(() => convertAnthropicMessageToGemini(anthropicMessage)).toThrow( + "Unsupported content block type: unknown_type", + ) + }) +}) diff --git a/src/api/transform/__tests__/mistral-format.test.ts b/src/api/transform/__tests__/mistral-format.test.ts new file mode 100644 index 00000000000..b8e9412edaf --- /dev/null +++ b/src/api/transform/__tests__/mistral-format.test.ts @@ -0,0 +1,301 @@ +// npx jest src/api/transform/__tests__/mistral-format.test.ts + +import { Anthropic } from "@anthropic-ai/sdk" + +import { convertToMistralMessages } from "../mistral-format" + +describe("convertToMistralMessages", () => { + it("should convert simple text messages for user and assistant roles", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: "Hello", + }, + { + role: "assistant", + content: "Hi there!", + }, + ] + + const mistralMessages = convertToMistralMessages(anthropicMessages) + expect(mistralMessages).toHaveLength(2) + expect(mistralMessages[0]).toEqual({ + role: "user", + content: "Hello", + }) + expect(mistralMessages[1]).toEqual({ + role: "assistant", + content: "Hi there!", + }) + }) + + it("should handle user messages with image content", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ + { + type: "text", + text: "What is in this image?", + }, + { + type: "image", + source: { + type: "base64", + media_type: "image/jpeg", + data: "base64data", + }, + }, + ], + }, + ] + + const mistralMessages = convertToMistralMessages(anthropicMessages) + expect(mistralMessages).toHaveLength(1) + expect(mistralMessages[0].role).toBe("user") + + const content = mistralMessages[0].content as Array<{ + type: string + text?: string + imageUrl?: { url: string } + }> + + expect(Array.isArray(content)).toBe(true) + expect(content).toHaveLength(2) + expect(content[0]).toEqual({ type: "text", text: "What is in this image?" }) + expect(content[1]).toEqual({ + type: "image_url", + imageUrl: { url: "data:image/jpeg;base64,base64data" }, + }) + }) + + it("should handle user messages with only tool results", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ + { + type: "tool_result", + tool_use_id: "weather-123", + content: "Current temperature in London: 20°C", + }, + ], + }, + ] + + // Based on the implementation, tool results without accompanying text/image + // don't generate any messages + const mistralMessages = convertToMistralMessages(anthropicMessages) + expect(mistralMessages).toHaveLength(0) + }) + + it("should handle user messages with mixed content (text, image, and tool results)", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ + { + type: "text", + text: "Here's the weather data and an image:", + }, + { + type: "image", + source: { + type: "base64", + media_type: "image/png", + data: "imagedata123", + }, + }, + { + type: "tool_result", + tool_use_id: "weather-123", + content: "Current temperature in London: 20°C", + }, + ], + }, + ] + + const mistralMessages = convertToMistralMessages(anthropicMessages) + // Based on the implementation, only the text and image content is included + // Tool results are not converted to separate messages + expect(mistralMessages).toHaveLength(1) + + // Message should be the user message with text and image + expect(mistralMessages[0].role).toBe("user") + const userContent = mistralMessages[0].content as Array<{ + type: string + text?: string + imageUrl?: { url: string } + }> + expect(Array.isArray(userContent)).toBe(true) + expect(userContent).toHaveLength(2) + expect(userContent[0]).toEqual({ type: "text", text: "Here's the weather data and an image:" }) + expect(userContent[1]).toEqual({ + type: "image_url", + imageUrl: { url: "data:image/png;base64,imagedata123" }, + }) + }) + + it("should handle assistant messages with text content", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "assistant", + content: [ + { + type: "text", + text: "I'll help you with that question.", + }, + ], + }, + ] + + const mistralMessages = convertToMistralMessages(anthropicMessages) + expect(mistralMessages).toHaveLength(1) + expect(mistralMessages[0].role).toBe("assistant") + expect(mistralMessages[0].content).toBe("I'll help you with that question.") + }) + + it("should handle assistant messages with tool use", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "assistant", + content: [ + { + type: "text", + text: "Let me check the weather for you.", + }, + { + type: "tool_use", + id: "weather-123", + name: "get_weather", + input: { city: "London" }, + }, + ], + }, + ] + + const mistralMessages = convertToMistralMessages(anthropicMessages) + expect(mistralMessages).toHaveLength(1) + expect(mistralMessages[0].role).toBe("assistant") + expect(mistralMessages[0].content).toBe("Let me check the weather for you.") + }) + + it("should handle multiple text blocks in assistant messages", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "assistant", + content: [ + { + type: "text", + text: "First paragraph of information.", + }, + { + type: "text", + text: "Second paragraph with more details.", + }, + ], + }, + ] + + const mistralMessages = convertToMistralMessages(anthropicMessages) + expect(mistralMessages).toHaveLength(1) + expect(mistralMessages[0].role).toBe("assistant") + expect(mistralMessages[0].content).toBe("First paragraph of information.\nSecond paragraph with more details.") + }) + + it("should handle a conversation with mixed message types", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ + { + type: "text", + text: "What's in this image?", + }, + { + type: "image", + source: { + type: "base64", + media_type: "image/jpeg", + data: "imagedata", + }, + }, + ], + }, + { + role: "assistant", + content: [ + { + type: "text", + text: "This image shows a landscape with mountains.", + }, + { + type: "tool_use", + id: "search-123", + name: "search_info", + input: { query: "mountain types" }, + }, + ], + }, + { + role: "user", + content: [ + { + type: "tool_result", + tool_use_id: "search-123", + content: "Found information about different mountain types.", + }, + ], + }, + { + role: "assistant", + content: "Based on the search results, I can tell you more about the mountains in the image.", + }, + ] + + const mistralMessages = convertToMistralMessages(anthropicMessages) + // Based on the implementation, user messages with only tool results don't generate messages + expect(mistralMessages).toHaveLength(3) + + // User message with image + expect(mistralMessages[0].role).toBe("user") + const userContent = mistralMessages[0].content as Array<{ + type: string + text?: string + imageUrl?: { url: string } + }> + expect(Array.isArray(userContent)).toBe(true) + expect(userContent).toHaveLength(2) + + // Assistant message with text (tool_use is not included in Mistral format) + expect(mistralMessages[1].role).toBe("assistant") + expect(mistralMessages[1].content).toBe("This image shows a landscape with mountains.") + + // Final assistant message + expect(mistralMessages[2]).toEqual({ + role: "assistant", + content: "Based on the search results, I can tell you more about the mountains in the image.", + }) + }) + + it("should handle empty content in assistant messages", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "assistant", + content: [ + { + type: "tool_use", + id: "search-123", + name: "search_info", + input: { query: "test query" }, + }, + ], + }, + ] + + const mistralMessages = convertToMistralMessages(anthropicMessages) + expect(mistralMessages).toHaveLength(1) + expect(mistralMessages[0].role).toBe("assistant") + expect(mistralMessages[0].content).toBeUndefined() + }) +}) diff --git a/src/api/transform/__tests__/openai-format.test.ts b/src/api/transform/__tests__/openai-format.test.ts index f37d369d701..f0aa5e1a563 100644 --- a/src/api/transform/__tests__/openai-format.test.ts +++ b/src/api/transform/__tests__/openai-format.test.ts @@ -1,275 +1,131 @@ -import { convertToOpenAiMessages, convertToAnthropicMessage } from "../openai-format" +// npx jest src/api/transform/__tests__/openai-format.test.ts + import { Anthropic } from "@anthropic-ai/sdk" import OpenAI from "openai" -type PartialChatCompletion = Omit & { - choices: Array< - Partial & { - message: OpenAI.Chat.Completions.ChatCompletion.Choice["message"] - finish_reason: string - index: number - } - > -} - -describe("OpenAI Format Transformations", () => { - describe("convertToOpenAiMessages", () => { - it("should convert simple text messages", () => { - const anthropicMessages: Anthropic.Messages.MessageParam[] = [ - { - role: "user", - content: "Hello", - }, - { - role: "assistant", - content: "Hi there!", - }, - ] +import { convertToOpenAiMessages } from "../openai-format" - const openAiMessages = convertToOpenAiMessages(anthropicMessages) - expect(openAiMessages).toHaveLength(2) - expect(openAiMessages[0]).toEqual({ +describe("convertToOpenAiMessages", () => { + it("should convert simple text messages", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "Hello", - }) - expect(openAiMessages[1]).toEqual({ + }, + { role: "assistant", content: "Hi there!", - }) - }) - - it("should handle messages with image content", () => { - const anthropicMessages: Anthropic.Messages.MessageParam[] = [ - { - role: "user", - content: [ - { - type: "text", - text: "What is in this image?", - }, - { - type: "image", - source: { - type: "base64", - media_type: "image/jpeg", - data: "base64data", - }, - }, - ], - }, - ] - - const openAiMessages = convertToOpenAiMessages(anthropicMessages) - expect(openAiMessages).toHaveLength(1) - expect(openAiMessages[0].role).toBe("user") - - const content = openAiMessages[0].content as Array<{ - type: string - text?: string - image_url?: { url: string } - }> - - expect(Array.isArray(content)).toBe(true) - expect(content).toHaveLength(2) - expect(content[0]).toEqual({ type: "text", text: "What is in this image?" }) - expect(content[1]).toEqual({ - type: "image_url", - image_url: { url: "data:image/jpeg;base64,base64data" }, - }) + }, + ] + + const openAiMessages = convertToOpenAiMessages(anthropicMessages) + expect(openAiMessages).toHaveLength(2) + expect(openAiMessages[0]).toEqual({ + role: "user", + content: "Hello", }) - - it("should handle assistant messages with tool use", () => { - const anthropicMessages: Anthropic.Messages.MessageParam[] = [ - { - role: "assistant", - content: [ - { - type: "text", - text: "Let me check the weather.", - }, - { - type: "tool_use", - id: "weather-123", - name: "get_weather", - input: { city: "London" }, - }, - ], - }, - ] - - const openAiMessages = convertToOpenAiMessages(anthropicMessages) - expect(openAiMessages).toHaveLength(1) - - const assistantMessage = openAiMessages[0] as OpenAI.Chat.ChatCompletionAssistantMessageParam - expect(assistantMessage.role).toBe("assistant") - expect(assistantMessage.content).toBe("Let me check the weather.") - expect(assistantMessage.tool_calls).toHaveLength(1) - expect(assistantMessage.tool_calls![0]).toEqual({ - id: "weather-123", - type: "function", - function: { - name: "get_weather", - arguments: JSON.stringify({ city: "London" }), - }, - }) - }) - - it("should handle user messages with tool results", () => { - const anthropicMessages: Anthropic.Messages.MessageParam[] = [ - { - role: "user", - content: [ - { - type: "tool_result", - tool_use_id: "weather-123", - content: "Current temperature in London: 20°C", - }, - ], - }, - ] - - const openAiMessages = convertToOpenAiMessages(anthropicMessages) - expect(openAiMessages).toHaveLength(1) - - const toolMessage = openAiMessages[0] as OpenAI.Chat.ChatCompletionToolMessageParam - expect(toolMessage.role).toBe("tool") - expect(toolMessage.tool_call_id).toBe("weather-123") - expect(toolMessage.content).toBe("Current temperature in London: 20°C") + expect(openAiMessages[1]).toEqual({ + role: "assistant", + content: "Hi there!", }) }) - describe("convertToAnthropicMessage", () => { - it("should convert simple completion", () => { - const openAiCompletion: PartialChatCompletion = { - id: "completion-123", - model: "gpt-4", - choices: [ + it("should handle messages with image content", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ + { + type: "text", + text: "What is in this image?", + }, { - message: { - role: "assistant", - content: "Hello there!", - refusal: null, + type: "image", + source: { + type: "base64", + media_type: "image/jpeg", + data: "base64data", }, - finish_reason: "stop", - index: 0, }, ], - usage: { - prompt_tokens: 10, - completion_tokens: 5, - total_tokens: 15, - }, - created: 123456789, - object: "chat.completion", - } - - const anthropicMessage = convertToAnthropicMessage( - openAiCompletion as OpenAI.Chat.Completions.ChatCompletion, - ) - expect(anthropicMessage.id).toBe("completion-123") - expect(anthropicMessage.role).toBe("assistant") - expect(anthropicMessage.content).toHaveLength(1) - expect(anthropicMessage.content[0]).toEqual({ - type: "text", - text: "Hello there!", - }) - expect(anthropicMessage.stop_reason).toBe("end_turn") - expect(anthropicMessage.usage).toEqual({ - input_tokens: 10, - output_tokens: 5, - }) + }, + ] + + const openAiMessages = convertToOpenAiMessages(anthropicMessages) + expect(openAiMessages).toHaveLength(1) + expect(openAiMessages[0].role).toBe("user") + + const content = openAiMessages[0].content as Array<{ + type: string + text?: string + image_url?: { url: string } + }> + + expect(Array.isArray(content)).toBe(true) + expect(content).toHaveLength(2) + expect(content[0]).toEqual({ type: "text", text: "What is in this image?" }) + expect(content[1]).toEqual({ + type: "image_url", + image_url: { url: "data:image/jpeg;base64,base64data" }, }) + }) - it("should handle tool calls in completion", () => { - const openAiCompletion: PartialChatCompletion = { - id: "completion-123", - model: "gpt-4", - choices: [ + it("should handle assistant messages with tool use", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "assistant", + content: [ { - message: { - role: "assistant", - content: "Let me check the weather.", - tool_calls: [ - { - id: "weather-123", - type: "function", - function: { - name: "get_weather", - arguments: '{"city":"London"}', - }, - }, - ], - refusal: null, - }, - finish_reason: "tool_calls", - index: 0, + type: "text", + text: "Let me check the weather.", + }, + { + type: "tool_use", + id: "weather-123", + name: "get_weather", + input: { city: "London" }, }, ], - usage: { - prompt_tokens: 15, - completion_tokens: 8, - total_tokens: 23, - }, - created: 123456789, - object: "chat.completion", - } - - const anthropicMessage = convertToAnthropicMessage( - openAiCompletion as OpenAI.Chat.Completions.ChatCompletion, - ) - expect(anthropicMessage.content).toHaveLength(2) - expect(anthropicMessage.content[0]).toEqual({ - type: "text", - text: "Let me check the weather.", - }) - expect(anthropicMessage.content[1]).toEqual({ - type: "tool_use", - id: "weather-123", + }, + ] + + const openAiMessages = convertToOpenAiMessages(anthropicMessages) + expect(openAiMessages).toHaveLength(1) + + const assistantMessage = openAiMessages[0] as OpenAI.Chat.ChatCompletionAssistantMessageParam + expect(assistantMessage.role).toBe("assistant") + expect(assistantMessage.content).toBe("Let me check the weather.") + expect(assistantMessage.tool_calls).toHaveLength(1) + expect(assistantMessage.tool_calls![0]).toEqual({ + id: "weather-123", + type: "function", + function: { name: "get_weather", - input: { city: "London" }, - }) - expect(anthropicMessage.stop_reason).toBe("tool_use") + arguments: JSON.stringify({ city: "London" }), + }, }) + }) - it("should handle invalid tool call arguments", () => { - const openAiCompletion: PartialChatCompletion = { - id: "completion-123", - model: "gpt-4", - choices: [ + it("should handle user messages with tool results", () => { + const anthropicMessages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ { - message: { - role: "assistant", - content: "Testing invalid arguments", - tool_calls: [ - { - id: "test-123", - type: "function", - function: { - name: "test_function", - arguments: "invalid json", - }, - }, - ], - refusal: null, - }, - finish_reason: "tool_calls", - index: 0, + type: "tool_result", + tool_use_id: "weather-123", + content: "Current temperature in London: 20°C", }, ], - created: 123456789, - object: "chat.completion", - } + }, + ] - const anthropicMessage = convertToAnthropicMessage( - openAiCompletion as OpenAI.Chat.Completions.ChatCompletion, - ) - expect(anthropicMessage.content).toHaveLength(2) - expect(anthropicMessage.content[1]).toEqual({ - type: "tool_use", - id: "test-123", - name: "test_function", - input: {}, // Should default to empty object for invalid JSON - }) - }) + const openAiMessages = convertToOpenAiMessages(anthropicMessages) + expect(openAiMessages).toHaveLength(1) + + const toolMessage = openAiMessages[0] as OpenAI.Chat.ChatCompletionToolMessageParam + expect(toolMessage.role).toBe("tool") + expect(toolMessage.tool_call_id).toBe("weather-123") + expect(toolMessage.content).toBe("Current temperature in London: 20°C") }) }) diff --git a/src/api/transform/__tests__/vscode-lm-format.test.ts b/src/api/transform/__tests__/vscode-lm-format.test.ts index b27097fd17e..eea8de7c9a5 100644 --- a/src/api/transform/__tests__/vscode-lm-format.test.ts +++ b/src/api/transform/__tests__/vscode-lm-format.test.ts @@ -1,6 +1,8 @@ +// npx jest src/api/transform/__tests__/vscode-lm-format.test.ts + import { Anthropic } from "@anthropic-ai/sdk" -import * as vscode from "vscode" -import { convertToVsCodeLmMessages, convertToAnthropicRole, convertToAnthropicMessage } from "../vscode-lm-format" + +import { convertToVsCodeLmMessages, convertToAnthropicRole } from "../vscode-lm-format" // Mock crypto const mockCrypto = { @@ -27,14 +29,6 @@ interface MockLanguageModelToolResultPart { parts: MockLanguageModelTextPart[] } -type MockMessageContent = MockLanguageModelTextPart | MockLanguageModelToolCallPart | MockLanguageModelToolResultPart - -interface MockLanguageModelChatMessage { - role: string - name?: string - content: MockMessageContent[] -} - // Mock vscode namespace jest.mock("vscode", () => { const LanguageModelChatMessageRole = { @@ -84,173 +78,115 @@ jest.mock("vscode", () => { } }) -describe("vscode-lm-format", () => { - describe("convertToVsCodeLmMessages", () => { - it("should convert simple string messages", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { role: "user", content: "Hello" }, - { role: "assistant", content: "Hi there" }, - ] - - const result = convertToVsCodeLmMessages(messages) - - expect(result).toHaveLength(2) - expect(result[0].role).toBe("user") - expect((result[0].content[0] as MockLanguageModelTextPart).value).toBe("Hello") - expect(result[1].role).toBe("assistant") - expect((result[1].content[0] as MockLanguageModelTextPart).value).toBe("Hi there") - }) - - it("should handle complex user messages with tool results", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { - role: "user", - content: [ - { type: "text", text: "Here is the result:" }, - { - type: "tool_result", - tool_use_id: "tool-1", - content: "Tool output", - }, - ], - }, - ] - - const result = convertToVsCodeLmMessages(messages) +describe("convertToVsCodeLmMessages", () => { + it("should convert simple string messages", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "Hello" }, + { role: "assistant", content: "Hi there" }, + ] - expect(result).toHaveLength(1) - expect(result[0].role).toBe("user") - expect(result[0].content).toHaveLength(2) - const [toolResult, textContent] = result[0].content as [ - MockLanguageModelToolResultPart, - MockLanguageModelTextPart, - ] - expect(toolResult.type).toBe("tool_result") - expect(textContent.type).toBe("text") - }) + const result = convertToVsCodeLmMessages(messages) - it("should handle complex assistant messages with tool calls", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { - role: "assistant", - content: [ - { type: "text", text: "Let me help you with that." }, - { - type: "tool_use", - id: "tool-1", - name: "calculator", - input: { operation: "add", numbers: [2, 2] }, - }, - ], - }, - ] - - const result = convertToVsCodeLmMessages(messages) - - expect(result).toHaveLength(1) - expect(result[0].role).toBe("assistant") - expect(result[0].content).toHaveLength(2) - const [toolCall, textContent] = result[0].content as [ - MockLanguageModelToolCallPart, - MockLanguageModelTextPart, - ] - expect(toolCall.type).toBe("tool_call") - expect(textContent.type).toBe("text") - }) - - it("should handle image blocks with appropriate placeholders", () => { - const messages: Anthropic.Messages.MessageParam[] = [ - { - role: "user", - content: [ - { type: "text", text: "Look at this:" }, - { - type: "image", - source: { - type: "base64", - media_type: "image/png", - data: "base64data", - }, - }, - ], - }, - ] - - const result = convertToVsCodeLmMessages(messages) - - expect(result).toHaveLength(1) - const imagePlaceholder = result[0].content[1] as MockLanguageModelTextPart - expect(imagePlaceholder.value).toContain("[Image (base64): image/png not supported by VSCode LM API]") - }) + expect(result).toHaveLength(2) + expect(result[0].role).toBe("user") + expect((result[0].content[0] as MockLanguageModelTextPart).value).toBe("Hello") + expect(result[1].role).toBe("assistant") + expect((result[1].content[0] as MockLanguageModelTextPart).value).toBe("Hi there") }) - describe("convertToAnthropicRole", () => { - it("should convert assistant role correctly", () => { - const result = convertToAnthropicRole("assistant" as any) - expect(result).toBe("assistant") - }) - - it("should convert user role correctly", () => { - const result = convertToAnthropicRole("user" as any) - expect(result).toBe("user") - }) - - it("should return null for unknown roles", () => { - const result = convertToAnthropicRole("unknown" as any) - expect(result).toBeNull() - }) + it("should handle complex user messages with tool results", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", + content: [ + { type: "text", text: "Here is the result:" }, + { + type: "tool_result", + tool_use_id: "tool-1", + content: "Tool output", + }, + ], + }, + ] + + const result = convertToVsCodeLmMessages(messages) + + expect(result).toHaveLength(1) + expect(result[0].role).toBe("user") + expect(result[0].content).toHaveLength(2) + const [toolResult, textContent] = result[0].content as [ + MockLanguageModelToolResultPart, + MockLanguageModelTextPart, + ] + expect(toolResult.type).toBe("tool_result") + expect(textContent.type).toBe("text") }) - describe("convertToAnthropicMessage", () => { - it("should convert assistant message with text content", async () => { - const vsCodeMessage = { + it("should handle complex assistant messages with tool calls", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "assistant", - name: "assistant", - content: [new vscode.LanguageModelTextPart("Hello")], - } + content: [ + { type: "text", text: "Let me help you with that." }, + { + type: "tool_use", + id: "tool-1", + name: "calculator", + input: { operation: "add", numbers: [2, 2] }, + }, + ], + }, + ] - const result = await convertToAnthropicMessage(vsCodeMessage as any) + const result = convertToVsCodeLmMessages(messages) - expect(result.role).toBe("assistant") - expect(result.content).toHaveLength(1) - expect(result.content[0]).toEqual({ - type: "text", - text: "Hello", - }) - expect(result.id).toBe("test-uuid") - }) + expect(result).toHaveLength(1) + expect(result[0].role).toBe("assistant") + expect(result[0].content).toHaveLength(2) + const [toolCall, textContent] = result[0].content as [MockLanguageModelToolCallPart, MockLanguageModelTextPart] + expect(toolCall.type).toBe("tool_call") + expect(textContent.type).toBe("text") + }) - it("should convert assistant message with tool calls", async () => { - const vsCodeMessage = { - role: "assistant", - name: "assistant", + it("should handle image blocks with appropriate placeholders", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { + role: "user", content: [ - new vscode.LanguageModelToolCallPart("call-1", "calculator", { operation: "add", numbers: [2, 2] }), + { type: "text", text: "Look at this:" }, + { + type: "image", + source: { + type: "base64", + media_type: "image/png", + data: "base64data", + }, + }, ], - } + }, + ] - const result = await convertToAnthropicMessage(vsCodeMessage as any) + const result = convertToVsCodeLmMessages(messages) - expect(result.content).toHaveLength(1) - expect(result.content[0]).toEqual({ - type: "tool_use", - id: "call-1", - name: "calculator", - input: { operation: "add", numbers: [2, 2] }, - }) - expect(result.id).toBe("test-uuid") - }) + expect(result).toHaveLength(1) + const imagePlaceholder = result[0].content[1] as MockLanguageModelTextPart + expect(imagePlaceholder.value).toContain("[Image (base64): image/png not supported by VSCode LM API]") + }) +}) - it("should throw error for non-assistant messages", async () => { - const vsCodeMessage = { - role: "user", - name: "user", - content: [new vscode.LanguageModelTextPart("Hello")], - } +describe("convertToAnthropicRole", () => { + it("should convert assistant role correctly", () => { + const result = convertToAnthropicRole("assistant" as any) + expect(result).toBe("assistant") + }) + + it("should convert user role correctly", () => { + const result = convertToAnthropicRole("user" as any) + expect(result).toBe("user") + }) - await expect(convertToAnthropicMessage(vsCodeMessage as any)).rejects.toThrow( - "Roo Code : Only assistant messages are supported.", - ) - }) + it("should return null for unknown roles", () => { + const result = convertToAnthropicRole("unknown" as any) + expect(result).toBeNull() }) }) diff --git a/src/api/transform/bedrock-converse-format.ts b/src/api/transform/bedrock-converse-format.ts index 07529db1bc0..68d21e4d5bc 100644 --- a/src/api/transform/bedrock-converse-format.ts +++ b/src/api/transform/bedrock-converse-format.ts @@ -1,9 +1,7 @@ import { Anthropic } from "@anthropic-ai/sdk" -import { MessageContent } from "../../shared/api" import { ConversationRole, Message, ContentBlock } from "@aws-sdk/client-bedrock-runtime" -// Import StreamEvent type from bedrock.ts -import { StreamEvent } from "../providers/bedrock" +import { MessageContent } from "../../shared/api" /** * Convert Anthropic messages to Bedrock Converse format @@ -175,49 +173,3 @@ export function convertToBedrockConverseMessages(anthropicMessages: Anthropic.Me } }) } - -/** - * Convert Bedrock Converse stream events to Anthropic message format - */ -export function convertToAnthropicMessage( - streamEvent: StreamEvent, - modelId: string, -): Partial { - // Handle metadata events - if (streamEvent.metadata?.usage) { - return { - id: "", // Bedrock doesn't provide message IDs - type: "message", - role: "assistant", - model: modelId, - usage: { - input_tokens: streamEvent.metadata.usage.inputTokens || 0, - output_tokens: streamEvent.metadata.usage.outputTokens || 0, - }, - } - } - - // Handle content blocks - const text = streamEvent.contentBlockStart?.start?.text || streamEvent.contentBlockDelta?.delta?.text - if (text !== undefined) { - return { - type: "message", - role: "assistant", - content: [{ type: "text", text: text }], - model: modelId, - } - } - - // Handle message stop - if (streamEvent.messageStop) { - return { - type: "message", - role: "assistant", - stop_reason: streamEvent.messageStop.stopReason || null, - stop_sequence: null, - model: modelId, - } - } - - return {} -} diff --git a/src/api/transform/gemini-format.ts b/src/api/transform/gemini-format.ts index 935e47147aa..c8fc80d769d 100644 --- a/src/api/transform/gemini-format.ts +++ b/src/api/transform/gemini-format.ts @@ -1,29 +1,11 @@ import { Anthropic } from "@anthropic-ai/sdk" -import { - Content, - EnhancedGenerateContentResponse, - FunctionCallPart, - FunctionDeclaration, - FunctionResponsePart, - InlineDataPart, - Part, - SchemaType, - TextPart, -} from "@google/generative-ai" +import { Content, FunctionCallPart, FunctionResponsePart, InlineDataPart, Part, TextPart } from "@google/generative-ai" -export function convertAnthropicContentToGemini( - content: - | string - | Array< - | Anthropic.Messages.TextBlockParam - | Anthropic.Messages.ImageBlockParam - | Anthropic.Messages.ToolUseBlockParam - | Anthropic.Messages.ToolResultBlockParam - >, -): Part[] { +function convertAnthropicContentToGemini(content: Anthropic.Messages.MessageParam["content"]): Part[] { if (typeof content === "string") { return [{ text: content } as TextPart] } + return content.flatMap((block) => { switch (block.type) { case "text": @@ -99,97 +81,3 @@ export function convertAnthropicMessageToGemini(message: Anthropic.Messages.Mess parts: convertAnthropicContentToGemini(message.content), } } - -export function convertAnthropicToolToGemini(tool: Anthropic.Messages.Tool): FunctionDeclaration { - return { - name: tool.name, - description: tool.description || "", - parameters: { - type: SchemaType.OBJECT, - properties: Object.fromEntries( - Object.entries(tool.input_schema.properties || {}).map(([key, value]) => [ - key, - { - type: (value as any).type.toUpperCase(), - description: (value as any).description || "", - }, - ]), - ), - required: (tool.input_schema.required as string[]) || [], - }, - } -} - -/* -It looks like gemini likes to double escape certain characters when writing file contents: https://discuss.ai.google.dev/t/function-call-string-property-is-double-escaped/37867 -*/ -export function unescapeGeminiContent(content: string) { - return content - .replace(/\\n/g, "\n") - .replace(/\\'/g, "'") - .replace(/\\"/g, '"') - .replace(/\\r/g, "\r") - .replace(/\\t/g, "\t") -} - -export function convertGeminiResponseToAnthropic( - response: EnhancedGenerateContentResponse, -): Anthropic.Messages.Message { - const content: Anthropic.Messages.ContentBlock[] = [] - - // Add the main text response - const text = response.text() - if (text) { - content.push({ type: "text", text }) - } - - // Add function calls as tool_use blocks - const functionCalls = response.functionCalls() - if (functionCalls) { - functionCalls.forEach((call, index) => { - if ("content" in call.args && typeof call.args.content === "string") { - call.args.content = unescapeGeminiContent(call.args.content) - } - content.push({ - type: "tool_use", - id: `${call.name}-${index}-${Date.now()}`, - name: call.name, - input: call.args, - }) - }) - } - - // Determine stop reason - let stop_reason: Anthropic.Messages.Message["stop_reason"] = null - const finishReason = response.candidates?.[0]?.finishReason - if (finishReason) { - switch (finishReason) { - case "STOP": - stop_reason = "end_turn" - break - case "MAX_TOKENS": - stop_reason = "max_tokens" - break - case "SAFETY": - case "RECITATION": - case "OTHER": - stop_reason = "stop_sequence" - break - // Add more cases if needed - } - } - - return { - id: `msg_${Date.now()}`, // Generate a unique ID - type: "message", - role: "assistant", - content, - model: "", - stop_reason, - stop_sequence: null, // Gemini doesn't provide this information - usage: { - input_tokens: response.usageMetadata?.promptTokenCount ?? 0, - output_tokens: response.usageMetadata?.candidatesTokenCount ?? 0, - }, - } -} diff --git a/src/api/transform/mistral-format.ts b/src/api/transform/mistral-format.ts index 16c6aaf2384..baf81ef24d2 100644 --- a/src/api/transform/mistral-format.ts +++ b/src/api/transform/mistral-format.ts @@ -1,5 +1,4 @@ import { Anthropic } from "@anthropic-ai/sdk" -import { Mistral } from "@mistralai/mistralai" import { AssistantMessage } from "@mistralai/mistralai/models/components/assistantmessage" import { SystemMessage } from "@mistralai/mistralai/models/components/systemmessage" import { ToolMessage } from "@mistralai/mistralai/models/components/toolmessage" @@ -13,6 +12,7 @@ export type MistralMessage = export function convertToMistralMessages(anthropicMessages: Anthropic.Messages.MessageParam[]): MistralMessage[] { const mistralMessages: MistralMessage[] = [] + for (const anthropicMessage of anthropicMessages) { if (typeof anthropicMessage.content === "string") { mistralMessages.push({ diff --git a/src/api/transform/openai-format.ts b/src/api/transform/openai-format.ts index fe23b9b2ff4..134f9f2ed6e 100644 --- a/src/api/transform/openai-format.ts +++ b/src/api/transform/openai-format.ts @@ -144,60 +144,3 @@ export function convertToOpenAiMessages( return openAiMessages } - -// Convert OpenAI response to Anthropic format -export function convertToAnthropicMessage( - completion: OpenAI.Chat.Completions.ChatCompletion, -): Anthropic.Messages.Message { - const openAiMessage = completion.choices[0].message - const anthropicMessage: Anthropic.Messages.Message = { - id: completion.id, - type: "message", - role: openAiMessage.role, // always "assistant" - content: [ - { - type: "text", - text: openAiMessage.content || "", - }, - ], - model: completion.model, - stop_reason: (() => { - switch (completion.choices[0].finish_reason) { - case "stop": - return "end_turn" - case "length": - return "max_tokens" - case "tool_calls": - return "tool_use" - case "content_filter": // Anthropic doesn't have an exact equivalent - default: - return null - } - })(), - stop_sequence: null, // which custom stop_sequence was generated, if any (not applicable if you don't use stop_sequence) - usage: { - input_tokens: completion.usage?.prompt_tokens || 0, - output_tokens: completion.usage?.completion_tokens || 0, - }, - } - - if (openAiMessage.tool_calls && openAiMessage.tool_calls.length > 0) { - anthropicMessage.content.push( - ...openAiMessage.tool_calls.map((toolCall): Anthropic.ToolUseBlock => { - let parsedInput = {} - try { - parsedInput = JSON.parse(toolCall.function.arguments || "{}") - } catch (error) { - console.error("Failed to parse tool arguments:", error) - } - return { - type: "tool_use", - id: toolCall.id, - name: toolCall.function.name, - input: parsedInput, - } - }), - ) - } - return anthropicMessage -} diff --git a/src/api/transform/simple-format.ts b/src/api/transform/simple-format.ts index c1e4895bba9..39049f76c27 100644 --- a/src/api/transform/simple-format.ts +++ b/src/api/transform/simple-format.ts @@ -3,16 +3,7 @@ import { Anthropic } from "@anthropic-ai/sdk" /** * Convert complex content blocks to simple string content */ -export function convertToSimpleContent( - content: - | string - | Array< - | Anthropic.Messages.TextBlockParam - | Anthropic.Messages.ImageBlockParam - | Anthropic.Messages.ToolUseBlockParam - | Anthropic.Messages.ToolResultBlockParam - >, -): string { +export function convertToSimpleContent(content: Anthropic.Messages.MessageParam["content"]): string { if (typeof content === "string") { return content } diff --git a/src/api/transform/vscode-lm-format.ts b/src/api/transform/vscode-lm-format.ts index 6d7bea92bad..73716cf912d 100644 --- a/src/api/transform/vscode-lm-format.ts +++ b/src/api/transform/vscode-lm-format.ts @@ -155,46 +155,3 @@ export function convertToAnthropicRole(vsCodeLmMessageRole: vscode.LanguageModel return null } } - -export async function convertToAnthropicMessage( - vsCodeLmMessage: vscode.LanguageModelChatMessage, -): Promise { - const anthropicRole: string | null = convertToAnthropicRole(vsCodeLmMessage.role) - if (anthropicRole !== "assistant") { - throw new Error("Roo Code : Only assistant messages are supported.") - } - - return { - id: crypto.randomUUID(), - type: "message", - model: "vscode-lm", - role: anthropicRole, - content: vsCodeLmMessage.content - .map((part): Anthropic.ContentBlock | null => { - if (part instanceof vscode.LanguageModelTextPart) { - return { - type: "text", - text: part.value, - } - } - - if (part instanceof vscode.LanguageModelToolCallPart) { - return { - type: "tool_use", - id: part.callId || crypto.randomUUID(), - name: part.name, - input: asObjectSafe(part.input), - } - } - - return null - }) - .filter((part): part is Anthropic.ContentBlock => part !== null), - stop_reason: null, - stop_sequence: null, - usage: { - input_tokens: 0, - output_tokens: 0, - }, - } -} diff --git a/src/core/Cline.ts b/src/core/Cline.ts index 94bc6126924..073bd109117 100644 --- a/src/core/Cline.ts +++ b/src/core/Cline.ts @@ -47,6 +47,8 @@ import { import { getApiMetrics } from "../shared/getApiMetrics" import { HistoryItem } from "../shared/HistoryItem" import { ClineAskResponse } from "../shared/WebviewMessage" +import { GlobalFileNames } from "../shared/globalFileNames" +import { defaultModeSlug, getModeBySlug, getFullModeDetails } from "../shared/modes" import { calculateApiCost } from "../utils/cost" import { fileExistsAtPath } from "../utils/fs" import { arePathsEqual, getReadablePath } from "../utils/path" @@ -54,12 +56,10 @@ import { parseMentions } from "./mentions" import { AssistantMessageContent, parseAssistantMessage, ToolParamName, ToolUseName } from "./assistant-message" import { formatResponse } from "./prompts/responses" import { SYSTEM_PROMPT } from "./prompts/system" -import { modes, defaultModeSlug, getModeBySlug, getFullModeDetails } from "../shared/modes" import { truncateConversationIfNeeded } from "./sliding-window" -import { ClineProvider, GlobalFileNames } from "./webview/ClineProvider" +import { ClineProvider } from "./webview/ClineProvider" import { detectCodeOmission } from "../integrations/editor/detect-omission" import { BrowserSession } from "../services/browser/BrowserSession" -import { OpenRouterHandler } from "../api/providers/openrouter" import { McpHub } from "../services/mcp/McpHub" import crypto from "crypto" import { insertGroups } from "./diff/insert-groups" @@ -69,9 +69,21 @@ const cwd = vscode.workspace.workspaceFolders?.map((folder) => folder.uri.fsPath).at(0) ?? path.join(os.homedir(), "Desktop") // may or may not exist but fs checking existence would immediately ask for permission which would be bad UX, need to come up with a better solution type ToolResponse = string | Array -type UserContent = Array< - Anthropic.TextBlockParam | Anthropic.ImageBlockParam | Anthropic.ToolUseBlockParam | Anthropic.ToolResultBlockParam -> +type UserContent = Array + +export type ClineOptions = { + provider: ClineProvider + apiConfiguration: ApiConfiguration + customInstructions?: string + enableDiff?: boolean + enableCheckpoints?: boolean + fuzzyMatchThreshold?: number + task?: string + images?: string[] + historyItem?: HistoryItem + experiments?: Record + startTask?: boolean +} export class Cline { readonly taskId: string @@ -118,19 +130,20 @@ export class Cline { private didAlreadyUseTool = false private didCompleteReadingStream = false - constructor( - provider: ClineProvider, - apiConfiguration: ApiConfiguration, - customInstructions?: string, - enableDiff?: boolean, - enableCheckpoints?: boolean, - fuzzyMatchThreshold?: number, - task?: string | undefined, - images?: string[] | undefined, - historyItem?: HistoryItem | undefined, - experiments?: Record, - ) { - if (!task && !images && !historyItem) { + constructor({ + provider, + apiConfiguration, + customInstructions, + enableDiff, + enableCheckpoints, + fuzzyMatchThreshold, + task, + images, + historyItem, + experiments, + startTask = true, + }: ClineOptions) { + if (startTask && !task && !images && !historyItem) { throw new Error("Either historyItem or task/images must be provided") } @@ -153,11 +166,31 @@ export class Cline { // Initialize diffStrategy based on current state this.updateDiffStrategy(Experiments.isEnabled(experiments ?? {}, EXPERIMENT_IDS.DIFF_STRATEGY)) - if (task || images) { - this.startTask(task, images) + if (startTask) { + if (task || images) { + this.startTask(task, images) + } else if (historyItem) { + this.resumeTaskFromHistory() + } else { + throw new Error("Either historyItem or task/images must be provided") + } + } + } + + static create(options: ClineOptions): [Cline, Promise] { + const instance = new Cline({ ...options, startTask: false }) + const { images, task, historyItem } = options + let promise + + if (images || task) { + promise = instance.startTask(task, images) } else if (historyItem) { - this.resumeTaskFromHistory() + promise = instance.resumeTaskFromHistory() + } else { + throw new Error("Either historyItem or task/images must be provided") } + + return [instance, promise] } // Add method to update diffStrategy @@ -698,7 +731,7 @@ export class Cline { text: `[TASK RESUMPTION] This task was interrupted ${agoText}. It may or may not be complete, so please reassess the task context. Be aware that the project state may have changed since then. The current working directory is now '${cwd.toPosix()}'. If the task has not been completed, retry the last step before interruption and proceed with completing the task.\n\nNote: If you previously attempted a tool use that the user did not provide a result for, you should assume the tool use was not successful and assess whether you should retry. If the last tool was a browser_action, the browser has been closed and you must launch a new browser if needed.${ wasRecent - ? "\n\nIMPORTANT: If the last tool use was a create_file that was interrupted, the file was reverted back to its original state before the interrupted edit, and you do NOT need to re-read the file as you already have its up-to-date contents." + ? "\n\nIMPORTANT: If the last tool use was a write_to_file that was interrupted, the file was reverted back to its original state before the interrupted edit, and you do NOT need to re-read the file as you already have its up-to-date contents." : "" }` + (responseText @@ -745,8 +778,12 @@ export class Cline { } } - async abortTask() { + async abortTask(isAbandoned = false) { // Will stop any autonomously running promises. + if (isAbandoned) { + this.abandoned = true + } + this.abort = true this.terminalManager.disposeAll() @@ -1102,9 +1139,9 @@ export class Cline { return `[${block.name} for '${block.params.command}']` case "read_file": return `[${block.name} for '${block.params.path}']` - case "create_file": + case "write_to_file": return `[${block.name} for '${block.params.path}']` - case "edit_file": + case "apply_diff": return `[${block.name} for '${block.params.path}']` case "search_files": return `[${block.name} for '${block.params.regex}'${ @@ -1256,7 +1293,7 @@ export class Cline { mode ?? defaultModeSlug, customModes ?? [], { - edit_file: this.diffEnabled, + apply_diff: this.diffEnabled, }, block.params, ) @@ -1267,7 +1304,7 @@ export class Cline { } switch (block.name) { - case "create_file": { + case "write_to_file": { const relPath: string | undefined = block.params.path let newContent: string | undefined = block.params.content let predictedLineCount: number | undefined = parseInt(block.params.line_count ?? "0") @@ -1332,20 +1369,20 @@ export class Cline { } else { if (!relPath) { this.consecutiveMistakeCount++ - pushToolResult(await this.sayAndCreateMissingParamError("create_file", "path")) + pushToolResult(await this.sayAndCreateMissingParamError("write_to_file", "path")) await this.diffViewProvider.reset() break } if (!newContent) { this.consecutiveMistakeCount++ - pushToolResult(await this.sayAndCreateMissingParamError("create_file", "content")) + pushToolResult(await this.sayAndCreateMissingParamError("write_to_file", "content")) await this.diffViewProvider.reset() break } if (!predictedLineCount) { this.consecutiveMistakeCount++ pushToolResult( - await this.sayAndCreateMissingParamError("create_file", "line_count"), + await this.sayAndCreateMissingParamError("write_to_file", "line_count"), ) await this.diffViewProvider.reset() break @@ -1382,7 +1419,7 @@ export class Cline { formatResponse.toolError( `Content appears to be truncated (file has ${ newContent.split("\n").length - } lines but was predicted to have ${predictedLineCount} lines), and found comments indicating omitted code (e.g., '// rest of code unchanged', '/* previous code */'). Please provide the complete file content without any omissions if possible, or otherwise use the 'edit_file' tool to apply the diff to the original file.`, + } lines but was predicted to have ${predictedLineCount} lines), and found comments indicating omitted code (e.g., '// rest of code unchanged', '/* previous code */'). Please provide the complete file content without any omissions if possible, or otherwise use the 'apply_diff' tool to apply the diff to the original file.`, ), ) break @@ -1458,7 +1495,7 @@ export class Cline { break } } - case "edit_file": { + case "apply_diff": { const relPath: string | undefined = block.params.path const diffContent: string | undefined = block.params.diff @@ -1476,12 +1513,12 @@ export class Cline { } else { if (!relPath) { this.consecutiveMistakeCount++ - pushToolResult(await this.sayAndCreateMissingParamError("edit_file", "path")) + pushToolResult(await this.sayAndCreateMissingParamError("apply_diff", "path")) break } if (!diffContent) { this.consecutiveMistakeCount++ - pushToolResult(await this.sayAndCreateMissingParamError("edit_file", "diff")) + pushToolResult(await this.sayAndCreateMissingParamError("apply_diff", "diff")) break } @@ -2194,7 +2231,7 @@ export class Cline { formatResponse.toolResult( `The browser action has been executed. The console logs and screenshot have been captured for your analysis.\n\nConsole logs:\n${ browserActionResult.logs || "(No new logs)" - }\n\n(REMEMBER: if you need to proceed to using non-\`browser_action\` tools or launch a new browser, you MUST first close this browser. For example, if after analyzing the logs and screenshot you need to edit a file, you must first close the browser before you can use the create_file tool.)`, + }\n\n(REMEMBER: if you need to proceed to using non-\`browser_action\` tools or launch a new browser, you MUST first close this browser. For example, if after analyzing the logs and screenshot you need to edit a file, you must first close the browser before you can use the write_to_file tool.)`, browserActionResult.screenshot ? [browserActionResult.screenshot] : [], ), ) @@ -2711,7 +2748,7 @@ export class Cline { /* Seeing out of bounds is fine, it means that the next too call is being built up and ready to add to assistantMessageContent to present. - When you see the UI inactive during this, it means that a tool is breaking without presenting any UI. For example the create_file tool was breaking when relpath was undefined, and for invalid relpath it never presented UI. + When you see the UI inactive during this, it means that a tool is breaking without presenting any UI. For example the write_to_file tool was breaking when relpath was undefined, and for invalid relpath it never presented UI. */ this.presentAssistantMessageLocked = false // this needs to be placed here, if not then calling this.presentAssistantMessage below would fail (sometimes) since it's locked // NOTE: when tool is rejected, iterator stream is interrupted and it waits for userMessageContentReady to be true. Future calls to present will skip execution since didRejectTool and iterate until contentIndex is set to message length and it sets userMessageContentReady to true itself (instead of preemptively doing it in iterator) @@ -2753,7 +2790,7 @@ export class Cline { "mistake_limit_reached", this.api.getModel().id.includes("claude") ? `This may indicate a failure in his thought process or inability to use a tool properly, which can be mitigated with some user guidance (e.g. "Try breaking down the task into smaller steps").` - : "Roo Code uses complex prompts and iterative task execution that may be challenging for less capable models. For best results, it's recommended to use Claude 3.5 Sonnet for its advanced agentic coding capabilities.", + : "Roo Code uses complex prompts and iterative task execution that may be challenging for less capable models. For best results, it's recommended to use Claude 3.7 Sonnet for its advanced agentic coding capabilities.", ) if (response === "messageResponse") { userContent.push( @@ -2967,7 +3004,7 @@ export class Cline { } // need to call here in case the stream was aborted - if (this.abort) { + if (this.abort || this.abandoned) { throw new Error("Roo Code instance aborted") } @@ -3261,10 +3298,10 @@ export class Cline { // Add warning if not in code mode if ( - !isToolAllowedForMode("create_file", currentMode, customModes ?? [], { - edit_file: this.diffEnabled, + !isToolAllowedForMode("write_to_file", currentMode, customModes ?? [], { + apply_diff: this.diffEnabled, }) && - !isToolAllowedForMode("edit_file", currentMode, customModes ?? [], { edit_file: this.diffEnabled }) + !isToolAllowedForMode("apply_diff", currentMode, customModes ?? [], { apply_diff: this.diffEnabled }) ) { const currentModeName = getModeBySlug(currentMode, customModes)?.name ?? currentMode const defaultModeName = getModeBySlug(defaultModeSlug, customModes)?.name ?? defaultModeSlug diff --git a/src/core/__tests__/Cline.test.ts b/src/core/__tests__/Cline.test.ts index 2eb9ab83f30..9910896ebb9 100644 --- a/src/core/__tests__/Cline.test.ts +++ b/src/core/__tests__/Cline.test.ts @@ -1,3 +1,5 @@ +// npx jest src/core/__tests__/Cline.test.ts + import { Cline } from "../Cline" import { ClineProvider } from "../webview/ClineProvider" import { ApiConfiguration, ModelInfo } from "../../shared/api" @@ -324,88 +326,86 @@ describe("Cline", () => { }) describe("constructor", () => { - it("should respect provided settings", () => { - const cline = new Cline( - mockProvider, - mockApiConfig, - "custom instructions", - false, - false, - 0.95, // 95% threshold - "test task", - ) + it("should respect provided settings", async () => { + const [cline, task] = Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + customInstructions: "custom instructions", + fuzzyMatchThreshold: 0.95, + task: "test task", + }) expect(cline.customInstructions).toBe("custom instructions") expect(cline.diffEnabled).toBe(false) + + await cline.abortTask(true) + await task.catch(() => {}) }) - it("should use default fuzzy match threshold when not provided", () => { - const cline = new Cline( - mockProvider, - mockApiConfig, - "custom instructions", - true, - false, - undefined, - "test task", - ) + it("should use default fuzzy match threshold when not provided", async () => { + const [cline, task] = await Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + customInstructions: "custom instructions", + enableDiff: true, + fuzzyMatchThreshold: 0.95, + task: "test task", + }) expect(cline.diffEnabled).toBe(true) // The diff strategy should be created with default threshold (1.0) expect(cline.diffStrategy).toBeDefined() + + await cline.abortTask(true) + await task.catch(() => {}) }) - it("should use provided fuzzy match threshold", () => { + it("should use provided fuzzy match threshold", async () => { const getDiffStrategySpy = jest.spyOn(require("../diff/DiffStrategy"), "getDiffStrategy") - const cline = new Cline( - mockProvider, - mockApiConfig, - "custom instructions", - true, - false, - 0.9, // 90% threshold - "test task", - ) + const [cline, task] = await Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + customInstructions: "custom instructions", + enableDiff: true, + fuzzyMatchThreshold: 0.9, + task: "test task", + }) expect(cline.diffEnabled).toBe(true) expect(cline.diffStrategy).toBeDefined() expect(getDiffStrategySpy).toHaveBeenCalledWith("claude-3-5-sonnet-20241022", 0.9, false) getDiffStrategySpy.mockRestore() + + await cline.abortTask(true) + await task.catch(() => {}) }) - it("should pass default threshold to diff strategy when not provided", () => { + it("should pass default threshold to diff strategy when not provided", async () => { const getDiffStrategySpy = jest.spyOn(require("../diff/DiffStrategy"), "getDiffStrategy") - const cline = new Cline( - mockProvider, - mockApiConfig, - "custom instructions", - true, - false, - undefined, - "test task", - ) + const [cline, task] = Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + customInstructions: "custom instructions", + enableDiff: true, + task: "test task", + }) expect(cline.diffEnabled).toBe(true) expect(cline.diffStrategy).toBeDefined() expect(getDiffStrategySpy).toHaveBeenCalledWith("claude-3-5-sonnet-20241022", 1.0, false) getDiffStrategySpy.mockRestore() + + await cline.abortTask(true) + await task.catch(() => {}) }) it("should require either task or historyItem", () => { expect(() => { - new Cline( - mockProvider, - mockApiConfig, - undefined, // customInstructions - false, // diffEnabled - false, // checkpointsEnabled - undefined, // fuzzyMatchThreshold - undefined, // task - ) + new Cline({ provider: mockProvider, apiConfiguration: mockApiConfig }) }).toThrow("Either historyItem or task/images must be provided") }) }) @@ -455,7 +455,11 @@ describe("Cline", () => { }) it("should include timezone information in environment details", async () => { - const cline = new Cline(mockProvider, mockApiConfig, undefined, false, false, undefined, "test task") + const [cline, task] = Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + task: "test task", + }) const details = await cline["getEnvironmentDetails"](false) @@ -464,11 +468,21 @@ describe("Cline", () => { expect(details).toMatch(/UTC-7:00/) // Fixed offset for America/Los_Angeles expect(details).toContain("# Current Time") expect(details).toMatch(/1\/1\/2024.*5:00:00 AM.*\(America\/Los_Angeles, UTC-7:00\)/) // Full time string format + + await cline.abortTask(true) + await task.catch(() => {}) }) describe("API conversation handling", () => { it("should clean conversation history before sending to API", async () => { - const cline = new Cline(mockProvider, mockApiConfig, undefined, false, false, undefined, "test task") + const [cline, task] = Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + task: "test task", + }) + + cline.abandoned = true + await task // Mock the API's createMessage method to capture the conversation history const createMessageSpy = jest.fn() @@ -576,15 +590,12 @@ describe("Cline", () => { ] // Test with model that supports images - const clineWithImages = new Cline( - mockProvider, - configWithImages, - undefined, - false, - false, - undefined, - "test task", - ) + const [clineWithImages, taskWithImages] = Cline.create({ + provider: mockProvider, + apiConfiguration: configWithImages, + task: "test task", + }) + // Mock the model info to indicate image support jest.spyOn(clineWithImages.api, "getModel").mockReturnValue({ id: "claude-3-sonnet", @@ -598,18 +609,16 @@ describe("Cline", () => { outputPrice: 0.75, } as ModelInfo, }) + clineWithImages.apiConversationHistory = conversationHistory // Test with model that doesn't support images - const clineWithoutImages = new Cline( - mockProvider, - configWithoutImages, - undefined, - false, - false, - undefined, - "test task", - ) + const [clineWithoutImages, taskWithoutImages] = Cline.create({ + provider: mockProvider, + apiConfiguration: configWithoutImages, + task: "test task", + }) + // Mock the model info to indicate no image support jest.spyOn(clineWithoutImages.api, "getModel").mockReturnValue({ id: "gpt-3.5-turbo", @@ -623,6 +632,7 @@ describe("Cline", () => { outputPrice: 0.2, } as ModelInfo, }) + clineWithoutImages.apiConversationHistory = conversationHistory // Mock abort state for both instances @@ -631,6 +641,7 @@ describe("Cline", () => { set: () => {}, configurable: true, }) + Object.defineProperty(clineWithoutImages, "abort", { get: () => false, set: () => {}, @@ -645,6 +656,7 @@ describe("Cline", () => { content, "", ]) + // Set up mock streams const mockStreamWithImages = (async function* () { yield { type: "text", text: "test response" } @@ -672,6 +684,12 @@ describe("Cline", () => { }, ] + clineWithImages.abandoned = true + await taskWithImages.catch(() => {}) + + clineWithoutImages.abandoned = true + await taskWithoutImages.catch(() => {}) + // Trigger API requests await clineWithImages.recursivelyMakeClineRequests([{ type: "text", text: "test request" }]) await clineWithoutImages.recursivelyMakeClineRequests([{ type: "text", text: "test request" }]) @@ -695,7 +713,11 @@ describe("Cline", () => { }) it.skip("should handle API retry with countdown", async () => { - const cline = new Cline(mockProvider, mockApiConfig, undefined, false, false, undefined, "test task") + const [cline, task] = Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + task: "test task", + }) // Mock delay to track countdown timing const mockDelay = jest.fn().mockResolvedValue(undefined) @@ -809,10 +831,17 @@ describe("Cline", () => { expect(errorMessage).toBe( `${mockError.message}\n\nRetry attempt 1\nRetrying in ${baseDelay} seconds...`, ) + + await cline.abortTask(true) + await task.catch(() => {}) }) it.skip("should not apply retry delay twice", async () => { - const cline = new Cline(mockProvider, mockApiConfig, undefined, false, false, undefined, "test task") + const [cline, task] = Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + task: "test task", + }) // Mock delay to track countdown timing const mockDelay = jest.fn().mockResolvedValue(undefined) @@ -925,19 +954,18 @@ describe("Cline", () => { undefined, false, ) + + await cline.abortTask(true) + await task.catch(() => {}) }) describe("loadContext", () => { it("should process mentions in task and feedback tags", async () => { - const cline = new Cline( - mockProvider, - mockApiConfig, - undefined, - false, - false, - undefined, - "test task", - ) + const [cline, task] = Cline.create({ + provider: mockProvider, + apiConfiguration: mockApiConfig, + task: "test task", + }) // Mock parseMentions to track calls const mockParseMentions = jest.fn().mockImplementation((text) => `processed: ${text}`) @@ -1002,6 +1030,9 @@ describe("Cline", () => { const toolResult2 = processedContent[3] as Anthropic.ToolResultBlockParam const content2 = Array.isArray(toolResult2.content) ? toolResult2.content[0] : toolResult2.content expect((content2 as Anthropic.TextBlockParam).text).toBe("Regular tool result with @/path") + + await cline.abortTask(true) + await task.catch(() => {}) }) }) }) diff --git a/src/core/__tests__/mode-validator.test.ts b/src/core/__tests__/mode-validator.test.ts index 4efcd06e3e7..632ca8a8ab0 100644 --- a/src/core/__tests__/mode-validator.test.ts +++ b/src/core/__tests__/mode-validator.test.ts @@ -59,7 +59,7 @@ describe("mode-validator", () => { ] // Should allow tools from read and edit groups expect(isToolAllowedForMode("read_file", "custom-mode", customModes)).toBe(true) - expect(isToolAllowedForMode("create_file", "custom-mode", customModes)).toBe(true) + expect(isToolAllowedForMode("write_to_file", "custom-mode", customModes)).toBe(true) // Should not allow tools from other groups expect(isToolAllowedForMode("execute_command", "custom-mode", customModes)).toBe(false) }) @@ -76,7 +76,7 @@ describe("mode-validator", () => { // Should allow tools from read group expect(isToolAllowedForMode("read_file", codeMode, customModes)).toBe(true) // Should not allow tools from other groups - expect(isToolAllowedForMode("create_file", codeMode, customModes)).toBe(false) + expect(isToolAllowedForMode("write_to_file", codeMode, customModes)).toBe(false) }) it("respects tool requirements in custom modes", () => { @@ -88,39 +88,39 @@ describe("mode-validator", () => { groups: ["edit"] as const, }, ] - const requirements = { edit_file: false } + const requirements = { apply_diff: false } // Should respect disabled requirement even if tool group is allowed - expect(isToolAllowedForMode("edit_file", "custom-mode", customModes, requirements)).toBe(false) + expect(isToolAllowedForMode("apply_diff", "custom-mode", customModes, requirements)).toBe(false) // Should allow other edit tools - expect(isToolAllowedForMode("create_file", "custom-mode", customModes, requirements)).toBe(true) + expect(isToolAllowedForMode("write_to_file", "custom-mode", customModes, requirements)).toBe(true) }) }) describe("tool requirements", () => { it("respects tool requirements when provided", () => { - const requirements = { edit_file: false } - expect(isToolAllowedForMode("edit_file", codeMode, [], requirements)).toBe(false) + const requirements = { apply_diff: false } + expect(isToolAllowedForMode("apply_diff", codeMode, [], requirements)).toBe(false) - const enabledRequirements = { edit_file: true } - expect(isToolAllowedForMode("edit_file", codeMode, [], enabledRequirements)).toBe(true) + const enabledRequirements = { apply_diff: true } + expect(isToolAllowedForMode("apply_diff", codeMode, [], enabledRequirements)).toBe(true) }) it("allows tools when their requirements are not specified", () => { const requirements = { some_other_tool: true } - expect(isToolAllowedForMode("edit_file", codeMode, [], requirements)).toBe(true) + expect(isToolAllowedForMode("apply_diff", codeMode, [], requirements)).toBe(true) }) it("handles undefined and empty requirements", () => { - expect(isToolAllowedForMode("edit_file", codeMode, [], undefined)).toBe(true) - expect(isToolAllowedForMode("edit_file", codeMode, [], {})).toBe(true) + expect(isToolAllowedForMode("apply_diff", codeMode, [], undefined)).toBe(true) + expect(isToolAllowedForMode("apply_diff", codeMode, [], {})).toBe(true) }) it("prioritizes requirements over mode configuration", () => { - const requirements = { edit_file: false } + const requirements = { apply_diff: false } // Even in code mode which allows all tools, disabled requirement should take precedence - expect(isToolAllowedForMode("edit_file", codeMode, [], requirements)).toBe(false) + expect(isToolAllowedForMode("apply_diff", codeMode, [], requirements)).toBe(false) }) }) }) @@ -137,19 +137,19 @@ describe("mode-validator", () => { }) it("throws error when tool requirement is not met", () => { - const requirements = { edit_file: false } - expect(() => validateToolUse("edit_file", codeMode, [], requirements)).toThrow( - 'Tool "edit_file" is not allowed in code mode.', + const requirements = { apply_diff: false } + expect(() => validateToolUse("apply_diff", codeMode, [], requirements)).toThrow( + 'Tool "apply_diff" is not allowed in code mode.', ) }) it("does not throw when tool requirement is met", () => { - const requirements = { edit_file: true } - expect(() => validateToolUse("edit_file", codeMode, [], requirements)).not.toThrow() + const requirements = { apply_diff: true } + expect(() => validateToolUse("apply_diff", codeMode, [], requirements)).not.toThrow() }) it("handles undefined requirements gracefully", () => { - expect(() => validateToolUse("edit_file", codeMode, [], undefined)).not.toThrow() + expect(() => validateToolUse("apply_diff", codeMode, [], undefined)).not.toThrow() }) }) }) diff --git a/src/core/assistant-message/index.ts b/src/core/assistant-message/index.ts index 46b29a703db..f1c49f85ab7 100644 --- a/src/core/assistant-message/index.ts +++ b/src/core/assistant-message/index.ts @@ -11,8 +11,8 @@ export interface TextContent { export const toolUseNames = [ "execute_command", "read_file", - "create_file", - "edit_file", + "write_to_file", + "apply_diff", "insert_content", "search_and_replace", "search_files", @@ -80,7 +80,7 @@ export interface ReadFileToolUse extends ToolUse { } export interface WriteToFileToolUse extends ToolUse { - name: "create_file" + name: "write_to_file" params: Partial, "path" | "content" | "line_count">> } diff --git a/src/core/assistant-message/parse-assistant-message.ts b/src/core/assistant-message/parse-assistant-message.ts index 9b1cea70a9b..e38e8f6458e 100644 --- a/src/core/assistant-message/parse-assistant-message.ts +++ b/src/core/assistant-message/parse-assistant-message.ts @@ -61,9 +61,9 @@ export function parseAssistantMessage(assistantMessage: string) { // there's no current param, and not starting a new param - // special case for create_file where file contents could contain the closing tag, in which case the param would have closed and we end up with the rest of the file contents here. To work around this, we get the string between the starting content tag and the LAST content tag. + // special case for write_to_file where file contents could contain the closing tag, in which case the param would have closed and we end up with the rest of the file contents here. To work around this, we get the string between the starting content tag and the LAST content tag. const contentParamName: ToolParamName = "content" - if (currentToolUse.name === "create_file" && accumulator.endsWith(``)) { + if (currentToolUse.name === "write_to_file" && accumulator.endsWith(``)) { const toolContent = accumulator.slice(currentToolUseStartIndex) const contentStartTag = `<${contentParamName}>` const contentEndTag = `` diff --git a/src/core/config/__tests__/CustomModesManager.test.ts b/src/core/config/__tests__/CustomModesManager.test.ts index 3c8236e9208..4031bff906d 100644 --- a/src/core/config/__tests__/CustomModesManager.test.ts +++ b/src/core/config/__tests__/CustomModesManager.test.ts @@ -1,3 +1,5 @@ +// npx jest src/core/config/__tests__/CustomModesManager.test.ts + import * as vscode from "vscode" import * as path from "path" import * as fs from "fs/promises" @@ -15,9 +17,10 @@ describe("CustomModesManager", () => { let mockOnUpdate: jest.Mock let mockWorkspaceFolders: { uri: { fsPath: string } }[] - const mockStoragePath = "/mock/settings" + // Use path.sep to ensure correct path separators for the current platform + const mockStoragePath = `${path.sep}mock${path.sep}settings` const mockSettingsPath = path.join(mockStoragePath, "settings", "cline_custom_modes.json") - const mockRoomodes = "/mock/workspace/.roomodes" + const mockRoomodes = `${path.sep}mock${path.sep}workspace${path.sep}.roomodes` beforeEach(() => { mockOnUpdate = jest.fn() @@ -243,7 +246,15 @@ describe("CustomModesManager", () => { await manager.updateCustomMode("project-mode", projectMode) // Verify .roomodes was created with the project mode - expect(fs.writeFile).toHaveBeenCalledWith(mockRoomodes, expect.stringContaining("project-mode"), "utf-8") + expect(fs.writeFile).toHaveBeenCalledWith( + expect.any(String), // Don't check exact path as it may have different separators on different platforms + expect.stringContaining("project-mode"), + "utf-8", + ) + + // Verify the path is correct regardless of separators + const writeCall = (fs.writeFile as jest.Mock).mock.calls[0] + expect(path.normalize(writeCall[0])).toBe(path.normalize(mockRoomodes)) // Verify the content written to .roomodes expect(roomodesContent).toEqual({ diff --git a/src/core/diff/strategies/__tests__/new-unified.test.ts b/src/core/diff/strategies/__tests__/new-unified.test.ts index 9d30cece7e4..8832f9e7c08 100644 --- a/src/core/diff/strategies/__tests__/new-unified.test.ts +++ b/src/core/diff/strategies/__tests__/new-unified.test.ts @@ -29,7 +29,7 @@ describe("main", () => { const cwd = "/test/path" const description = strategy.getToolDescription({ cwd }) - expect(description).toContain("edit_file Tool - Generate Precise Code Changes") + expect(description).toContain("apply_diff Tool - Generate Precise Code Changes") expect(description).toContain(cwd) expect(description).toContain("Step-by-Step Instructions") expect(description).toContain("Requirements") diff --git a/src/core/diff/strategies/__tests__/search-replace.test.ts b/src/core/diff/strategies/__tests__/search-replace.test.ts index 723beee23a7..cd71edac475 100644 --- a/src/core/diff/strategies/__tests__/search-replace.test.ts +++ b/src/core/diff/strategies/__tests__/search-replace.test.ts @@ -1544,8 +1544,8 @@ function two() { expect(description).toContain("<<<<<<< SEARCH") expect(description).toContain("=======") expect(description).toContain(">>>>>>> REPLACE") - expect(description).toContain("") - expect(description).toContain("") + expect(description).toContain("") + expect(description).toContain("") }) it("should document start_line and end_line parameters", async () => { diff --git a/src/core/diff/strategies/__tests__/unified.test.ts b/src/core/diff/strategies/__tests__/unified.test.ts index ae7860869bb..1d9847b3c51 100644 --- a/src/core/diff/strategies/__tests__/unified.test.ts +++ b/src/core/diff/strategies/__tests__/unified.test.ts @@ -12,7 +12,7 @@ describe("UnifiedDiffStrategy", () => { const cwd = "/test/path" const description = strategy.getToolDescription({ cwd }) - expect(description).toContain("edit_file") + expect(description).toContain("apply_diff") expect(description).toContain(cwd) expect(description).toContain("Parameters:") expect(description).toContain("Format Requirements:") diff --git a/src/core/diff/strategies/new-unified/__tests__/edit-strategies.test.ts b/src/core/diff/strategies/new-unified/__tests__/edit-strategies.test.ts index f8251e3d6e6..2bc35540baf 100644 --- a/src/core/diff/strategies/new-unified/__tests__/edit-strategies.test.ts +++ b/src/core/diff/strategies/new-unified/__tests__/edit-strategies.test.ts @@ -1,5 +1,3 @@ -/// - import { applyContextMatching, applyDMP, applyGitFallback } from "../edit-strategies" import { Hunk } from "../types" @@ -277,7 +275,7 @@ describe("applyGitFallback", () => { expect(result.result.join("\n")).toEqual("line1\nnew line2\nline3") expect(result.confidence).toBe(1) expect(result.strategy).toBe("git-fallback") - }, 10_000) + }) it("should return original content with 0 confidence when changes cannot be applied", async () => { const hunk = { @@ -293,5 +291,5 @@ describe("applyGitFallback", () => { expect(result.result).toEqual(content) expect(result.confidence).toBe(0) expect(result.strategy).toBe("git-fallback") - }, 10_000) + }) }) diff --git a/src/core/diff/strategies/new-unified/index.ts b/src/core/diff/strategies/new-unified/index.ts index df130ffaca6..d82a05a1045 100644 --- a/src/core/diff/strategies/new-unified/index.ts +++ b/src/core/diff/strategies/new-unified/index.ts @@ -108,7 +108,7 @@ export class NewUnifiedDiffStrategy implements DiffStrategy { } getToolDescription(args: { cwd: string; toolOptions?: { [key: string]: string } }): string { - return `# edit_file Tool - Generate Precise Code Changes + return `# apply_diff Tool - Generate Precise Code Changes Generate a unified diff that can be cleanly applied to modify code files. @@ -168,12 +168,12 @@ Parameters: - diff: (required) Unified diff content in unified format to apply to the file. Usage: - + path/to/file.ext Your diff here -` +` } // Helper function to split a hunk into smaller hunks based on contiguous changes diff --git a/src/core/diff/strategies/search-replace.ts b/src/core/diff/strategies/search-replace.ts index c8d4f22c8d1..a9bf46758de 100644 --- a/src/core/diff/strategies/search-replace.ts +++ b/src/core/diff/strategies/search-replace.ts @@ -40,7 +40,7 @@ export class SearchReplaceDiffStrategy implements DiffStrategy { } getToolDescription(args: { cwd: string; toolOptions?: { [key: string]: string } }): string { - return `## edit_file + return `## apply_diff Description: Request to replace existing code using a search and replace block. This tool allows for precise, surgical replaces to files by specifying exactly what content to search for and what to replace it with. The tool will maintain proper indentation and formatting while making changes. @@ -91,14 +91,14 @@ def calculate_total(items): \`\`\` Usage: - + File path here Your search/replace content here 1 5 -` +` } async applyDiff( diff --git a/src/core/diff/strategies/unified.ts b/src/core/diff/strategies/unified.ts index 5947391df69..f1cdb3b5849 100644 --- a/src/core/diff/strategies/unified.ts +++ b/src/core/diff/strategies/unified.ts @@ -3,7 +3,7 @@ import { DiffStrategy, DiffResult } from "../types" export class UnifiedDiffStrategy implements DiffStrategy { getToolDescription(args: { cwd: string; toolOptions?: { [key: string]: string } }): string { - return `## edit_file + return `## apply_diff Description: Apply a unified diff to a file at the specified path. This tool is useful when you need to make specific modifications to a file based on a set of changes provided in unified diff format (diff -U3). Parameters: @@ -100,12 +100,12 @@ Best Practices: 4. Verify line numbers match the line numbers you have in the file Usage: - + File path here Your diff here -` +` } async applyDiff(originalContent: string, diffContent: string): Promise { diff --git a/src/core/prompts/__tests__/__snapshots__/system.test.ts.snap b/src/core/prompts/__tests__/__snapshots__/system.test.ts.snap index e4447d31eef..b8050adb77a 100644 --- a/src/core/prompts/__tests__/__snapshots__/system.test.ts.snap +++ b/src/core/prompts/__tests__/__snapshots__/system.test.ts.snap @@ -94,23 +94,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -129,7 +129,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## execute_command Description: Request to execute a CLI command on the system. Use this when you need to perform system operations or run specific commands to accomplish any step in the user's task. You must tailor your command to the user's system and provide a clear explanation of what the command does. For command chaining, use the appropriate chaining syntax for the user's shell. Prefer to execute complex CLI commands over creating executable scripts, as they are more flexible and easier to run. Commands will be executed in the current working directory: /test/path @@ -249,7 +249,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. ==== @@ -266,9 +266,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -417,23 +417,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -452,7 +452,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## execute_command Description: Request to execute a CLI command on the system. Use this when you need to perform system operations or run specific commands to accomplish any step in the user's task. You must tailor your command to the user's system and provide a clear explanation of what the command does. For command chaining, use the appropriate chaining syntax for the user's shell. Prefer to execute complex CLI commands over creating executable scripts, as they are more flexible and easier to run. Commands will be executed in the current working directory: /test/path @@ -572,7 +572,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. ==== @@ -589,9 +589,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -740,23 +740,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -775,7 +775,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## execute_command Description: Request to execute a CLI command on the system. Use this when you need to perform system operations or run specific commands to accomplish any step in the user's task. You must tailor your command to the user's system and provide a clear explanation of what the command does. For command chaining, use the appropriate chaining syntax for the user's shell. Prefer to execute complex CLI commands over creating executable scripts, as they are more flexible and easier to run. Commands will be executed in the current working directory: /test/path @@ -895,7 +895,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. ==== @@ -912,9 +912,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -1063,23 +1063,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -1098,7 +1098,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## browser_action Description: Request to interact with a Puppeteer-controlled browser. Every action, except \`close\`, will be responded to with a screenshot of the browser's current state, along with any new console logs. You may only perform one browser action per message, and wait for the user's response including a screenshot and logs to determine the next action. @@ -1264,7 +1264,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. - You can use the browser_action tool to interact with websites (including html files and locally running development servers) through a Puppeteer-controlled browser when you feel it is necessary in accomplishing the user's task. This tool is particularly useful for web development tasks as it allows you to launch a browser, navigate to pages, interact with elements through clicks and keyboard input, and capture the results through screenshots and console logs. This tool may be useful at key stages of web development tasks-such as after implementing new features, making substantial changes, when troubleshooting issues, or to verify the result of your work. You can analyze the provided screenshots to ensure correct rendering or identify errors, and review console logs for runtime issues. - For example, if asked to add a component to a react website, you might create the necessary files, use execute_command to run the site locally, then use browser_action to launch the browser, navigate to the local server, and verify the component renders & functions correctly before closing the browser. @@ -1283,9 +1283,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -1435,23 +1435,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -1470,7 +1470,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## execute_command Description: Request to execute a CLI command on the system. Use this when you need to perform system operations or run specific commands to accomplish any step in the user's task. You must tailor your command to the user's system and provide a clear explanation of what the command does. For command chaining, use the appropriate chaining syntax for the user's shell. Prefer to execute complex CLI commands over creating executable scripts, as they are more flexible and easier to run. Commands will be executed in the current working directory: /test/path @@ -1983,7 +1983,7 @@ IMPORTANT: Regardless of what else you see in the MCP settings file, you must de ## Editing MCP Servers -The user may ask to add tools or resources that may make sense to add to an existing MCP server (listed under 'Connected MCP Servers' above: (None running currently), e.g. if it would use the same API. This would be possible if you can locate the MCP server repository on the user's system by looking at the server arguments for a filepath. You might then use list_files and read_file to explore the files in the repository, and use create_file to make changes to the files. +The user may ask to add tools or resources that may make sense to add to an existing MCP server (listed under 'Connected MCP Servers' above: (None running currently), e.g. if it would use the same API. This would be possible if you can locate the MCP server repository on the user's system by looking at the server arguments for a filepath. You might then use list_files and read_file to explore the files in the repository, and use write_to_file to make changes to the files. However some MCP servers may be running from installed packages rather than a local repository, in which case it may make more sense to create a new MCP server. @@ -2001,7 +2001,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. - You have access to MCP servers that may provide additional tools and resources. Each server may provide different capabilities that you can use to accomplish tasks more effectively. @@ -2020,9 +2020,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -2171,23 +2171,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -2206,7 +2206,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## browser_action Description: Request to interact with a Puppeteer-controlled browser. Every action, except \`close\`, will be responded to with a screenshot of the browser's current state, along with any new console logs. You may only perform one browser action per message, and wait for the user's response including a screenshot and logs to determine the next action. @@ -2372,7 +2372,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. - You can use the browser_action tool to interact with websites (including html files and locally running development servers) through a Puppeteer-controlled browser when you feel it is necessary in accomplishing the user's task. This tool is particularly useful for web development tasks as it allows you to launch a browser, navigate to pages, interact with elements through clicks and keyboard input, and capture the results through screenshots and console logs. This tool may be useful at key stages of web development tasks-such as after implementing new features, making substantial changes, when troubleshooting issues, or to verify the result of your work. You can analyze the provided screenshots to ensure correct rendering or identify errors, and review console logs for runtime issues. - For example, if asked to add a component to a react website, you might create the necessary files, use execute_command to run the site locally, then use browser_action to launch the browser, navigate to the local server, and verify the component renders & functions correctly before closing the browser. @@ -2391,9 +2391,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -2543,7 +2543,7 @@ Example: Requesting to list all top level source code definitions in the current . -## edit_file +## apply_diff Description: Request to replace existing code using a search and replace block. This tool allows for precise, surgical replaces to files by specifying exactly what content to search for and what to replace it with. The tool will maintain proper indentation and formatting while making changes. @@ -2594,32 +2594,32 @@ def calculate_total(items): \`\`\` Usage: - + File path here Your search/replace content here 1 5 - + -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -2638,7 +2638,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## execute_command Description: Request to execute a CLI command on the system. Use this when you need to perform system operations or run specific commands to accomplish any step in the user's task. You must tailor your command to the user's system and provide a clear explanation of what the command does. For command chaining, use the appropriate chaining syntax for the user's shell. Prefer to execute complex CLI commands over creating executable scripts, as they are more flexible and easier to run. Commands will be executed in the current working directory: /test/path @@ -2758,7 +2758,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the edit_file or create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the apply_diff or write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. ==== @@ -2775,11 +2775,11 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using edit_file or create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- For editing files, you have access to these tools: edit_file (for replacing lines in existing files), create_file (for creating new files or complete file rewrites). -- You should always prefer using other editing tools over create_file when making changes to existing files since create_file is much slower and cannot handle large files. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using apply_diff or write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- For editing files, you have access to these tools: apply_diff (for replacing lines in existing files), write_to_file (for creating new files or complete file rewrites). +- You should always prefer using other editing tools over write_to_file when making changes to existing files since write_to_file is much slower and cannot handle large files. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -2928,23 +2928,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -2963,7 +2963,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## execute_command Description: Request to execute a CLI command on the system. Use this when you need to perform system operations or run specific commands to accomplish any step in the user's task. You must tailor your command to the user's system and provide a clear explanation of what the command does. For command chaining, use the appropriate chaining syntax for the user's shell. Prefer to execute complex CLI commands over creating executable scripts, as they are more flexible and easier to run. Commands will be executed in the current working directory: /test/path @@ -3083,7 +3083,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. ==== @@ -3100,9 +3100,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -3293,23 +3293,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -3328,7 +3328,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## execute_command Description: Request to execute a CLI command on the system. Use this when you need to perform system operations or run specific commands to accomplish any step in the user's task. You must tailor your command to the user's system and provide a clear explanation of what the command does. For command chaining, use the appropriate chaining syntax for the user's shell. Prefer to execute complex CLI commands over creating executable scripts, as they are more flexible and easier to run. Commands will be executed in the current working directory: /test/path @@ -3505,7 +3505,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. - You have access to MCP servers that may provide additional tools and resources. Each server may provide different capabilities that you can use to accomplish tasks more effectively. @@ -3524,9 +3524,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -3690,23 +3690,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -3725,7 +3725,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## ask_followup_question Description: Ask the user a question to gather additional information needed to complete the task. This tool should be used when you encounter ambiguities, need clarification, or require more details to proceed effectively. It allows for interactive problem-solving by enabling direct communication with the user. Use this tool judiciously to maintain a balance between gathering necessary information and avoiding excessive back-and-forth. @@ -3831,7 +3831,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. ==== @@ -3848,9 +3848,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -4108,7 +4108,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. ==== @@ -4125,9 +4125,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" @@ -4309,23 +4309,23 @@ Example: Requesting to list all top level source code definitions in the current . -## create_file +## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory /test/path) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -4344,7 +4344,7 @@ Example: Requesting to write to frontend-config.json } 14 - + ## execute_command Description: Request to execute a CLI command on the system. Use this when you need to perform system operations or run specific commands to accomplish any step in the user's task. You must tailor your command to the user's system and provide a clear explanation of what the command does. For command chaining, use the appropriate chaining syntax for the user's shell. Prefer to execute complex CLI commands over creating executable scripts, as they are more flexible and easier to run. Commands will be executed in the current working directory: /test/path @@ -4857,7 +4857,7 @@ IMPORTANT: Regardless of what else you see in the MCP settings file, you must de ## Editing MCP Servers -The user may ask to add tools or resources that may make sense to add to an existing MCP server (listed under 'Connected MCP Servers' above: (None running currently), e.g. if it would use the same API. This would be possible if you can locate the MCP server repository on the user's system by looking at the server arguments for a filepath. You might then use list_files and read_file to explore the files in the repository, and use create_file to make changes to the files. +The user may ask to add tools or resources that may make sense to add to an existing MCP server (listed under 'Connected MCP Servers' above: (None running currently), e.g. if it would use the same API. This would be possible if you can locate the MCP server repository on the user's system by looking at the server arguments for a filepath. You might then use list_files and read_file to explore the files in the repository, and use write_to_file to make changes to the files. However some MCP servers may be running from installed packages rather than a local repository, in which case it may make more sense to create a new MCP server. @@ -4875,7 +4875,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('/test/path') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the create_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use the write_to_file tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance. - You have access to MCP servers that may provide additional tools and resources. Each server may provide different capabilities that you can use to accomplish tasks more effectively. @@ -4894,9 +4894,9 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '/test/path', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '/test/path', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '/test/path'). For example, if you needed to run \`npm install\` in a project outside of '/test/path', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using create_file to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. -- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using write_to_file to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project. - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. * For example, in architect mode trying to edit app.js would be rejected because architect mode can only edit files matching "\\.md$" diff --git a/src/core/prompts/__tests__/sections.test.ts b/src/core/prompts/__tests__/sections.test.ts index 75af4ce6a6b..fe92e63f92e 100644 --- a/src/core/prompts/__tests__/sections.test.ts +++ b/src/core/prompts/__tests__/sections.test.ts @@ -33,24 +33,24 @@ describe("getCapabilitiesSection", () => { const cwd = "/test/path" const mcpHub = undefined const mockDiffStrategy: DiffStrategy = { - getToolDescription: () => "edit_file tool description", + getToolDescription: () => "apply_diff tool description", applyDiff: async (originalContent: string, diffContent: string): Promise => { return { success: true, content: "mock result" } }, } - test("includes edit_file in capabilities when diffStrategy is provided", () => { + test("includes apply_diff in capabilities when diffStrategy is provided", () => { const result = getCapabilitiesSection(cwd, false, mcpHub, mockDiffStrategy) - expect(result).toContain("or create_file") - expect(result).toContain("then use the edit_file or create_file tool") + expect(result).toContain("apply_diff or") + expect(result).toContain("then use the apply_diff or write_to_file tool") }) - test("excludes edit_file from capabilities when diffStrategy is undefined", () => { + test("excludes apply_diff from capabilities when diffStrategy is undefined", () => { const result = getCapabilitiesSection(cwd, false, mcpHub, undefined) - expect(result).not.toContain("or edit_file") - expect(result).toContain("then use the create_file tool") - expect(result).not.toContain("create_file or edit_file") + expect(result).not.toContain("apply_diff or") + expect(result).toContain("then use the write_to_file tool") + expect(result).not.toContain("apply_diff or write_to_file") }) }) diff --git a/src/core/prompts/__tests__/system.test.ts b/src/core/prompts/__tests__/system.test.ts index 5f936fd4058..2adfa927eb6 100644 --- a/src/core/prompts/__tests__/system.test.ts +++ b/src/core/prompts/__tests__/system.test.ts @@ -288,7 +288,7 @@ describe("SYSTEM_PROMPT", () => { true, // enableMcpServerCreation ) - expect(prompt).toContain("edit_file") + expect(prompt).toContain("apply_diff") expect(prompt).toMatchSnapshot() }) @@ -310,7 +310,7 @@ describe("SYSTEM_PROMPT", () => { true, // enableMcpServerCreation ) - expect(prompt).not.toContain("edit_file") + expect(prompt).not.toContain("apply_diff") expect(prompt).toMatchSnapshot() }) @@ -332,7 +332,7 @@ describe("SYSTEM_PROMPT", () => { true, // enableMcpServerCreation ) - expect(prompt).not.toContain("edit_file") + expect(prompt).not.toContain("apply_diff") expect(prompt).toMatchSnapshot() }) @@ -562,8 +562,8 @@ describe("SYSTEM_PROMPT", () => { ) // Verify base instruction lists all available tools - expect(prompt).toContain("edit_file (for replacing lines in existing files)") - expect(prompt).toContain("create_file (for creating new files or complete file rewrites)") + expect(prompt).toContain("apply_diff (for replacing lines in existing files)") + expect(prompt).toContain("write_to_file (for creating new files or complete file rewrites)") expect(prompt).toContain("insert_content (for adding lines to existing files)") expect(prompt).toContain("search_and_replace (for finding and replacing individual pieces of text)") }) @@ -593,7 +593,7 @@ describe("SYSTEM_PROMPT", () => { // Verify detailed instructions for each tool expect(prompt).toContain( - "You should always prefer using other editing tools over create_file when making changes to existing files since create_file is much slower and cannot handle large files.", + "You should always prefer using other editing tools over write_to_file when making changes to existing files since write_to_file is much slower and cannot handle large files.", ) expect(prompt).toContain("The insert_content tool adds lines of text to files") expect(prompt).toContain("The search_and_replace tool finds and replaces text or regex in files") diff --git a/src/core/prompts/sections/capabilities.ts b/src/core/prompts/sections/capabilities.ts index 9cd39bde580..983d07bf761 100644 --- a/src/core/prompts/sections/capabilities.ts +++ b/src/core/prompts/sections/capabilities.ts @@ -17,7 +17,7 @@ CAPABILITIES - When the user initially gives you a task, a recursive list of all filepaths in the current working directory ('${cwd}') will be included in environment_details. This provides an overview of the project's file structure, offering key insights into the project from directory/file names (how developers conceptualize and organize their code) and file extensions (the language used). This can also guide decision-making on which files to explore further. If you need to further explore directories such as outside the current working directory, you can use the list_files tool. If you pass 'true' for the recursive parameter, it will list files recursively. Otherwise, it will list files at the top level, which is better suited for generic directories where you don't necessarily need the nested structure, like the Desktop. - You can use search_files to perform regex searches across files in a specified directory, outputting context-rich results that include surrounding lines. This is particularly useful for understanding code patterns, finding specific implementations, or identifying areas that need refactoring. - You can use the list_code_definition_names tool to get an overview of source code definitions for all files at the top level of a specified directory. This can be particularly useful when you need to understand the broader context and relationships between certain parts of the code. You may need to call this tool multiple times to understand various parts of the codebase related to the task. - - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use ${diffStrategy ? "the edit_file or create_file" : "the create_file"} tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. + - For example, when asked to make edits or improvements you might analyze the file structure in the initial environment_details to get an overview of the project, then use list_code_definition_names to get further insight using source code definitions for files located in relevant directories, then read_file to examine the contents of relevant files, analyze the code and suggest improvements or make necessary edits, then use ${diffStrategy ? "the apply_diff or write_to_file" : "the write_to_file"} tool to apply the changes. If you refactored code that could affect other parts of the codebase, you could use search_files to ensure you update other files as needed. - You can use the execute_command tool to run commands on the user's computer whenever you feel it can help accomplish the user's task. When you need to execute a CLI command, you must provide a clear explanation of what the command does. Prefer to execute complex CLI commands over creating executable scripts, since they are more flexible and easier to run. Interactive and long-running commands are allowed, since the commands are run in the user's VSCode terminal. The user may keep commands running in the background and you will be kept updated on their status along the way. Each command you execute is run in a new terminal instance.${ supportsComputerUse ? "\n- You can use the browser_action tool to interact with websites (including html files and locally running development servers) through a Puppeteer-controlled browser when you feel it is necessary in accomplishing the user's task. This tool is particularly useful for web development tasks as it allows you to launch a browser, navigate to pages, interact with elements through clicks and keyboard input, and capture the results through screenshots and console logs. This tool may be useful at key stages of web development tasks-such as after implementing new features, making substantial changes, when troubleshooting issues, or to verify the result of your work. You can analyze the provided screenshots to ensure correct rendering or identify errors, and review console logs for runtime issues.\n - For example, if asked to add a component to a react website, you might create the necessary files, use execute_command to run the site locally, then use browser_action to launch the browser, navigate to the local server, and verify the component renders & functions correctly before closing the browser." diff --git a/src/core/prompts/sections/mcp-servers.ts b/src/core/prompts/sections/mcp-servers.ts index fd7f520ddd9..3f7ec88297c 100644 --- a/src/core/prompts/sections/mcp-servers.ts +++ b/src/core/prompts/sections/mcp-servers.ts @@ -414,7 +414,7 @@ The user may ask to add tools or resources that may make sense to add to an exis .getServers() .map((server) => server.name) .join(", ") || "(None running currently)" - }, e.g. if it would use the same API. This would be possible if you can locate the MCP server repository on the user's system by looking at the server arguments for a filepath. You might then use list_files and read_file to explore the files in the repository, and use create_file${diffStrategy ? " or edit_file" : ""} to make changes to the files. + }, e.g. if it would use the same API. This would be possible if you can locate the MCP server repository on the user's system by looking at the server arguments for a filepath. You might then use list_files and read_file to explore the files in the repository, and use write_to_file${diffStrategy ? " or apply_diff" : ""} to make changes to the files. However some MCP servers may be running from installed packages rather than a local repository, in which case it may make more sense to create a new MCP server. diff --git a/src/core/prompts/sections/modes.ts b/src/core/prompts/sections/modes.ts index de3cac9c947..f3863870dbc 100644 --- a/src/core/prompts/sections/modes.ts +++ b/src/core/prompts/sections/modes.ts @@ -45,7 +45,7 @@ Both files should follow this structure: "roleDefinition": "You are Roo, a UI/UX expert specializing in design systems and frontend development. Your expertise includes:\\n- Creating and maintaining design systems\\n- Implementing responsive and accessible web interfaces\\n- Working with CSS, HTML, and modern frontend frameworks\\n- Ensuring consistent user experiences across platforms", // Required: non-empty "groups": [ // Required: array of tool groups (can be empty) "read", // Read files group (read_file, search_files, list_files, list_code_definition_names) - "edit", // Edit files group (edit_file, create_file) - allows editing any file + "edit", // Edit files group (apply_diff, write_to_file) - allows editing any file // Or with file restrictions: // ["edit", { fileRegex: "\\.md$", description: "Markdown files only" }], // Edit group that only allows editing markdown files "browser", // Browser group (browser_action) diff --git a/src/core/prompts/sections/rules.ts b/src/core/prompts/sections/rules.ts index e0d65976182..86e554a157e 100644 --- a/src/core/prompts/sections/rules.ts +++ b/src/core/prompts/sections/rules.ts @@ -10,11 +10,11 @@ function getEditingInstructions(diffStrategy?: DiffStrategy, experiments?: Recor // Collect available editing tools if (diffStrategy) { availableTools.push( - "edit_file (for replacing lines in existing files)", - "create_file (for creating new files or complete file rewrites)", + "apply_diff (for replacing lines in existing files)", + "write_to_file (for creating new files or complete file rewrites)", ) } else { - availableTools.push("create_file (for creating new files or complete file rewrites)") + availableTools.push("write_to_file (for creating new files or complete file rewrites)") } if (experiments?.["insert_content"]) { availableTools.push("insert_content (for adding lines to existing files)") @@ -43,12 +43,12 @@ function getEditingInstructions(diffStrategy?: DiffStrategy, experiments?: Recor if (availableTools.length > 1) { instructions.push( - "- You should always prefer using other editing tools over create_file when making changes to existing files since create_file is much slower and cannot handle large files.", + "- You should always prefer using other editing tools over write_to_file when making changes to existing files since write_to_file is much slower and cannot handle large files.", ) } instructions.push( - "- When using the create_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project.", + "- When using the write_to_file tool to modify a file, use the tool directly with the desired content. You do not need to display the content before using the tool. ALWAYS provide the COMPLETE file content in your response. This is NON-NEGOTIABLE. Partial updates or placeholders like '// rest of code unchanged' are STRICTLY FORBIDDEN. You MUST include ALL parts of the file, even if they haven't been modified. Failure to do so will result in incomplete or broken code, severely impacting the user's project.", ) return instructions.join("\n") @@ -68,8 +68,8 @@ RULES - You cannot \`cd\` into a different directory to complete a task. You are stuck operating from '${cwd.toPosix()}', so be sure to pass in the correct 'path' parameter when using tools that require a path. - Do not use the ~ character or $HOME to refer to the home directory. - Before using the execute_command tool, you must first think about the SYSTEM INFORMATION context provided to understand the user's environment and tailor your commands to ensure they are compatible with their system. You must also consider if the command you need to run should be executed in a specific directory outside of the current working directory '${cwd.toPosix()}', and if so prepend with \`cd\`'ing into that directory && then executing the command (as one command since you are stuck operating from '${cwd.toPosix()}'). For example, if you needed to run \`npm install\` in a project outside of '${cwd.toPosix()}', you would need to prepend with a \`cd\` i.e. pseudocode for this would be \`cd (path to project) && (command, in this case npm install)\`. -- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using ${diffStrategy ? "edit_file or create_file" : "create_file"} to make informed changes. -- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the create_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. +- When using the search_files tool, craft your regex patterns carefully to balance specificity and flexibility. Based on the user's task you may use it to find code patterns, TODO comments, function definitions, or any text-based information across the project. The results include context, so analyze the surrounding code to better understand the matches. Leverage the search_files tool in combination with other tools for more comprehensive analysis. For example, use it to find specific code patterns, then use read_file to examine the full context of interesting matches before using ${diffStrategy ? "apply_diff or write_to_file" : "write_to_file"} to make informed changes. +- When creating a new project (such as an app, website, or any software project), organize all new files within a dedicated project directory unless the user specifies otherwise. Use appropriate file paths when writing files, as the write_to_file tool will automatically create any necessary directories. Structure the project logically, adhering to best practices for the specific type of project being created. Unless otherwise specified, new projects should be easily run without additional setup, for example most projects can be built in HTML, CSS, and JavaScript - which you can open in a browser. ${getEditingInstructions(diffStrategy, experiments)} - Some modes have restrictions on which files they can edit. If you attempt to edit a restricted file, the operation will be rejected with a FileRestrictionError that will specify which file patterns are allowed for the current mode. - Be sure to consider the type of project (e.g. Python, JavaScript, web application) when determining the appropriate structure and files to include. Also consider what files may be most relevant to accomplishing the task, for example looking at a project's manifest file would help you understand the project's dependencies, which you could incorporate into any code you write. diff --git a/src/core/prompts/tools/index.ts b/src/core/prompts/tools/index.ts index 6310620aac9..1b9b9a43d9d 100644 --- a/src/core/prompts/tools/index.ts +++ b/src/core/prompts/tools/index.ts @@ -23,7 +23,7 @@ import { ToolArgs } from "./types" const toolDescriptionMap: Record string | undefined> = { execute_command: (args) => getExecuteCommandDescription(args), read_file: (args) => getReadFileDescription(args), - create_file: (args) => getWriteToFileDescription(args), + write_to_file: (args) => getWriteToFileDescription(args), search_files: (args) => getSearchFilesDescription(args), list_files: (args) => getListFilesDescription(args), list_code_definition_names: (args) => getListCodeDefinitionNamesDescription(args), @@ -36,7 +36,7 @@ const toolDescriptionMap: Record string | undefined> new_task: (args) => getNewTaskDescription(args), insert_content: (args) => getInsertContentDescription(args), search_and_replace: (args) => getSearchAndReplaceDescription(args), - edit_file: (args) => + apply_diff: (args) => args.diffStrategy ? args.diffStrategy.getToolDescription({ cwd: args.cwd, toolOptions: args.toolOptions }) : "", } diff --git a/src/core/prompts/tools/write-to-file.ts b/src/core/prompts/tools/write-to-file.ts index 7a20e9b3f4f..c2a311cf361 100644 --- a/src/core/prompts/tools/write-to-file.ts +++ b/src/core/prompts/tools/write-to-file.ts @@ -1,23 +1,23 @@ import { ToolArgs } from "./types" export function getWriteToFileDescription(args: ToolArgs): string { - return `## create_file + return `## write_to_file Description: Request to write full content to a file at the specified path. If the file exists, it will be overwritten with the provided content. If the file doesn't exist, it will be created. This tool will automatically create any directories needed to write the file. Parameters: - path: (required) The path of the file to write to (relative to the current working directory ${args.cwd}) - content: (required) The content to write to the file. ALWAYS provide the COMPLETE intended content of the file, without any truncation or omissions. You MUST include ALL parts of the file, even if they haven't been modified. Do NOT include the line numbers in the content though, just the actual content of the file. - line_count: (required) The number of lines in the file. Make sure to compute this based on the actual content of the file, not the number of lines in the content you're providing. Usage: - + File path here Your file content here total number of lines in the file, including empty lines - + Example: Requesting to write to frontend-config.json - + frontend-config.json { @@ -36,5 +36,5 @@ Example: Requesting to write to frontend-config.json } 14 -` +` } diff --git a/src/core/sliding-window/__tests__/sliding-window.test.ts b/src/core/sliding-window/__tests__/sliding-window.test.ts new file mode 100644 index 00000000000..3dcf9e5fd25 --- /dev/null +++ b/src/core/sliding-window/__tests__/sliding-window.test.ts @@ -0,0 +1,231 @@ +// npx jest src/core/sliding-window/__tests__/sliding-window.test.ts + +import { Anthropic } from "@anthropic-ai/sdk" + +import { ModelInfo } from "../../../shared/api" +import { truncateConversation, truncateConversationIfNeeded } from "../index" + +/** + * Tests for the truncateConversation function + */ +describe("truncateConversation", () => { + it("should retain the first message", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "First message" }, + { role: "assistant", content: "Second message" }, + { role: "user", content: "Third message" }, + ] + + const result = truncateConversation(messages, 0.5) + + // With 2 messages after the first, 0.5 fraction means remove 1 message + // But 1 is odd, so it rounds down to 0 (to make it even) + expect(result.length).toBe(3) // First message + 2 remaining messages + expect(result[0]).toEqual(messages[0]) + expect(result[1]).toEqual(messages[1]) + expect(result[2]).toEqual(messages[2]) + }) + + it("should remove the specified fraction of messages (rounded to even number)", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "First message" }, + { role: "assistant", content: "Second message" }, + { role: "user", content: "Third message" }, + { role: "assistant", content: "Fourth message" }, + { role: "user", content: "Fifth message" }, + ] + + // 4 messages excluding first, 0.5 fraction = 2 messages to remove + // 2 is already even, so no rounding needed + const result = truncateConversation(messages, 0.5) + + expect(result.length).toBe(3) + expect(result[0]).toEqual(messages[0]) + expect(result[1]).toEqual(messages[3]) + expect(result[2]).toEqual(messages[4]) + }) + + it("should round to an even number of messages to remove", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "First message" }, + { role: "assistant", content: "Second message" }, + { role: "user", content: "Third message" }, + { role: "assistant", content: "Fourth message" }, + { role: "user", content: "Fifth message" }, + { role: "assistant", content: "Sixth message" }, + { role: "user", content: "Seventh message" }, + ] + + // 6 messages excluding first, 0.3 fraction = 1.8 messages to remove + // 1.8 rounds down to 1, then to 0 to make it even + const result = truncateConversation(messages, 0.3) + + expect(result.length).toBe(7) // No messages removed + expect(result).toEqual(messages) + }) + + it("should handle edge case with fracToRemove = 0", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "First message" }, + { role: "assistant", content: "Second message" }, + { role: "user", content: "Third message" }, + ] + + const result = truncateConversation(messages, 0) + + expect(result).toEqual(messages) + }) + + it("should handle edge case with fracToRemove = 1", () => { + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "First message" }, + { role: "assistant", content: "Second message" }, + { role: "user", content: "Third message" }, + { role: "assistant", content: "Fourth message" }, + ] + + // 3 messages excluding first, 1.0 fraction = 3 messages to remove + // But 3 is odd, so it rounds down to 2 to make it even + const result = truncateConversation(messages, 1) + + expect(result.length).toBe(2) + expect(result[0]).toEqual(messages[0]) + expect(result[1]).toEqual(messages[3]) + }) +}) + +/** + * Tests for the getMaxTokens function (private but tested through truncateConversationIfNeeded) + */ +describe("getMaxTokens", () => { + // We'll test this indirectly through truncateConversationIfNeeded + const createModelInfo = (contextWindow: number, maxTokens?: number): ModelInfo => ({ + contextWindow, + supportsPromptCache: true, // Not relevant for getMaxTokens + maxTokens, + }) + + // Reuse across tests for consistency + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "First message" }, + { role: "assistant", content: "Second message" }, + { role: "user", content: "Third message" }, + { role: "assistant", content: "Fourth message" }, + { role: "user", content: "Fifth message" }, + ] + + it("should use maxTokens as buffer when specified", () => { + const modelInfo = createModelInfo(100000, 50000) + // Max tokens = 100000 - 50000 = 50000 + + // Below max tokens - no truncation + const result1 = truncateConversationIfNeeded(messages, 49999, modelInfo) + expect(result1).toEqual(messages) + + // Above max tokens - truncate + const result2 = truncateConversationIfNeeded(messages, 50001, modelInfo) + expect(result2).not.toEqual(messages) + expect(result2.length).toBe(3) // Truncated with 0.5 fraction + }) + + it("should use 20% of context window as buffer when maxTokens is undefined", () => { + const modelInfo = createModelInfo(100000, undefined) + // Max tokens = 100000 - (100000 * 0.2) = 80000 + + // Below max tokens - no truncation + const result1 = truncateConversationIfNeeded(messages, 79999, modelInfo) + expect(result1).toEqual(messages) + + // Above max tokens - truncate + const result2 = truncateConversationIfNeeded(messages, 80001, modelInfo) + expect(result2).not.toEqual(messages) + expect(result2.length).toBe(3) // Truncated with 0.5 fraction + }) + + it("should handle small context windows appropriately", () => { + const modelInfo = createModelInfo(50000, 10000) + // Max tokens = 50000 - 10000 = 40000 + + // Below max tokens - no truncation + const result1 = truncateConversationIfNeeded(messages, 39999, modelInfo) + expect(result1).toEqual(messages) + + // Above max tokens - truncate + const result2 = truncateConversationIfNeeded(messages, 40001, modelInfo) + expect(result2).not.toEqual(messages) + expect(result2.length).toBe(3) // Truncated with 0.5 fraction + }) + + it("should handle large context windows appropriately", () => { + const modelInfo = createModelInfo(200000, 30000) + // Max tokens = 200000 - 30000 = 170000 + + // Below max tokens - no truncation + const result1 = truncateConversationIfNeeded(messages, 169999, modelInfo) + expect(result1).toEqual(messages) + + // Above max tokens - truncate + const result2 = truncateConversationIfNeeded(messages, 170001, modelInfo) + expect(result2).not.toEqual(messages) + expect(result2.length).toBe(3) // Truncated with 0.5 fraction + }) +}) + +/** + * Tests for the truncateConversationIfNeeded function + */ +describe("truncateConversationIfNeeded", () => { + const createModelInfo = (contextWindow: number, supportsPromptCache: boolean, maxTokens?: number): ModelInfo => ({ + contextWindow, + supportsPromptCache, + maxTokens, + }) + + const messages: Anthropic.Messages.MessageParam[] = [ + { role: "user", content: "First message" }, + { role: "assistant", content: "Second message" }, + { role: "user", content: "Third message" }, + { role: "assistant", content: "Fourth message" }, + { role: "user", content: "Fifth message" }, + ] + + it("should not truncate if tokens are below max tokens threshold", () => { + const modelInfo = createModelInfo(100000, true, 30000) + const maxTokens = 100000 - 30000 // 70000 + const totalTokens = 69999 // Below threshold + + const result = truncateConversationIfNeeded(messages, totalTokens, modelInfo) + expect(result).toEqual(messages) // No truncation occurs + }) + + it("should truncate if tokens are above max tokens threshold", () => { + const modelInfo = createModelInfo(100000, true, 30000) + const maxTokens = 100000 - 30000 // 70000 + const totalTokens = 70001 // Above threshold + + // When truncating, always uses 0.5 fraction + // With 4 messages after the first, 0.5 fraction means remove 2 messages + const expectedResult = [messages[0], messages[3], messages[4]] + + const result = truncateConversationIfNeeded(messages, totalTokens, modelInfo) + expect(result).toEqual(expectedResult) + }) + + it("should work with non-prompt caching models the same as prompt caching models", () => { + // The implementation no longer differentiates between prompt caching and non-prompt caching models + const modelInfo1 = createModelInfo(100000, true, 30000) + const modelInfo2 = createModelInfo(100000, false, 30000) + + // Test below threshold + const belowThreshold = 69999 + expect(truncateConversationIfNeeded(messages, belowThreshold, modelInfo1)).toEqual( + truncateConversationIfNeeded(messages, belowThreshold, modelInfo2), + ) + + // Test above threshold + const aboveThreshold = 70001 + expect(truncateConversationIfNeeded(messages, aboveThreshold, modelInfo1)).toEqual( + truncateConversationIfNeeded(messages, aboveThreshold, modelInfo2), + ) + }) +}) diff --git a/src/core/sliding-window/index.ts b/src/core/sliding-window/index.ts index ee4a1543e77..a0fff05ea55 100644 --- a/src/core/sliding-window/index.ts +++ b/src/core/sliding-window/index.ts @@ -1,4 +1,5 @@ import { Anthropic } from "@anthropic-ai/sdk" + import { ModelInfo } from "../../shared/api" /** @@ -27,13 +28,9 @@ export function truncateConversation( /** * Conditionally truncates the conversation messages if the total token count exceeds the model's limit. * - * Depending on whether the model supports prompt caching, different maximum token thresholds - * and truncation fractions are used. If the current total tokens exceed the threshold, - * the conversation is truncated using the appropriate fraction. - * * @param {Anthropic.Messages.MessageParam[]} messages - The conversation messages. * @param {number} totalTokens - The total number of tokens in the conversation. - * @param {ModelInfo} modelInfo - Model metadata including context window size and prompt cache support. + * @param {ModelInfo} modelInfo - Model metadata including context window size. * @returns {Anthropic.Messages.MessageParam[]} The original or truncated conversation messages. */ export function truncateConversationIfNeeded( @@ -41,57 +38,16 @@ export function truncateConversationIfNeeded( totalTokens: number, modelInfo: ModelInfo, ): Anthropic.Messages.MessageParam[] { - if (modelInfo.supportsPromptCache) { - return totalTokens < getMaxTokensForPromptCachingModels(modelInfo) - ? messages - : truncateConversation(messages, getTruncFractionForPromptCachingModels(modelInfo)) - } else { - return totalTokens < getMaxTokensForNonPromptCachingModels(modelInfo) - ? messages - : truncateConversation(messages, getTruncFractionForNonPromptCachingModels(modelInfo)) - } -} - -/** - * Calculates the maximum allowed tokens for models that support prompt caching. - * - * The maximum is computed as the greater of (contextWindow - 40000) and 80% of the contextWindow. - * - * @param {ModelInfo} modelInfo - The model information containing the context window size. - * @returns {number} The maximum number of tokens allowed for prompt caching models. - */ -function getMaxTokensForPromptCachingModels(modelInfo: ModelInfo): number { - return Math.max(modelInfo.contextWindow - 40_000, modelInfo.contextWindow * 0.8) -} - -/** - * Provides the fraction of messages to remove for models that support prompt caching. - * - * @param {ModelInfo} modelInfo - The model information (unused in current implementation). - * @returns {number} The truncation fraction for prompt caching models (fixed at 0.5). - */ -function getTruncFractionForPromptCachingModels(modelInfo: ModelInfo): number { - return 0.5 + return totalTokens < getMaxTokens(modelInfo) ? messages : truncateConversation(messages, 0.5) } /** - * Calculates the maximum allowed tokens for models that do not support prompt caching. - * - * The maximum is computed as the greater of (contextWindow - 40000) and 80% of the contextWindow. + * Calculates the maximum allowed tokens * * @param {ModelInfo} modelInfo - The model information containing the context window size. - * @returns {number} The maximum number of tokens allowed for non-prompt caching models. - */ -function getMaxTokensForNonPromptCachingModels(modelInfo: ModelInfo): number { - return Math.max(modelInfo.contextWindow - 40_000, modelInfo.contextWindow * 0.8) -} - -/** - * Provides the fraction of messages to remove for models that do not support prompt caching. - * - * @param {ModelInfo} modelInfo - The model information. - * @returns {number} The truncation fraction for non-prompt caching models (fixed at 0.1). + * @returns {number} The maximum number of tokens allowed */ -function getTruncFractionForNonPromptCachingModels(modelInfo: ModelInfo): number { - return Math.min(40_000 / modelInfo.contextWindow, 0.2) +function getMaxTokens(modelInfo: ModelInfo): number { + // The buffer needs to be at least as large as `modelInfo.maxTokens`, or 20% of the context window if for some reason it's not set. + return modelInfo.contextWindow - (modelInfo.maxTokens || modelInfo.contextWindow * 0.2) } diff --git a/src/core/webview/ClineProvider.ts b/src/core/webview/ClineProvider.ts index 05faa138342..bc6f4578683 100644 --- a/src/core/webview/ClineProvider.ts +++ b/src/core/webview/ClineProvider.ts @@ -8,137 +8,51 @@ import * as path from "path" import * as vscode from "vscode" import simpleGit from "simple-git" -import { buildApiHandler } from "../../api" +import { ApiConfiguration, ApiProvider, ModelInfo } from "../../shared/api" +import { findLast } from "../../shared/array" +import { CustomSupportPrompts, supportPrompt } from "../../shared/support-prompt" +import { GlobalFileNames } from "../../shared/globalFileNames" +import type { SecretKey, GlobalStateKey } from "../../shared/globalState" +import { HistoryItem } from "../../shared/HistoryItem" +import { ApiConfigMeta, ExtensionMessage } from "../../shared/ExtensionMessage" +import { checkoutDiffPayloadSchema, checkoutRestorePayloadSchema, WebviewMessage } from "../../shared/WebviewMessage" +import { Mode, CustomModePrompts, PromptComponent, defaultModeSlug } from "../../shared/modes" +import { checkExistKey } from "../../shared/checkExistApiConfig" +import { EXPERIMENT_IDS, experiments as Experiments, experimentDefault, ExperimentId } from "../../shared/experiments" import { downloadTask } from "../../integrations/misc/export-markdown" import { openFile, openImage } from "../../integrations/misc/open-file" import { selectImages } from "../../integrations/misc/process-images" import { getTheme } from "../../integrations/theme/getTheme" -import { getDiffStrategy } from "../diff/DiffStrategy" import WorkspaceTracker from "../../integrations/workspace/WorkspaceTracker" import { McpHub } from "../../services/mcp/McpHub" -import { ApiConfiguration, ApiProvider, ModelInfo } from "../../shared/api" -import { findLast } from "../../shared/array" -import { ApiConfigMeta, ExtensionMessage } from "../../shared/ExtensionMessage" -import { HistoryItem } from "../../shared/HistoryItem" -import { checkoutDiffPayloadSchema, checkoutRestorePayloadSchema, WebviewMessage } from "../../shared/WebviewMessage" -import { Mode, CustomModePrompts, PromptComponent, defaultModeSlug } from "../../shared/modes" -import { SYSTEM_PROMPT } from "../prompts/system" +import { McpServerManager } from "../../services/mcp/McpServerManager" import { fileExistsAtPath } from "../../utils/fs" -import { Cline } from "../Cline" -import { openMention } from "../mentions" -import { getNonce } from "./getNonce" -import { getUri } from "./getUri" import { playSound, setSoundEnabled, setSoundVolume } from "../../utils/sound" -import { checkExistKey } from "../../shared/checkExistApiConfig" import { singleCompletionHandler } from "../../utils/single-completion-handler" import { searchCommits } from "../../utils/git" +import { getDiffStrategy } from "../diff/DiffStrategy" +import { SYSTEM_PROMPT } from "../prompts/system" import { ConfigManager } from "../config/ConfigManager" import { CustomModesManager } from "../config/CustomModesManager" -import { EXPERIMENT_IDS, experiments as Experiments, experimentDefault, ExperimentId } from "../../shared/experiments" -import { CustomSupportPrompts, supportPrompt } from "../../shared/support-prompt" - +import { buildApiHandler } from "../../api" +import { getOpenRouterModels } from "../../api/providers/openrouter" +import { getGlamaModels } from "../../api/providers/glama" +import { getUnboundModels } from "../../api/providers/unbound" +import { getRequestyModels } from "../../api/providers/requesty" +import { getOpenAiModels } from "../../api/providers/openai" +import { getOllamaModels } from "../../api/providers/ollama" +import { getVsCodeLmModels } from "../../api/providers/vscode-lm" +import { getLmStudioModels } from "../../api/providers/lmstudio" import { ACTION_NAMES } from "../CodeActionProvider" -import { McpServerManager } from "../../services/mcp/McpServerManager" +import { Cline } from "../Cline" +import { openMention } from "../mentions" +import { getNonce } from "./getNonce" +import { getUri } from "./getUri" -/* -https://github.com/microsoft/vscode-webview-ui-toolkit-samples/blob/main/default/weather-webview/src/providers/WeatherViewProvider.ts - -https://github.com/KumarVariable/vscode-extension-sidebar-html/blob/master/src/customSidebarViewProvider.ts -*/ - -type SecretKey = - | "apiKey" - | "glamaApiKey" - | "openRouterApiKey" - | "awsAccessKey" - | "awsSecretKey" - | "awsSessionToken" - | "openAiApiKey" - | "geminiApiKey" - | "openAiNativeApiKey" - | "deepSeekApiKey" - | "mistralApiKey" - | "unboundApiKey" - | "requestyApiKey" -type GlobalStateKey = - | "apiProvider" - | "apiModelId" - | "glamaModelId" - | "glamaModelInfo" - | "awsRegion" - | "awsUseCrossRegionInference" - | "awsProfile" - | "awsUseProfile" - | "vertexProjectId" - | "vertexRegion" - | "lastShownAnnouncementId" - | "customInstructions" - | "alwaysAllowReadOnly" - | "alwaysAllowWrite" - | "alwaysAllowExecute" - | "alwaysAllowBrowser" - | "alwaysAllowMcp" - | "alwaysAllowModeSwitch" - | "taskHistory" - | "openAiBaseUrl" - | "openAiModelId" - | "openAiCustomModelInfo" - | "openAiUseAzure" - | "ollamaModelId" - | "ollamaBaseUrl" - | "lmStudioModelId" - | "lmStudioBaseUrl" - | "anthropicBaseUrl" - | "azureApiVersion" - | "openAiStreamingEnabled" - | "openRouterModelId" - | "openRouterModelInfo" - | "openRouterBaseUrl" - | "openRouterUseMiddleOutTransform" - | "allowedCommands" - | "soundEnabled" - | "soundVolume" - | "diffEnabled" - | "checkpointsEnabled" - | "browserViewportSize" - | "screenshotQuality" - | "fuzzyMatchThreshold" - | "preferredLanguage" // Language setting for Cline's communication - | "writeDelayMs" - | "terminalOutputLineLimit" - | "mcpEnabled" - | "enableMcpServerCreation" - | "alwaysApproveResubmit" - | "requestDelaySeconds" - | "rateLimitSeconds" - | "currentApiConfigName" - | "listApiConfigMeta" - | "vsCodeLmModelSelector" - | "mode" - | "modeApiConfigs" - | "customModePrompts" - | "customSupportPrompts" - | "enhancementApiConfigId" - | "experiments" // Map of experiment IDs to their enabled state - | "autoApprovalEnabled" - | "customModes" // Array of custom modes - | "unboundModelId" - | "requestyModelId" - | "requestyModelInfo" - | "unboundModelInfo" - | "modelTemperature" - | "mistralCodestralUrl" - | "maxOpenTabsContext" - -export const GlobalFileNames = { - apiConversationHistory: "api_conversation_history.json", - uiMessages: "ui_messages.json", - glamaModels: "glama_models.json", - openRouterModels: "openrouter_models.json", - requestyModels: "requesty_models.json", - mcpSettings: "cline_mcp_settings.json", - unboundModels: "unbound_models.json", -} +/** + * https://github.com/microsoft/vscode-webview-ui-toolkit-samples/blob/main/default/weather-webview/src/providers/WeatherViewProvider.ts + * https://github.com/KumarVariable/vscode-extension-sidebar-html/blob/master/src/customSidebarViewProvider.ts + */ export class ClineProvider implements vscode.WebviewViewProvider { public static readonly sideBarId = "roo-cline.SidebarProvider" // used in package.json as the view's id. This value cannot be changed due to how vscode caches views based on their id, and updating the id would break existing instances of the extension. @@ -413,18 +327,17 @@ export class ClineProvider implements vscode.WebviewViewProvider { const modePrompt = customModePrompts?.[mode] as PromptComponent const effectiveInstructions = [globalInstructions, modePrompt?.customInstructions].filter(Boolean).join("\n\n") - this.cline = new Cline( - this, + this.cline = new Cline({ + provider: this, apiConfiguration, - effectiveInstructions, - diffEnabled, - checkpointsEnabled, + customInstructions: effectiveInstructions, + enableDiff: diffEnabled, + enableCheckpoints: checkpointsEnabled, fuzzyMatchThreshold, task, images, - undefined, experiments, - ) + }) } public async initClineWithHistoryItem(historyItem: HistoryItem) { @@ -444,18 +357,16 @@ export class ClineProvider implements vscode.WebviewViewProvider { const modePrompt = customModePrompts?.[mode] as PromptComponent const effectiveInstructions = [globalInstructions, modePrompt?.customInstructions].filter(Boolean).join("\n\n") - this.cline = new Cline( - this, + this.cline = new Cline({ + provider: this, apiConfiguration, - effectiveInstructions, - diffEnabled, - checkpointsEnabled, + customInstructions: effectiveInstructions, + enableDiff: diffEnabled, + enableCheckpoints: checkpointsEnabled, fuzzyMatchThreshold, - undefined, - undefined, historyItem, experiments, - ) + }) } public async postMessageToWebview(message: ExtensionMessage) { @@ -621,15 +532,10 @@ export class ClineProvider implements vscode.WebviewViewProvider { this.postStateToWebview() this.workspaceTracker?.initializeFilePaths() // don't await + getTheme().then((theme) => this.postMessageToWebview({ type: "theme", text: JSON.stringify(theme) }), ) - // post last cached models in case the call to endpoint fails - this.readOpenRouterModels().then((openRouterModels) => { - if (openRouterModels) { - this.postMessageToWebview({ type: "openRouterModels", openRouterModels }) - } - }) // If MCP Hub is already initialized, update the webview with current server list if (this.mcpHub) { @@ -639,13 +545,37 @@ export class ClineProvider implements vscode.WebviewViewProvider { }) } - // gui relies on model info to be up-to-date to provide the most accurate pricing, so we need to fetch the latest details on launch. - // we do this for all users since many users switch between api providers and if they were to switch back to openrouter it would be showing outdated model info if we hadn't retrieved the latest at this point - // (see normalizeApiConfiguration > openrouter) - this.refreshOpenRouterModels().then(async (openRouterModels) => { + const cacheDir = await this.ensureCacheDirectoryExists() + + // Post last cached models in case the call to endpoint fails. + this.readModelsFromCache(GlobalFileNames.openRouterModels).then((openRouterModels) => { if (openRouterModels) { - // update model info in state (this needs to be done here since we don't want to update state while settings is open, and we may refresh models there) + this.postMessageToWebview({ type: "openRouterModels", openRouterModels }) + } + }) + + // GUI relies on model info to be up-to-date to provide + // the most accurate pricing, so we need to fetch the + // latest details on launch. + // We do this for all users since many users switch + // between api providers and if they were to switch back + // to OpenRouter it would be showing outdated model info + // if we hadn't retrieved the latest at this point + // (see normalizeApiConfiguration > openrouter). + getOpenRouterModels().then(async (openRouterModels) => { + if (Object.keys(openRouterModels).length > 0) { + await fs.writeFile( + path.join(cacheDir, GlobalFileNames.openRouterModels), + JSON.stringify(openRouterModels), + ) + await this.postMessageToWebview({ type: "openRouterModels", openRouterModels }) + + // Update model info in state (this needs to be + // done here since we don't want to update state + // while settings is open, and we may refresh + // models there). const { apiConfiguration } = await this.getState() + if (apiConfiguration.openRouterModelId) { await this.updateGlobalState( "openRouterModelInfo", @@ -655,15 +585,23 @@ export class ClineProvider implements vscode.WebviewViewProvider { } } }) - this.readGlamaModels().then((glamaModels) => { + + this.readModelsFromCache(GlobalFileNames.glamaModels).then((glamaModels) => { if (glamaModels) { this.postMessageToWebview({ type: "glamaModels", glamaModels }) } }) - this.refreshGlamaModels().then(async (glamaModels) => { - if (glamaModels) { - // update model info in state (this needs to be done here since we don't want to update state while settings is open, and we may refresh models there) + + getGlamaModels().then(async (glamaModels) => { + if (Object.keys(glamaModels).length > 0) { + await fs.writeFile( + path.join(cacheDir, GlobalFileNames.glamaModels), + JSON.stringify(glamaModels), + ) + await this.postMessageToWebview({ type: "glamaModels", glamaModels }) + const { apiConfiguration } = await this.getState() + if (apiConfiguration.glamaModelId) { await this.updateGlobalState( "glamaModelInfo", @@ -674,14 +612,22 @@ export class ClineProvider implements vscode.WebviewViewProvider { } }) - this.readUnboundModels().then((unboundModels) => { + this.readModelsFromCache(GlobalFileNames.unboundModels).then((unboundModels) => { if (unboundModels) { this.postMessageToWebview({ type: "unboundModels", unboundModels }) } }) - this.refreshUnboundModels().then(async (unboundModels) => { - if (unboundModels) { + + getUnboundModels().then(async (unboundModels) => { + if (Object.keys(unboundModels).length > 0) { + await fs.writeFile( + path.join(cacheDir, GlobalFileNames.unboundModels), + JSON.stringify(unboundModels), + ) + await this.postMessageToWebview({ type: "unboundModels", unboundModels }) + const { apiConfiguration } = await this.getState() + if (apiConfiguration?.unboundModelId) { await this.updateGlobalState( "unboundModelInfo", @@ -692,15 +638,22 @@ export class ClineProvider implements vscode.WebviewViewProvider { } }) - this.readRequestyModels().then((requestyModels) => { + this.readModelsFromCache(GlobalFileNames.requestyModels).then((requestyModels) => { if (requestyModels) { this.postMessageToWebview({ type: "requestyModels", requestyModels }) } }) - this.refreshRequestyModels().then(async (requestyModels) => { - if (requestyModels) { - // update model info in state (this needs to be done here since we don't want to update state while settings is open, and we may refresh models there) + + getRequestyModels().then(async (requestyModels) => { + if (Object.keys(requestyModels).length > 0) { + await fs.writeFile( + path.join(cacheDir, GlobalFileNames.requestyModels), + JSON.stringify(requestyModels), + ) + await this.postMessageToWebview({ type: "requestyModels", requestyModels }) + const { apiConfiguration } = await this.getState() + if (apiConfiguration.requestyModelId) { await this.updateGlobalState( "requestyModelInfo", @@ -843,41 +796,82 @@ export class ClineProvider implements vscode.WebviewViewProvider { case "resetState": await this.resetState() break - case "requestOllamaModels": - const ollamaModels = await this.getOllamaModels(message.text) - this.postMessageToWebview({ type: "ollamaModels", ollamaModels }) - break - case "requestLmStudioModels": - const lmStudioModels = await this.getLmStudioModels(message.text) - this.postMessageToWebview({ type: "lmStudioModels", lmStudioModels }) - break - case "requestVsCodeLmModels": - const vsCodeLmModels = await this.getVsCodeLmModels() - this.postMessageToWebview({ type: "vsCodeLmModels", vsCodeLmModels }) + case "refreshOpenRouterModels": + const openRouterModels = await getOpenRouterModels() + + if (Object.keys(openRouterModels).length > 0) { + const cacheDir = await this.ensureCacheDirectoryExists() + await fs.writeFile( + path.join(cacheDir, GlobalFileNames.openRouterModels), + JSON.stringify(openRouterModels), + ) + await this.postMessageToWebview({ type: "openRouterModels", openRouterModels }) + } + break case "refreshGlamaModels": - await this.refreshGlamaModels() + const glamaModels = await getGlamaModels() + + if (Object.keys(glamaModels).length > 0) { + const cacheDir = await this.ensureCacheDirectoryExists() + await fs.writeFile( + path.join(cacheDir, GlobalFileNames.glamaModels), + JSON.stringify(glamaModels), + ) + await this.postMessageToWebview({ type: "glamaModels", glamaModels }) + } + break - case "refreshOpenRouterModels": - await this.refreshOpenRouterModels() + case "refreshUnboundModels": + const unboundModels = await getUnboundModels() + + if (Object.keys(unboundModels).length > 0) { + const cacheDir = await this.ensureCacheDirectoryExists() + await fs.writeFile( + path.join(cacheDir, GlobalFileNames.unboundModels), + JSON.stringify(unboundModels), + ) + await this.postMessageToWebview({ type: "unboundModels", unboundModels }) + } + + break + case "refreshRequestyModels": + const requestyModels = await getRequestyModels() + + if (Object.keys(requestyModels).length > 0) { + const cacheDir = await this.ensureCacheDirectoryExists() + await fs.writeFile( + path.join(cacheDir, GlobalFileNames.requestyModels), + JSON.stringify(requestyModels), + ) + await this.postMessageToWebview({ type: "requestyModels", requestyModels }) + } + break case "refreshOpenAiModels": if (message?.values?.baseUrl && message?.values?.apiKey) { - const openAiModels = await this.getOpenAiModels( + const openAiModels = await getOpenAiModels( message?.values?.baseUrl, message?.values?.apiKey, ) this.postMessageToWebview({ type: "openAiModels", openAiModels }) } + break - case "refreshUnboundModels": - await this.refreshUnboundModels() + case "requestOllamaModels": + const ollamaModels = await getOllamaModels(message.text) + // TODO: Cache like we do for OpenRouter, etc? + this.postMessageToWebview({ type: "ollamaModels", ollamaModels }) break - case "refreshRequestyModels": - if (message?.values?.apiKey) { - const requestyModels = await this.refreshRequestyModels(message?.values?.apiKey) - this.postMessageToWebview({ type: "requestyModels", requestyModels: requestyModels }) - } + case "requestLmStudioModels": + const lmStudioModels = await getLmStudioModels(message.text) + // TODO: Cache like we do for OpenRouter, etc? + this.postMessageToWebview({ type: "lmStudioModels", lmStudioModels }) + break + case "requestVsCodeLmModels": + const vsCodeLmModels = await getVsCodeLmModels() + // TODO: Cache like we do for OpenRouter, etc? + this.postMessageToWebview({ type: "vsCodeLmModels", vsCodeLmModels }) break case "openImage": openImage(message.text!) @@ -1657,6 +1651,7 @@ export class ClineProvider implements vscode.WebviewViewProvider { lmStudioModelId, lmStudioBaseUrl, anthropicBaseUrl, + anthropicThinking, geminiApiKey, openAiNativeApiKey, deepSeekApiKey, @@ -1704,6 +1699,7 @@ export class ClineProvider implements vscode.WebviewViewProvider { this.updateGlobalState("lmStudioModelId", lmStudioModelId), this.updateGlobalState("lmStudioBaseUrl", lmStudioBaseUrl), this.updateGlobalState("anthropicBaseUrl", anthropicBaseUrl), + this.updateGlobalState("anthropicThinking", anthropicThinking), this.storeSecret("geminiApiKey", geminiApiKey), this.storeSecret("openAiNativeApiKey", openAiNativeApiKey), this.storeSecret("deepSeekApiKey", deepSeekApiKey), @@ -1789,173 +1785,22 @@ export class ClineProvider implements vscode.WebviewViewProvider { return settingsDir } - // Ollama - - async getOllamaModels(baseUrl?: string) { - try { - if (!baseUrl) { - baseUrl = "http://localhost:11434" - } - if (!URL.canParse(baseUrl)) { - return [] - } - const response = await axios.get(`${baseUrl}/api/tags`) - const modelsArray = response.data?.models?.map((model: any) => model.name) || [] - const models = [...new Set(modelsArray)] - return models - } catch (error) { - return [] - } - } - - // LM Studio - - async getLmStudioModels(baseUrl?: string) { - try { - if (!baseUrl) { - baseUrl = "http://localhost:1234" - } - if (!URL.canParse(baseUrl)) { - return [] - } - const response = await axios.get(`${baseUrl}/v1/models`) - const modelsArray = response.data?.data?.map((model: any) => model.id) || [] - const models = [...new Set(modelsArray)] - return models - } catch (error) { - return [] - } - } - - // VSCode LM API - private async getVsCodeLmModels() { - try { - const models = await vscode.lm.selectChatModels({}) - return models || [] - } catch (error) { - this.outputChannel.appendLine( - `Error fetching VS Code LM models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`, - ) - return [] - } + private async ensureCacheDirectoryExists() { + const cacheDir = path.join(this.context.globalStorageUri.fsPath, "cache") + await fs.mkdir(cacheDir, { recursive: true }) + return cacheDir } - // OpenAi - - async getOpenAiModels(baseUrl?: string, apiKey?: string) { - try { - if (!baseUrl) { - return [] - } - - if (!URL.canParse(baseUrl)) { - return [] - } - - const config: Record = {} - if (apiKey) { - config["headers"] = { Authorization: `Bearer ${apiKey}` } - } - - const response = await axios.get(`${baseUrl}/models`, config) - const modelsArray = response.data?.data?.map((model: any) => model.id) || [] - const models = [...new Set(modelsArray)] - return models - } catch (error) { - return [] - } - } + private async readModelsFromCache(filename: string): Promise | undefined> { + const filePath = path.join(await this.ensureCacheDirectoryExists(), filename) + const fileExists = await fileExistsAtPath(filePath) - // Requesty - async readRequestyModels(): Promise | undefined> { - const requestyModelsFilePath = path.join( - await this.ensureCacheDirectoryExists(), - GlobalFileNames.requestyModels, - ) - const fileExists = await fileExistsAtPath(requestyModelsFilePath) if (fileExists) { - const fileContents = await fs.readFile(requestyModelsFilePath, "utf8") + const fileContents = await fs.readFile(filePath, "utf8") return JSON.parse(fileContents) } - return undefined - } - async refreshRequestyModels(apiKey?: string) { - const requestyModelsFilePath = path.join( - await this.ensureCacheDirectoryExists(), - GlobalFileNames.requestyModels, - ) - - const models: Record = {} - try { - const config: Record = {} - if (!apiKey) { - apiKey = (await this.getSecret("requestyApiKey")) as string - } - - if (!apiKey) { - this.outputChannel.appendLine("No Requesty API key found") - return models - } - - if (apiKey) { - config["headers"] = { Authorization: `Bearer ${apiKey}` } - } - - const response = await axios.get("https://router.requesty.ai/v1/models", config) - /* - { - "id": "anthropic/claude-3-5-sonnet-20240620", - "object": "model", - "created": 1738243330, - "owned_by": "system", - "input_price": 0.000003, - "caching_price": 0.00000375, - "cached_price": 3E-7, - "output_price": 0.000015, - "max_output_tokens": 8192, - "context_window": 200000, - "supports_caching": true, - "description": "Anthropic's most intelligent model. Highest level of intelligence and capability" - }, - } - */ - if (response.data) { - const rawModels = response.data.data - const parsePrice = (price: any) => { - if (price) { - return parseFloat(price) * 1_000_000 - } - return undefined - } - for (const rawModel of rawModels) { - const modelInfo: ModelInfo = { - maxTokens: rawModel.max_output_tokens, - contextWindow: rawModel.context_window, - supportsImages: rawModel.support_image, - supportsComputerUse: rawModel.support_computer_use, - supportsPromptCache: rawModel.supports_caching, - inputPrice: parsePrice(rawModel.input_price), - outputPrice: parsePrice(rawModel.output_price), - description: rawModel.description, - cacheWritesPrice: parsePrice(rawModel.caching_price), - cacheReadsPrice: parsePrice(rawModel.cached_price), - } - - models[rawModel.id] = modelInfo - } - } else { - this.outputChannel.appendLine("Invalid response from Requesty API") - } - await fs.writeFile(requestyModelsFilePath, JSON.stringify(models)) - } catch (error) { - this.outputChannel.appendLine( - `Error fetching Requesty models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`, - ) - } - - await this.postMessageToWebview({ type: "requestyModels", requestyModels: models }) - return models + return undefined } // OpenRouter @@ -1986,11 +1831,7 @@ export class ClineProvider implements vscode.WebviewViewProvider { // await this.postMessageToWebview({ type: "action", action: "settingsButtonClicked" }) // bad ux if user is on welcome } - private async ensureCacheDirectoryExists(): Promise { - const cacheDir = path.join(this.context.globalStorageUri.fsPath, "cache") - await fs.mkdir(cacheDir, { recursive: true }) - return cacheDir - } + // Glama async handleGlamaCallback(code: string) { let apiKey: string @@ -2021,246 +1862,6 @@ export class ClineProvider implements vscode.WebviewViewProvider { // await this.postMessageToWebview({ type: "action", action: "settingsButtonClicked" }) // bad ux if user is on welcome } - private async readModelsFromCache(filename: string): Promise | undefined> { - const filePath = path.join(await this.ensureCacheDirectoryExists(), filename) - const fileExists = await fileExistsAtPath(filePath) - if (fileExists) { - const fileContents = await fs.readFile(filePath, "utf8") - return JSON.parse(fileContents) - } - return undefined - } - - async readGlamaModels(): Promise | undefined> { - return this.readModelsFromCache(GlobalFileNames.glamaModels) - } - - async refreshGlamaModels() { - const glamaModelsFilePath = path.join(await this.ensureCacheDirectoryExists(), GlobalFileNames.glamaModels) - - const models: Record = {} - try { - const response = await axios.get("https://glama.ai/api/gateway/v1/models") - /* - { - "added": "2024-12-24T15:12:49.324Z", - "capabilities": [ - "adjustable_safety_settings", - "caching", - "code_execution", - "function_calling", - "json_mode", - "json_schema", - "system_instructions", - "tuning", - "input:audio", - "input:image", - "input:text", - "input:video", - "output:text" - ], - "id": "google-vertex/gemini-1.5-flash-002", - "maxTokensInput": 1048576, - "maxTokensOutput": 8192, - "pricePerToken": { - "cacheRead": null, - "cacheWrite": null, - "input": "0.000000075", - "output": "0.0000003" - } - } - */ - if (response.data) { - const rawModels = response.data - const parsePrice = (price: any) => { - if (price) { - return parseFloat(price) * 1_000_000 - } - return undefined - } - for (const rawModel of rawModels) { - const modelInfo: ModelInfo = { - maxTokens: rawModel.maxTokensOutput, - contextWindow: rawModel.maxTokensInput, - supportsImages: rawModel.capabilities?.includes("input:image"), - supportsComputerUse: rawModel.capabilities?.includes("computer_use"), - supportsPromptCache: rawModel.capabilities?.includes("caching"), - inputPrice: parsePrice(rawModel.pricePerToken?.input), - outputPrice: parsePrice(rawModel.pricePerToken?.output), - description: undefined, - cacheWritesPrice: parsePrice(rawModel.pricePerToken?.cacheWrite), - cacheReadsPrice: parsePrice(rawModel.pricePerToken?.cacheRead), - } - - models[rawModel.id] = modelInfo - } - } else { - this.outputChannel.appendLine("Invalid response from Glama API") - } - await fs.writeFile(glamaModelsFilePath, JSON.stringify(models)) - } catch (error) { - this.outputChannel.appendLine( - `Error fetching Glama models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`, - ) - } - - await this.postMessageToWebview({ type: "glamaModels", glamaModels: models }) - return models - } - - async readOpenRouterModels(): Promise | undefined> { - return this.readModelsFromCache(GlobalFileNames.openRouterModels) - } - - async refreshOpenRouterModels() { - const openRouterModelsFilePath = path.join( - await this.ensureCacheDirectoryExists(), - GlobalFileNames.openRouterModels, - ) - - const models: Record = {} - try { - const response = await axios.get("https://openrouter.ai/api/v1/models") - /* - { - "id": "anthropic/claude-3.5-sonnet", - "name": "Anthropic: Claude 3.5 Sonnet", - "created": 1718841600, - "description": "Claude 3.5 Sonnet delivers better-than-Opus capabilities, faster-than-Sonnet speeds, at the same Sonnet prices. Sonnet is particularly good at:\n\n- Coding: Autonomously writes, edits, and runs code with reasoning and troubleshooting\n- Data science: Augments human data science expertise; navigates unstructured data while using multiple tools for insights\n- Visual processing: excelling at interpreting charts, graphs, and images, accurately transcribing text to derive insights beyond just the text alone\n- Agentic tasks: exceptional tool use, making it great at agentic tasks (i.e. complex, multi-step problem solving tasks that require engaging with other systems)\n\n#multimodal", - "context_length": 200000, - "architecture": { - "modality": "text+image-\u003Etext", - "tokenizer": "Claude", - "instruct_type": null - }, - "pricing": { - "prompt": "0.000003", - "completion": "0.000015", - "image": "0.0048", - "request": "0" - }, - "top_provider": { - "context_length": 200000, - "max_completion_tokens": 8192, - "is_moderated": true - }, - "per_request_limits": null - }, - */ - if (response.data?.data) { - const rawModels = response.data.data - const parsePrice = (price: any) => { - if (price) { - return parseFloat(price) * 1_000_000 - } - return undefined - } - for (const rawModel of rawModels) { - const modelInfo: ModelInfo = { - maxTokens: rawModel.top_provider?.max_completion_tokens, - contextWindow: rawModel.context_length, - supportsImages: rawModel.architecture?.modality?.includes("image"), - supportsPromptCache: false, - inputPrice: parsePrice(rawModel.pricing?.prompt), - outputPrice: parsePrice(rawModel.pricing?.completion), - description: rawModel.description, - } - - switch (rawModel.id) { - case "anthropic/claude-3.5-sonnet": - case "anthropic/claude-3.5-sonnet:beta": - // NOTE: this needs to be synced with api.ts/openrouter default model info - modelInfo.supportsComputerUse = true - modelInfo.supportsPromptCache = true - modelInfo.cacheWritesPrice = 3.75 - modelInfo.cacheReadsPrice = 0.3 - break - case "anthropic/claude-3.5-sonnet-20240620": - case "anthropic/claude-3.5-sonnet-20240620:beta": - modelInfo.supportsPromptCache = true - modelInfo.cacheWritesPrice = 3.75 - modelInfo.cacheReadsPrice = 0.3 - break - case "anthropic/claude-3-5-haiku": - case "anthropic/claude-3-5-haiku:beta": - case "anthropic/claude-3-5-haiku-20241022": - case "anthropic/claude-3-5-haiku-20241022:beta": - case "anthropic/claude-3.5-haiku": - case "anthropic/claude-3.5-haiku:beta": - case "anthropic/claude-3.5-haiku-20241022": - case "anthropic/claude-3.5-haiku-20241022:beta": - modelInfo.supportsPromptCache = true - modelInfo.cacheWritesPrice = 1.25 - modelInfo.cacheReadsPrice = 0.1 - break - case "anthropic/claude-3-opus": - case "anthropic/claude-3-opus:beta": - modelInfo.supportsPromptCache = true - modelInfo.cacheWritesPrice = 18.75 - modelInfo.cacheReadsPrice = 1.5 - break - case "anthropic/claude-3-haiku": - case "anthropic/claude-3-haiku:beta": - modelInfo.supportsPromptCache = true - modelInfo.cacheWritesPrice = 0.3 - modelInfo.cacheReadsPrice = 0.03 - break - } - - models[rawModel.id] = modelInfo - } - } else { - this.outputChannel.appendLine("Invalid response from OpenRouter API") - } - await fs.writeFile(openRouterModelsFilePath, JSON.stringify(models)) - } catch (error) { - this.outputChannel.appendLine( - `Error fetching OpenRouter models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`, - ) - } - - await this.postMessageToWebview({ type: "openRouterModels", openRouterModels: models }) - return models - } - - async readUnboundModels(): Promise | undefined> { - return this.readModelsFromCache(GlobalFileNames.unboundModels) - } - - async refreshUnboundModels() { - const unboundModelsFilePath = path.join(await this.ensureCacheDirectoryExists(), GlobalFileNames.unboundModels) - - const models: Record = {} - try { - const response = await axios.get("https://api.getunbound.ai/models") - - if (response.data) { - const rawModels: Record = response.data - for (const [modelId, model] of Object.entries(rawModels)) { - models[modelId] = { - maxTokens: model?.maxTokens ? parseInt(model.maxTokens) : undefined, - contextWindow: model?.contextWindow ? parseInt(model.contextWindow) : 0, - supportsImages: model?.supportsImages ?? false, - supportsPromptCache: model?.supportsPromptCaching ?? false, - supportsComputerUse: model?.supportsComputerUse ?? false, - inputPrice: model?.inputTokenPrice ? parseFloat(model.inputTokenPrice) : undefined, - outputPrice: model?.outputTokenPrice ? parseFloat(model.outputTokenPrice) : undefined, - cacheWritesPrice: model?.cacheWritePrice ? parseFloat(model.cacheWritePrice) : undefined, - cacheReadsPrice: model?.cacheReadPrice ? parseFloat(model.cacheReadPrice) : undefined, - } - } - } - await fs.writeFile(unboundModelsFilePath, JSON.stringify(models)) - } catch (error) { - this.outputChannel.appendLine( - `Error fetching Unbound models: ${JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}`, - ) - } - - await this.postMessageToWebview({ type: "unboundModels", unboundModels: models }) - return models - } - // Task history async getTaskWithId(id: string): Promise<{ @@ -2423,6 +2024,8 @@ export class ClineProvider implements vscode.WebviewViewProvider { const allowedCommands = vscode.workspace.getConfiguration("roo-cline").get("allowedCommands") || [] + const cwd = vscode.workspace.workspaceFolders?.map((folder) => folder.uri.fsPath).at(0) || "" + return { version: this.context.extension?.packageJSON?.version ?? "", apiConfiguration, @@ -2469,6 +2072,7 @@ export class ClineProvider implements vscode.WebviewViewProvider { experiments: experiments ?? experimentDefault, mcpServers: this.mcpHub?.getAllServers() ?? [], maxOpenTabsContext: maxOpenTabsContext ?? 20, + cwd: cwd, } } @@ -2551,6 +2155,7 @@ export class ClineProvider implements vscode.WebviewViewProvider { lmStudioModelId, lmStudioBaseUrl, anthropicBaseUrl, + anthropicThinking, geminiApiKey, openAiNativeApiKey, deepSeekApiKey, @@ -2633,6 +2238,7 @@ export class ClineProvider implements vscode.WebviewViewProvider { this.getGlobalState("lmStudioModelId") as Promise, this.getGlobalState("lmStudioBaseUrl") as Promise, this.getGlobalState("anthropicBaseUrl") as Promise, + this.getGlobalState("anthropicThinking") as Promise, this.getSecret("geminiApiKey") as Promise, this.getSecret("openAiNativeApiKey") as Promise, this.getSecret("deepSeekApiKey") as Promise, @@ -2732,6 +2338,7 @@ export class ClineProvider implements vscode.WebviewViewProvider { lmStudioModelId, lmStudioBaseUrl, anthropicBaseUrl, + anthropicThinking, geminiApiKey, openAiNativeApiKey, deepSeekApiKey, @@ -2844,26 +2451,6 @@ export class ClineProvider implements vscode.WebviewViewProvider { return await this.context.globalState.get(key) } - // workspace - - private async updateWorkspaceState(key: string, value: any) { - await this.context.workspaceState.update(key, value) - } - - private async getWorkspaceState(key: string) { - return await this.context.workspaceState.get(key) - } - - // private async clearState() { - // this.context.workspaceState.keys().forEach((key) => { - // this.context.workspaceState.update(key, undefined) - // }) - // this.context.globalState.keys().forEach((key) => { - // this.context.globalState.update(key, undefined) - // }) - // this.context.secrets.delete("apiKey") - // } - // secrets public async storeSecret(key: SecretKey, value?: string) { diff --git a/src/core/webview/__tests__/ClineProvider.test.ts b/src/core/webview/__tests__/ClineProvider.test.ts index 902e536d9c8..6449cc93bec 100644 --- a/src/core/webview/__tests__/ClineProvider.test.ts +++ b/src/core/webview/__tests__/ClineProvider.test.ts @@ -107,7 +107,7 @@ jest.mock( // Mock DiffStrategy jest.mock("../../diff/DiffStrategy", () => ({ getDiffStrategy: jest.fn().mockImplementation(() => ({ - getToolDescription: jest.fn().mockReturnValue("edit_file tool description"), + getToolDescription: jest.fn().mockReturnValue("apply_diff tool description"), })), })) @@ -690,19 +690,18 @@ describe("ClineProvider", () => { await provider.initClineWithTask("Test task") // Verify Cline was initialized with mode-specific instructions - expect(Cline).toHaveBeenCalledWith( + expect(Cline).toHaveBeenCalledWith({ provider, - mockApiConfig, - modeCustomInstructions, - true, - false, - 1.0, - "Test task", - undefined, - undefined, - experimentDefault, - ) + apiConfiguration: mockApiConfig, + customInstructions: modeCustomInstructions, + enableDiff: true, + enableCheckpoints: false, + fuzzyMatchThreshold: 1.0, + task: "Test task", + experiments: experimentDefault, + }) }) + test("handles mode-specific custom instructions updates", async () => { await provider.resolveWebviewView(mockWebviewView) const messageHandler = (mockWebviewView.webview.onDidReceiveMessage as jest.Mock).mock.calls[0][0] diff --git a/src/integrations/misc/export-markdown.ts b/src/integrations/misc/export-markdown.ts index 2aa9d7b6edc..05b31671d85 100644 --- a/src/integrations/misc/export-markdown.ts +++ b/src/integrations/misc/export-markdown.ts @@ -41,14 +41,7 @@ export async function downloadTask(dateTs: number, conversationHistory: Anthropi } } -export function formatContentBlockToMarkdown( - block: - | Anthropic.TextBlockParam - | Anthropic.ImageBlockParam - | Anthropic.ToolUseBlockParam - | Anthropic.ToolResultBlockParam, - // messages: Anthropic.MessageParam[] -): string { +export function formatContentBlockToMarkdown(block: Anthropic.Messages.ContentBlockParam): string { switch (block.type) { case "text": return block.text diff --git a/src/services/mcp/McpHub.ts b/src/services/mcp/McpHub.ts index 6e3f39fa7db..6c906c7cf89 100644 --- a/src/services/mcp/McpHub.ts +++ b/src/services/mcp/McpHub.ts @@ -14,7 +14,9 @@ import * as fs from "fs/promises" import * as path from "path" import * as vscode from "vscode" import { z } from "zod" -import { ClineProvider, GlobalFileNames } from "../../core/webview/ClineProvider" + +import { ClineProvider } from "../../core/webview/ClineProvider" +import { GlobalFileNames } from "../../shared/globalFileNames" import { McpResource, McpResourceResponse, diff --git a/src/shared/ExtensionMessage.ts b/src/shared/ExtensionMessage.ts index 5d0e16e39cd..e87edffed16 100644 --- a/src/shared/ExtensionMessage.ts +++ b/src/shared/ExtensionMessage.ts @@ -27,10 +27,11 @@ export interface ExtensionMessage { | "workspaceUpdated" | "invoke" | "partialMessage" - | "glamaModels" | "openRouterModels" - | "openAiModels" + | "glamaModels" + | "unboundModels" | "requestyModels" + | "openAiModels" | "mcpServers" | "enhancedPrompt" | "commitSearchResults" @@ -43,8 +44,6 @@ export interface ExtensionMessage { | "autoApprovalEnabled" | "updateCustomMode" | "deleteCustomMode" - | "unboundModels" - | "refreshUnboundModels" | "currentCheckpointUpdated" text?: string action?: @@ -67,11 +66,11 @@ export interface ExtensionMessage { path?: string }> partialMessage?: ClineMessage + openRouterModels?: Record glamaModels?: Record + unboundModels?: Record requestyModels?: Record - openRouterModels?: Record openAiModels?: string[] - unboundModels?: Record mcpServers?: McpServer[] commits?: GitCommit[] listApiConfig?: ApiConfigMeta[] @@ -127,8 +126,9 @@ export interface ExtensionState { experiments: Record // Map of experiment IDs to their enabled state autoApprovalEnabled?: boolean customModes: ModeConfig[] - toolRequirements?: Record // Map of tool names to their requirements (e.g. {"edit_file": true} if diffEnabled) + toolRequirements?: Record // Map of tool names to their requirements (e.g. {"apply_diff": true} if diffEnabled) maxOpenTabsContext: number // Maximum number of VSCode open tabs to include in context (0-500) + cwd?: string // Current working directory } export interface ClineMessage { diff --git a/src/shared/WebviewMessage.ts b/src/shared/WebviewMessage.ts index 106e6d243b9..fde7442cc1d 100644 --- a/src/shared/WebviewMessage.ts +++ b/src/shared/WebviewMessage.ts @@ -40,11 +40,11 @@ export interface WebviewMessage { | "openFile" | "openMention" | "cancelTask" - | "refreshGlamaModels" | "refreshOpenRouterModels" - | "refreshOpenAiModels" + | "refreshGlamaModels" | "refreshUnboundModels" | "refreshRequestyModels" + | "refreshOpenAiModels" | "alwaysAllowBrowser" | "alwaysAllowMcp" | "alwaysAllowModeSwitch" @@ -71,7 +71,6 @@ export interface WebviewMessage { | "mcpEnabled" | "enableMcpServerCreation" | "searchCommits" - | "refreshGlamaModels" | "alwaysApproveResubmit" | "requestDelaySeconds" | "rateLimitSeconds" diff --git a/src/shared/__tests__/checkExistApiConfig.test.ts b/src/shared/__tests__/checkExistApiConfig.test.ts index 914f4933d62..62517d69584 100644 --- a/src/shared/__tests__/checkExistApiConfig.test.ts +++ b/src/shared/__tests__/checkExistApiConfig.test.ts @@ -32,6 +32,7 @@ describe("checkExistKey", () => { apiKey: "test-key", apiProvider: undefined, anthropicBaseUrl: undefined, + anthropicThinking: undefined, } expect(checkExistKey(config)).toBe(true) }) diff --git a/src/shared/__tests__/modes.test.ts b/src/shared/__tests__/modes.test.ts index 52d26735a9e..3bd89c4ecb5 100644 --- a/src/shared/__tests__/modes.test.ts +++ b/src/shared/__tests__/modes.test.ts @@ -44,14 +44,14 @@ describe("isToolAllowedForMode", () => { describe("file restrictions", () => { it("allows editing matching files", () => { // Test markdown editor mode - const mdResult = isToolAllowedForMode("create_file", "markdown-editor", customModes, undefined, { + const mdResult = isToolAllowedForMode("write_to_file", "markdown-editor", customModes, undefined, { path: "test.md", content: "# Test", }) expect(mdResult).toBe(true) // Test CSS editor mode - const cssResult = isToolAllowedForMode("create_file", "css-editor", customModes, undefined, { + const cssResult = isToolAllowedForMode("write_to_file", "css-editor", customModes, undefined, { path: "styles.css", content: ".test { color: red; }", }) @@ -61,13 +61,13 @@ describe("isToolAllowedForMode", () => { it("rejects editing non-matching files", () => { // Test markdown editor mode with non-markdown file expect(() => - isToolAllowedForMode("create_file", "markdown-editor", customModes, undefined, { + isToolAllowedForMode("write_to_file", "markdown-editor", customModes, undefined, { path: "test.js", content: "console.log('test')", }), ).toThrow(FileRestrictionError) expect(() => - isToolAllowedForMode("create_file", "markdown-editor", customModes, undefined, { + isToolAllowedForMode("write_to_file", "markdown-editor", customModes, undefined, { path: "test.js", content: "console.log('test')", }), @@ -75,13 +75,13 @@ describe("isToolAllowedForMode", () => { // Test CSS editor mode with non-CSS file expect(() => - isToolAllowedForMode("create_file", "css-editor", customModes, undefined, { + isToolAllowedForMode("write_to_file", "css-editor", customModes, undefined, { path: "test.js", content: "console.log('test')", }), ).toThrow(FileRestrictionError) expect(() => - isToolAllowedForMode("create_file", "css-editor", customModes, undefined, { + isToolAllowedForMode("write_to_file", "css-editor", customModes, undefined, { path: "test.js", content: "console.log('test')", }), @@ -91,35 +91,35 @@ describe("isToolAllowedForMode", () => { it("handles partial streaming cases (path only, no content/diff)", () => { // Should allow path-only for matching files (no validation yet since content/diff not provided) expect( - isToolAllowedForMode("create_file", "markdown-editor", customModes, undefined, { + isToolAllowedForMode("write_to_file", "markdown-editor", customModes, undefined, { path: "test.js", }), ).toBe(true) expect( - isToolAllowedForMode("edit_file", "markdown-editor", customModes, undefined, { + isToolAllowedForMode("apply_diff", "markdown-editor", customModes, undefined, { path: "test.js", }), ).toBe(true) // Should allow path-only for architect mode too expect( - isToolAllowedForMode("create_file", "architect", [], undefined, { + isToolAllowedForMode("write_to_file", "architect", [], undefined, { path: "test.js", }), ).toBe(true) }) - it("applies restrictions to both create_file and edit_file", () => { - // Test create_file - const writeResult = isToolAllowedForMode("create_file", "markdown-editor", customModes, undefined, { + it("applies restrictions to both write_to_file and apply_diff", () => { + // Test write_to_file + const writeResult = isToolAllowedForMode("write_to_file", "markdown-editor", customModes, undefined, { path: "test.md", content: "# Test", }) expect(writeResult).toBe(true) - // Test edit_file - const diffResult = isToolAllowedForMode("edit_file", "markdown-editor", customModes, undefined, { + // Test apply_diff + const diffResult = isToolAllowedForMode("apply_diff", "markdown-editor", customModes, undefined, { path: "test.md", diff: "- old\n+ new", }) @@ -127,14 +127,14 @@ describe("isToolAllowedForMode", () => { // Test both with non-matching file expect(() => - isToolAllowedForMode("create_file", "markdown-editor", customModes, undefined, { + isToolAllowedForMode("write_to_file", "markdown-editor", customModes, undefined, { path: "test.js", content: "console.log('test')", }), ).toThrow(FileRestrictionError) expect(() => - isToolAllowedForMode("edit_file", "markdown-editor", customModes, undefined, { + isToolAllowedForMode("apply_diff", "markdown-editor", customModes, undefined, { path: "test.js", diff: "- old\n+ new", }), @@ -155,29 +155,29 @@ describe("isToolAllowedForMode", () => { }, ] - // Test create_file with non-matching file + // Test write_to_file with non-matching file expect(() => - isToolAllowedForMode("create_file", "docs-editor", customModesWithDescription, undefined, { + isToolAllowedForMode("write_to_file", "docs-editor", customModesWithDescription, undefined, { path: "test.js", content: "console.log('test')", }), ).toThrow(FileRestrictionError) expect(() => - isToolAllowedForMode("create_file", "docs-editor", customModesWithDescription, undefined, { + isToolAllowedForMode("write_to_file", "docs-editor", customModesWithDescription, undefined, { path: "test.js", content: "console.log('test')", }), ).toThrow(/Documentation files only/) - // Test edit_file with non-matching file + // Test apply_diff with non-matching file expect(() => - isToolAllowedForMode("edit_file", "docs-editor", customModesWithDescription, undefined, { + isToolAllowedForMode("apply_diff", "docs-editor", customModesWithDescription, undefined, { path: "test.js", diff: "- old\n+ new", }), ).toThrow(FileRestrictionError) expect(() => - isToolAllowedForMode("edit_file", "docs-editor", customModesWithDescription, undefined, { + isToolAllowedForMode("apply_diff", "docs-editor", customModesWithDescription, undefined, { path: "test.js", diff: "- old\n+ new", }), @@ -185,14 +185,14 @@ describe("isToolAllowedForMode", () => { // Test that matching files are allowed expect( - isToolAllowedForMode("create_file", "docs-editor", customModesWithDescription, undefined, { + isToolAllowedForMode("write_to_file", "docs-editor", customModesWithDescription, undefined, { path: "test.md", content: "# Test", }), ).toBe(true) expect( - isToolAllowedForMode("create_file", "docs-editor", customModesWithDescription, undefined, { + isToolAllowedForMode("write_to_file", "docs-editor", customModesWithDescription, undefined, { path: "test.txt", content: "Test content", }), @@ -200,7 +200,7 @@ describe("isToolAllowedForMode", () => { // Test partial streaming cases expect( - isToolAllowedForMode("create_file", "docs-editor", customModesWithDescription, undefined, { + isToolAllowedForMode("write_to_file", "docs-editor", customModesWithDescription, undefined, { path: "test.js", }), ).toBe(true) @@ -209,7 +209,7 @@ describe("isToolAllowedForMode", () => { it("allows architect mode to edit markdown files only", () => { // Should allow editing markdown files expect( - isToolAllowedForMode("create_file", "architect", [], undefined, { + isToolAllowedForMode("write_to_file", "architect", [], undefined, { path: "test.md", content: "# Test", }), @@ -217,7 +217,7 @@ describe("isToolAllowedForMode", () => { // Should allow applying diffs to markdown files expect( - isToolAllowedForMode("edit_file", "architect", [], undefined, { + isToolAllowedForMode("apply_diff", "architect", [], undefined, { path: "readme.md", diff: "- old\n+ new", }), @@ -225,13 +225,13 @@ describe("isToolAllowedForMode", () => { // Should reject non-markdown files expect(() => - isToolAllowedForMode("create_file", "architect", [], undefined, { + isToolAllowedForMode("write_to_file", "architect", [], undefined, { path: "test.js", content: "console.log('test')", }), ).toThrow(FileRestrictionError) expect(() => - isToolAllowedForMode("create_file", "architect", [], undefined, { + isToolAllowedForMode("write_to_file", "architect", [], undefined, { path: "test.js", content: "console.log('test')", }), @@ -245,15 +245,15 @@ describe("isToolAllowedForMode", () => { }) it("handles non-existent modes", () => { - expect(isToolAllowedForMode("create_file", "non-existent", customModes)).toBe(false) + expect(isToolAllowedForMode("write_to_file", "non-existent", customModes)).toBe(false) }) it("respects tool requirements", () => { const toolRequirements = { - create_file: false, + write_to_file: false, } - expect(isToolAllowedForMode("create_file", "markdown-editor", customModes, toolRequirements)).toBe(false) + expect(isToolAllowedForMode("write_to_file", "markdown-editor", customModes, toolRequirements)).toBe(false) }) describe("experimental tools", () => { @@ -312,7 +312,7 @@ describe("isToolAllowedForMode", () => { ).toBe(true) expect( isToolAllowedForMode( - "create_file", + "write_to_file", "markdown-editor", customModes, undefined, diff --git a/src/shared/api.ts b/src/shared/api.ts index 9ecb12c1403..5d4b8b120d7 100644 --- a/src/shared/api.ts +++ b/src/shared/api.ts @@ -21,6 +21,7 @@ export interface ApiHandlerOptions { apiModelId?: string apiKey?: string // anthropic anthropicBaseUrl?: string + anthropicThinking?: number vsCodeLmModelSelector?: vscode.LanguageModelChatSelector glamaModelId?: string glamaModelInfo?: ModelInfo @@ -88,13 +89,44 @@ export interface ModelInfo { cacheReadsPrice?: number description?: string reasoningEffort?: "low" | "medium" | "high" + thinking?: boolean +} + +export const THINKING_BUDGET = { + step: 1024, + min: 1024, + default: 8 * 1024, } // Anthropic // https://docs.anthropic.com/en/docs/about-claude/models export type AnthropicModelId = keyof typeof anthropicModels -export const anthropicDefaultModelId: AnthropicModelId = "claude-3-5-sonnet-20241022" +export const anthropicDefaultModelId: AnthropicModelId = "claude-3-7-sonnet-20250219" export const anthropicModels = { + "claude-3-7-sonnet-20250219:thinking": { + maxTokens: 16384, + contextWindow: 200_000, + supportsImages: true, + supportsComputerUse: true, + supportsPromptCache: true, + inputPrice: 3.0, // $3 per million input tokens + outputPrice: 15.0, // $15 per million output tokens + cacheWritesPrice: 3.75, // $3.75 per million tokens + cacheReadsPrice: 0.3, // $0.30 per million tokens + thinking: true, + }, + "claude-3-7-sonnet-20250219": { + maxTokens: 16384, + contextWindow: 200_000, + supportsImages: true, + supportsComputerUse: true, + supportsPromptCache: true, + inputPrice: 3.0, // $3 per million input tokens + outputPrice: 15.0, // $15 per million output tokens + cacheWritesPrice: 3.75, // $3.75 per million tokens + cacheReadsPrice: 0.3, // $0.30 per million tokens + thinking: false, + }, "claude-3-5-sonnet-20241022": { maxTokens: 8192, contextWindow: 200_000, @@ -162,7 +194,7 @@ export interface MessageContent { } export type BedrockModelId = keyof typeof bedrockModels -export const bedrockDefaultModelId: BedrockModelId = "anthropic.claude-3-5-sonnet-20241022-v2:0" +export const bedrockDefaultModelId: BedrockModelId = "anthropic.claude-3-7-sonnet-20250219-v1:0" export const bedrockModels = { "amazon.nova-pro-v1:0": { maxTokens: 5000, @@ -197,6 +229,17 @@ export const bedrockModels = { cacheWritesPrice: 0.035, // per million tokens cacheReadsPrice: 0.00875, // per million tokens }, + "anthropic.claude-3-7-sonnet-20250219-v1:0": { + maxTokens: 8192, + contextWindow: 200_000, + supportsImages: true, + supportsComputerUse: true, + supportsPromptCache: true, + inputPrice: 3.0, + outputPrice: 15.0, + cacheWritesPrice: 3.75, + cacheReadsPrice: 0.3, + }, "anthropic.claude-3-5-sonnet-20241022-v2:0": { maxTokens: 8192, contextWindow: 200_000, @@ -205,8 +248,8 @@ export const bedrockModels = { supportsPromptCache: false, inputPrice: 3.0, outputPrice: 15.0, - cacheWritesPrice: 3.75, // per million tokens - cacheReadsPrice: 0.3, // per million tokens + cacheWritesPrice: 3.75, + cacheReadsPrice: 0.3, }, "anthropic.claude-3-5-haiku-20241022-v1:0": { maxTokens: 8192, @@ -344,7 +387,7 @@ export const bedrockModels = { // Glama // https://glama.ai/models -export const glamaDefaultModelId = "anthropic/claude-3-5-sonnet" +export const glamaDefaultModelId = "anthropic/claude-3-7-sonnet" export const glamaDefaultModelInfo: ModelInfo = { maxTokens: 8192, contextWindow: 200_000, @@ -356,9 +399,12 @@ export const glamaDefaultModelInfo: ModelInfo = { cacheWritesPrice: 3.75, cacheReadsPrice: 0.3, description: - "The new Claude 3.5 Sonnet delivers better-than-Opus capabilities, faster-than-Sonnet speeds, at the same Sonnet prices. Sonnet is particularly good at:\n\n- Coding: New Sonnet scores ~49% on SWE-Bench Verified, higher than the last best score, and without any fancy prompt scaffolding\n- Data science: Augments human data science expertise; navigates unstructured data while using multiple tools for insights\n- Visual processing: excelling at interpreting charts, graphs, and images, accurately transcribing text to derive insights beyond just the text alone\n- Agentic tasks: exceptional tool use, making it great at agentic tasks (i.e. complex, multi-step problem solving tasks that require engaging with other systems)\n\n#multimodal\n\n_This is a faster endpoint, made available in collaboration with Anthropic, that is self-moderated: response moderation happens on the provider's side instead of OpenRouter's. For requests that pass moderation, it's identical to the [Standard](/anthropic/claude-3.5-sonnet) variant._", + "Claude 3.7 Sonnet is an advanced large language model with improved reasoning, coding, and problem-solving capabilities. It introduces a hybrid reasoning approach, allowing users to choose between rapid responses and extended, step-by-step processing for complex tasks. The model demonstrates notable improvements in coding, particularly in front-end development and full-stack updates, and excels in agentic workflows, where it can autonomously navigate multi-step processes. Claude 3.7 Sonnet maintains performance parity with its predecessor in standard mode while offering an extended reasoning mode for enhanced accuracy in math, coding, and instruction-following tasks. Read more at the [blog post here](https://www.anthropic.com/news/claude-3-7-sonnet)", } +// Requesty +// https://requesty.ai/router-2 +export const requestyDefaultModelId = "anthropic/claude-3-7-sonnet-latest" export const requestyDefaultModelInfo: ModelInfo = { maxTokens: 8192, contextWindow: 200_000, @@ -370,13 +416,12 @@ export const requestyDefaultModelInfo: ModelInfo = { cacheWritesPrice: 3.75, cacheReadsPrice: 0.3, description: - "The new Claude 3.5 Sonnet delivers better-than-Opus capabilities, faster-than-Sonnet speeds, at the same Sonnet prices. Sonnet is particularly good at:\n\n- Coding: New Sonnet scores ~49% on SWE-Bench Verified, higher than the last best score, and without any fancy prompt scaffolding\n- Data science: Augments human data science expertise; navigates unstructured data while using multiple tools for insights\n- Visual processing: excelling at interpreting charts, graphs, and images, accurately transcribing text to derive insights beyond just the text alone\n- Agentic tasks: exceptional tool use, making it great at agentic tasks (i.e. complex, multi-step problem solving tasks that require engaging with other systems)\n\n#multimodal\n\n_This is a faster endpoint, made available in collaboration with Anthropic, that is self-moderated: response moderation happens on the provider's side instead of OpenRouter's. For requests that pass moderation, it's identical to the [Standard](/anthropic/claude-3.5-sonnet) variant._", + "Claude 3.7 Sonnet is an advanced large language model with improved reasoning, coding, and problem-solving capabilities. It introduces a hybrid reasoning approach, allowing users to choose between rapid responses and extended, step-by-step processing for complex tasks. The model demonstrates notable improvements in coding, particularly in front-end development and full-stack updates, and excels in agentic workflows, where it can autonomously navigate multi-step processes. Claude 3.7 Sonnet maintains performance parity with its predecessor in standard mode while offering an extended reasoning mode for enhanced accuracy in math, coding, and instruction-following tasks. Read more at the [blog post here](https://www.anthropic.com/news/claude-3-7-sonnet)", } -export const requestyDefaultModelId = "anthropic/claude-3-5-sonnet" // OpenRouter // https://openrouter.ai/models?order=newest&supported_parameters=tools -export const openRouterDefaultModelId = "anthropic/claude-3.5-sonnet:beta" // will always exist in openRouterModels +export const openRouterDefaultModelId = "anthropic/claude-3.7-sonnet" export const openRouterDefaultModelInfo: ModelInfo = { maxTokens: 8192, contextWindow: 200_000, @@ -388,14 +433,23 @@ export const openRouterDefaultModelInfo: ModelInfo = { cacheWritesPrice: 3.75, cacheReadsPrice: 0.3, description: - "The new Claude 3.5 Sonnet delivers better-than-Opus capabilities, faster-than-Sonnet speeds, at the same Sonnet prices. Sonnet is particularly good at:\n\n- Coding: New Sonnet scores ~49% on SWE-Bench Verified, higher than the last best score, and without any fancy prompt scaffolding\n- Data science: Augments human data science expertise; navigates unstructured data while using multiple tools for insights\n- Visual processing: excelling at interpreting charts, graphs, and images, accurately transcribing text to derive insights beyond just the text alone\n- Agentic tasks: exceptional tool use, making it great at agentic tasks (i.e. complex, multi-step problem solving tasks that require engaging with other systems)\n\n#multimodal\n\n_This is a faster endpoint, made available in collaboration with Anthropic, that is self-moderated: response moderation happens on the provider's side instead of OpenRouter's. For requests that pass moderation, it's identical to the [Standard](/anthropic/claude-3.5-sonnet) variant._", + "Claude 3.7 Sonnet is an advanced large language model with improved reasoning, coding, and problem-solving capabilities. It introduces a hybrid reasoning approach, allowing users to choose between rapid responses and extended, step-by-step processing for complex tasks. The model demonstrates notable improvements in coding, particularly in front-end development and full-stack updates, and excels in agentic workflows, where it can autonomously navigate multi-step processes. Claude 3.7 Sonnet maintains performance parity with its predecessor in standard mode while offering an extended reasoning mode for enhanced accuracy in math, coding, and instruction-following tasks. Read more at the [blog post here](https://www.anthropic.com/news/claude-3-7-sonnet)", } // Vertex AI // https://cloud.google.com/vertex-ai/generative-ai/docs/partner-models/use-claude export type VertexModelId = keyof typeof vertexModels -export const vertexDefaultModelId: VertexModelId = "claude-3-5-sonnet-v2@20241022" +export const vertexDefaultModelId: VertexModelId = "claude-3-7-sonnet@20250219" export const vertexModels = { + "claude-3-7-sonnet@20250219": { + maxTokens: 8192, + contextWindow: 200_000, + supportsImages: true, + supportsComputerUse: true, + supportsPromptCache: false, + inputPrice: 3.0, + outputPrice: 15.0, + }, "claude-3-5-sonnet-v2@20241022": { maxTokens: 8192, contextWindow: 200_000, diff --git a/src/shared/globalFileNames.ts b/src/shared/globalFileNames.ts new file mode 100644 index 00000000000..6088e95d999 --- /dev/null +++ b/src/shared/globalFileNames.ts @@ -0,0 +1,9 @@ +export const GlobalFileNames = { + apiConversationHistory: "api_conversation_history.json", + uiMessages: "ui_messages.json", + glamaModels: "glama_models.json", + openRouterModels: "openrouter_models.json", + requestyModels: "requesty_models.json", + mcpSettings: "cline_mcp_settings.json", + unboundModels: "unbound_models.json", +} diff --git a/src/shared/globalState.ts b/src/shared/globalState.ts new file mode 100644 index 00000000000..7b6b4f8274b --- /dev/null +++ b/src/shared/globalState.ts @@ -0,0 +1,85 @@ +export type SecretKey = + | "apiKey" + | "glamaApiKey" + | "openRouterApiKey" + | "awsAccessKey" + | "awsSecretKey" + | "awsSessionToken" + | "openAiApiKey" + | "geminiApiKey" + | "openAiNativeApiKey" + | "deepSeekApiKey" + | "mistralApiKey" + | "unboundApiKey" + | "requestyApiKey" + +export type GlobalStateKey = + | "apiProvider" + | "apiModelId" + | "glamaModelId" + | "glamaModelInfo" + | "awsRegion" + | "awsUseCrossRegionInference" + | "awsProfile" + | "awsUseProfile" + | "vertexProjectId" + | "vertexRegion" + | "lastShownAnnouncementId" + | "customInstructions" + | "alwaysAllowReadOnly" + | "alwaysAllowWrite" + | "alwaysAllowExecute" + | "alwaysAllowBrowser" + | "alwaysAllowMcp" + | "alwaysAllowModeSwitch" + | "taskHistory" + | "openAiBaseUrl" + | "openAiModelId" + | "openAiCustomModelInfo" + | "openAiUseAzure" + | "ollamaModelId" + | "ollamaBaseUrl" + | "lmStudioModelId" + | "lmStudioBaseUrl" + | "anthropicBaseUrl" + | "anthropicThinking" + | "azureApiVersion" + | "openAiStreamingEnabled" + | "openRouterModelId" + | "openRouterModelInfo" + | "openRouterBaseUrl" + | "openRouterUseMiddleOutTransform" + | "allowedCommands" + | "soundEnabled" + | "soundVolume" + | "diffEnabled" + | "checkpointsEnabled" + | "browserViewportSize" + | "screenshotQuality" + | "fuzzyMatchThreshold" + | "preferredLanguage" // Language setting for Cline's communication + | "writeDelayMs" + | "terminalOutputLineLimit" + | "mcpEnabled" + | "enableMcpServerCreation" + | "alwaysApproveResubmit" + | "requestDelaySeconds" + | "rateLimitSeconds" + | "currentApiConfigName" + | "listApiConfigMeta" + | "vsCodeLmModelSelector" + | "mode" + | "modeApiConfigs" + | "customModePrompts" + | "customSupportPrompts" + | "enhancementApiConfigId" + | "experiments" // Map of experiment IDs to their enabled state + | "autoApprovalEnabled" + | "customModes" // Array of custom modes + | "unboundModelId" + | "requestyModelId" + | "requestyModelInfo" + | "unboundModelInfo" + | "modelTemperature" + | "mistralCodestralUrl" + | "maxOpenTabsContext" diff --git a/src/shared/tool-groups.ts b/src/shared/tool-groups.ts index 8a25e1400ee..50c7b80ca9e 100644 --- a/src/shared/tool-groups.ts +++ b/src/shared/tool-groups.ts @@ -8,8 +8,8 @@ export type ToolGroupConfig = { export const TOOL_DISPLAY_NAMES = { execute_command: "run commands", read_file: "read files", - create_file: "write files", - edit_file: "apply changes", + write_to_file: "write files", + apply_diff: "apply changes", search_files: "search files", list_files: "list files", list_code_definition_names: "list definitions", @@ -28,7 +28,7 @@ export const TOOL_GROUPS: Record = { tools: ["read_file", "search_files", "list_files", "list_code_definition_names"], }, edit: { - tools: ["edit_file", "create_file", "insert_content", "search_and_replace"], + tools: ["apply_diff", "write_to_file", "insert_content", "search_and_replace"], }, browser: { tools: ["browser_action"], diff --git a/src/test/suite/index.ts b/src/test/suite/index.ts index ffb8de7473e..cc487b0bf78 100644 --- a/src/test/suite/index.ts +++ b/src/test/suite/index.ts @@ -13,23 +13,23 @@ declare global { } export async function run(): Promise { - // Create the mocha test const mocha = new Mocha({ ui: "tdd", - timeout: 600000, // 10 minutes to compensate for time communicating with LLM while running in GHA + timeout: 600000, // 10 minutes to compensate for time communicating with LLM while running in GHA. }) const testsRoot = path.resolve(__dirname, "..") try { - // Find all test files + // Find all test files. const files = await glob("**/**.test.js", { cwd: testsRoot }) - // Add files to the test suite + // Add files to the test suite. files.forEach((f: string) => mocha.addFile(path.resolve(testsRoot, f))) - //Set up global extension, api, provider, and panel + // Set up global extension, api, provider, and panel. globalThis.extension = vscode.extensions.getExtension("RooVeterinaryInc.roo-cline") + if (!globalThis.extension) { throw new Error("Extension not found") } @@ -37,9 +37,12 @@ export async function run(): Promise { globalThis.api = globalThis.extension.isActive ? globalThis.extension.exports : await globalThis.extension.activate() + globalThis.provider = globalThis.api.sidebarProvider + await globalThis.provider.updateGlobalState("apiProvider", "openrouter") await globalThis.provider.updateGlobalState("openRouterModelId", "anthropic/claude-3.5-sonnet") + await globalThis.provider.storeSecret( "openRouterApiKey", process.env.OPENROUTER_API_KEY || "sk-or-v1-fake-api-key", @@ -71,7 +74,7 @@ export async function run(): Promise { await new Promise((resolve) => setTimeout(resolve, interval)) } - // Run the mocha test + // Run the mocha test. return new Promise((resolve, reject) => { try { mocha.run((failures: number) => { diff --git a/src/test/suite/modes.test.ts b/src/test/suite/modes.test.ts index 2fe0eaa597f..b94e71d1106 100644 --- a/src/test/suite/modes.test.ts +++ b/src/test/suite/modes.test.ts @@ -1,101 +1,105 @@ import * as assert from "assert" -import * as vscode from "vscode" suite("Roo Code Modes", () => { test("Should handle switching modes correctly", async function () { const timeout = 30000 const interval = 1000 + const testPrompt = "For each mode (Code, Architect, Ask) respond with the mode name and what it specializes in after switching to that mode, do not start with the current mode, be sure to say 'I AM DONE' after the task is complete" + if (!globalThis.extension) { assert.fail("Extension not found") } - try { - let startTime = Date.now() - - // Ensure the webview is launched. - while (Date.now() - startTime < timeout) { - if (globalThis.provider.viewLaunched) { - break - } + let startTime = Date.now() - await new Promise((resolve) => setTimeout(resolve, interval)) + // Ensure the webview is launched. + while (Date.now() - startTime < timeout) { + if (globalThis.provider.viewLaunched) { + break } - await globalThis.provider.updateGlobalState("mode", "Ask") - await globalThis.provider.updateGlobalState("alwaysAllowModeSwitch", true) - await globalThis.provider.updateGlobalState("autoApprovalEnabled", true) + await new Promise((resolve) => setTimeout(resolve, interval)) + } - // Start a new task. - await globalThis.api.startNewTask(testPrompt) + await globalThis.provider.updateGlobalState("mode", "Ask") + await globalThis.provider.updateGlobalState("alwaysAllowModeSwitch", true) + await globalThis.provider.updateGlobalState("autoApprovalEnabled", true) - // Wait for task to appear in history with tokens. - startTime = Date.now() + // Start a new task. + await globalThis.api.startNewTask(testPrompt) - while (Date.now() - startTime < timeout) { - const messages = globalThis.provider.messages + // Wait for task to appear in history with tokens. + startTime = Date.now() - if ( - messages.some( - ({ type, text }) => - type === "say" && text?.includes("I AM DONE") && !text?.includes("be sure to say"), - ) - ) { - break - } + while (Date.now() - startTime < timeout) { + const messages = globalThis.provider.messages - await new Promise((resolve) => setTimeout(resolve, interval)) - } - if (globalThis.provider.messages.length === 0) { - assert.fail("No messages received") + if ( + messages.some( + ({ type, text }) => + type === "say" && text?.includes("I AM DONE") && !text?.includes("be sure to say"), + ) + ) { + break } - //Log the messages to the console - globalThis.provider.messages.forEach(({ type, text }) => { - if (type === "say") { - console.log(text) - } - }) - - //Start Grading Portion of test to grade the response from 1 to 10 - await globalThis.provider.updateGlobalState("mode", "Ask") - let output = globalThis.provider.messages.map(({ type, text }) => (type === "say" ? text : "")).join("\n") - await globalThis.api.startNewTask( - `Given this prompt: ${testPrompt} grade the response from 1 to 10 in the format of "Grade: (1-10)": ${output} \n Be sure to say 'I AM DONE GRADING' after the task is complete`, - ) - - startTime = Date.now() - - while (Date.now() - startTime < timeout) { - const messages = globalThis.provider.messages - - if ( - messages.some( - ({ type, text }) => - type === "say" && text?.includes("I AM DONE GRADING") && !text?.includes("be sure to say"), - ) - ) { - break - } - - await new Promise((resolve) => setTimeout(resolve, interval)) + await new Promise((resolve) => setTimeout(resolve, interval)) + } + + if (globalThis.provider.messages.length === 0) { + assert.fail("No messages received") + } + + // Log the messages to the console. + globalThis.provider.messages.forEach(({ type, text }) => { + if (type === "say") { + console.log(text) } - if (globalThis.provider.messages.length === 0) { - assert.fail("No messages received") + }) + + // Start Grading Portion of test to grade the response from 1 to 10. + await globalThis.provider.updateGlobalState("mode", "Ask") + let output = globalThis.provider.messages.map(({ type, text }) => (type === "say" ? text : "")).join("\n") + + await globalThis.api.startNewTask( + `Given this prompt: ${testPrompt} grade the response from 1 to 10 in the format of "Grade: (1-10)": ${output} \n Be sure to say 'I AM DONE GRADING' after the task is complete`, + ) + + startTime = Date.now() + + while (Date.now() - startTime < timeout) { + const messages = globalThis.provider.messages + + if ( + messages.some( + ({ type, text }) => + type === "say" && text?.includes("I AM DONE GRADING") && !text?.includes("be sure to say"), + ) + ) { + break } - globalThis.provider.messages.forEach(({ type, text }) => { - if (type === "say" && text?.includes("Grade:")) { - console.log(text) - } - }) - const gradeMessage = globalThis.provider.messages.find( - ({ type, text }) => type === "say" && !text?.includes("Grade: (1-10)") && text?.includes("Grade:"), - )?.text - const gradeMatch = gradeMessage?.match(/Grade: (\d+)/) - const gradeNum = gradeMatch ? parseInt(gradeMatch[1]) : undefined - assert.ok(gradeNum !== undefined && gradeNum >= 7 && gradeNum <= 10, "Grade must be between 7 and 10") - } finally { + + await new Promise((resolve) => setTimeout(resolve, interval)) + } + + if (globalThis.provider.messages.length === 0) { + assert.fail("No messages received") } + + globalThis.provider.messages.forEach(({ type, text }) => { + if (type === "say" && text?.includes("Grade:")) { + console.log(text) + } + }) + + const gradeMessage = globalThis.provider.messages.find( + ({ type, text }) => type === "say" && !text?.includes("Grade: (1-10)") && text?.includes("Grade:"), + )?.text + + const gradeMatch = gradeMessage?.match(/Grade: (\d+)/) + const gradeNum = gradeMatch ? parseInt(gradeMatch[1]) : undefined + assert.ok(gradeNum !== undefined && gradeNum >= 7 && gradeNum <= 10, "Grade must be between 7 and 10") }) }) diff --git a/src/test/suite/task.test.ts b/src/test/suite/task.test.ts index 2d34bc78ff3..6bdedcde002 100644 --- a/src/test/suite/task.test.ts +++ b/src/test/suite/task.test.ts @@ -1,5 +1,4 @@ import * as assert from "assert" -import * as vscode from "vscode" suite("Roo Code Task", () => { test("Should handle prompt and response correctly", async function () { @@ -10,48 +9,43 @@ suite("Roo Code Task", () => { assert.fail("Extension not found") } - try { - // Ensure the webview is launched. - let startTime = Date.now() + // Ensure the webview is launched. + let startTime = Date.now() - while (Date.now() - startTime < timeout) { - if (globalThis.provider.viewLaunched) { - break - } - - await new Promise((resolve) => setTimeout(resolve, interval)) + while (Date.now() - startTime < timeout) { + if (globalThis.provider.viewLaunched) { + break } - await globalThis.provider.updateGlobalState("mode", "Code") - await globalThis.provider.updateGlobalState("alwaysAllowModeSwitch", true) - await globalThis.provider.updateGlobalState("autoApprovalEnabled", true) + await new Promise((resolve) => setTimeout(resolve, interval)) + } - await globalThis.api.startNewTask("Hello world, what is your name? Respond with 'My name is ...'") + await globalThis.provider.updateGlobalState("mode", "Code") + await globalThis.provider.updateGlobalState("alwaysAllowModeSwitch", true) + await globalThis.provider.updateGlobalState("autoApprovalEnabled", true) - // Wait for task to appear in history with tokens. - startTime = Date.now() + await globalThis.api.startNewTask("Hello world, what is your name? Respond with 'My name is ...'") - while (Date.now() - startTime < timeout) { - const messages = globalThis.provider.messages + // Wait for task to appear in history with tokens. + startTime = Date.now() - if (messages.some(({ type, text }) => type === "say" && text?.includes("My name is Roo"))) { - break - } + while (Date.now() - startTime < timeout) { + const messages = globalThis.provider.messages - await new Promise((resolve) => setTimeout(resolve, interval)) + if (messages.some(({ type, text }) => type === "say" && text?.includes("My name is Roo"))) { + break } - if (globalThis.provider.messages.length === 0) { - assert.fail("No messages received") - } + await new Promise((resolve) => setTimeout(resolve, interval)) + } - assert.ok( - globalThis.provider.messages.some( - ({ type, text }) => type === "say" && text?.includes("My name is Roo"), - ), - "Did not receive expected response containing 'My name is Roo'", - ) - } finally { + if (globalThis.provider.messages.length === 0) { + assert.fail("No messages received") } + + assert.ok( + globalThis.provider.messages.some(({ type, text }) => type === "say" && text?.includes("My name is Roo")), + "Did not receive expected response containing 'My name is Roo'", + ) }) }) diff --git a/src/utils/__tests__/path.test.ts b/src/utils/__tests__/path.test.ts index 1d20e86c696..8c8a8cc672d 100644 --- a/src/utils/__tests__/path.test.ts +++ b/src/utils/__tests__/path.test.ts @@ -1,6 +1,9 @@ -import { arePathsEqual, getReadablePath } from "../path" -import * as path from "path" +// npx jest src/utils/__tests__/path.test.ts + import os from "os" +import * as path from "path" + +import { arePathsEqual, getReadablePath } from "../path" describe("Path Utilities", () => { const originalPlatform = process.platform @@ -92,22 +95,24 @@ describe("Path Utilities", () => { describe("getReadablePath", () => { const homeDir = os.homedir() const desktop = path.join(homeDir, "Desktop") + const cwd = process.platform === "win32" ? "C:\\Users\\test\\project" : "/Users/test/project" it("should return basename when path equals cwd", () => { - const cwd = "/Users/test/project" expect(getReadablePath(cwd, cwd)).toBe("project") }) it("should return relative path when inside cwd", () => { - const cwd = "/Users/test/project" - const filePath = "/Users/test/project/src/file.txt" + const filePath = + process.platform === "win32" + ? "C:\\Users\\test\\project\\src\\file.txt" + : "/Users/test/project/src/file.txt" expect(getReadablePath(cwd, filePath)).toBe("src/file.txt") }) it("should return absolute path when outside cwd", () => { - const cwd = "/Users/test/project" - const filePath = "/Users/test/other/file.txt" - expect(getReadablePath(cwd, filePath)).toBe("/Users/test/other/file.txt") + const filePath = + process.platform === "win32" ? "C:\\Users\\test\\other\\file.txt" : "/Users/test/other/file.txt" + expect(getReadablePath(cwd, filePath)).toBe(filePath.toPosix()) }) it("should handle Desktop as cwd", () => { @@ -116,19 +121,20 @@ describe("Path Utilities", () => { }) it("should handle undefined relative path", () => { - const cwd = "/Users/test/project" expect(getReadablePath(cwd)).toBe("project") }) it("should handle parent directory traversal", () => { - const cwd = "/Users/test/project" - const filePath = "../../other/file.txt" - expect(getReadablePath(cwd, filePath)).toBe("/Users/other/file.txt") + const filePath = + process.platform === "win32" ? "C:\\Users\\test\\other\\file.txt" : "/Users/test/other/file.txt" + expect(getReadablePath(cwd, filePath)).toBe(filePath.toPosix()) }) it("should normalize paths with redundant segments", () => { - const cwd = "/Users/test/project" - const filePath = "/Users/test/project/./src/../src/file.txt" + const filePath = + process.platform === "win32" + ? "C:\\Users\\test\\project\\src\\file.txt" + : "/Users/test/project/./src/../src/file.txt" expect(getReadablePath(cwd, filePath)).toBe("src/file.txt") }) }) diff --git a/src/utils/cost.ts b/src/utils/cost.ts index f8f5f2b125a..adc2ded0a87 100644 --- a/src/utils/cost.ts +++ b/src/utils/cost.ts @@ -22,3 +22,5 @@ export function calculateApiCost( const totalCost = cacheWritesCost + cacheReadsCost + baseInputCost + outputCost return totalCost } + +export const parseApiPrice = (price: any) => (price ? parseFloat(price) * 1_000_000 : undefined) diff --git a/webview-ui/package-lock.json b/webview-ui/package-lock.json index 9c4079a4c2b..2ad8a7534fe 100644 --- a/webview-ui/package-lock.json +++ b/webview-ui/package-lock.json @@ -3844,6 +3844,7 @@ "version": "1.1.6", "resolved": "https://registry.npmjs.org/@radix-ui/react-alert-dialog/-/react-alert-dialog-1.1.6.tgz", "integrity": "sha512-p4XnPqgej8sZAAReCAKgz1REYZEBLR8hU9Pg27wFnCWIMc8g1ccCs0FjBcy05V15VTu8pAePw/VDYeOm/uZ6yQ==", + "license": "MIT", "dependencies": { "@radix-ui/primitive": "1.1.1", "@radix-ui/react-compose-refs": "1.1.1", @@ -4889,6 +4890,7 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.1.2.tgz", "integrity": "sha512-YAKxaiGsSQJ38VzKH86/BPRC4rh+b1Jpa+JneA5LRE7skmLPNAyeG8kPJj/oo4STLvlrs8vkf/iYyc3A5stYCQ==", + "license": "MIT", "dependencies": { "@radix-ui/react-compose-refs": "1.1.1" }, diff --git a/webview-ui/src/__mocks__/lucide-react.ts b/webview-ui/src/__mocks__/lucide-react.ts new file mode 100644 index 00000000000..d85cd25d6a7 --- /dev/null +++ b/webview-ui/src/__mocks__/lucide-react.ts @@ -0,0 +1,6 @@ +import React from "react" + +export const Check = () => React.createElement("div") +export const ChevronsUpDown = () => React.createElement("div") +export const Loader = () => React.createElement("div") +export const X = () => React.createElement("div") diff --git a/webview-ui/src/__mocks__/vscrui.ts b/webview-ui/src/__mocks__/vscrui.ts index 76760ba5cce..9b4a20f4d6b 100644 --- a/webview-ui/src/__mocks__/vscrui.ts +++ b/webview-ui/src/__mocks__/vscrui.ts @@ -8,6 +8,9 @@ export const Dropdown = ({ children, value, onChange }: any) => export const Pane = ({ children }: any) => React.createElement("div", { "data-testid": "mock-pane" }, children) +export const Button = ({ children, ...props }: any) => + React.createElement("div", { "data-testid": "mock-button", ...props }, children) + export type DropdownOption = { label: string value: string diff --git a/webview-ui/src/components/chat/ChatTextArea/ChatTextArea.tsx b/webview-ui/src/components/chat/ChatTextArea/ChatTextArea.tsx index f8ec99b6239..53c2608da84 100644 --- a/webview-ui/src/components/chat/ChatTextArea/ChatTextArea.tsx +++ b/webview-ui/src/components/chat/ChatTextArea/ChatTextArea.tsx @@ -4,6 +4,7 @@ import ChatTextAreaInput from "./ChatTextAreaInput" import ChatTextAreaSelections from "./ChatTextAreaSelections" import ChatTextAreaActions from "./ChatTextAreaActions" import { useExtensionState } from "@/context/ExtensionStateContext" +import { ContextMenuOptionType } from "@/utils/context-mentions" import { Mode } from "../../../../../src/shared/modes" interface ChatTextAreaProps { @@ -39,9 +40,22 @@ const ChatTextArea = forwardRef( }, ref, ) => { - const { filePaths, openedTabs, currentApiConfigName, listApiConfigMeta, customModes } = useExtensionState() + const { filePaths, openedTabs, currentApiConfigName, listApiConfigMeta, customModes, cwd } = useExtensionState() const [gitCommits, setGitCommits] = useState([]) const [isEnhancingPrompt, setIsEnhancingPrompt] = useState(false) + const [showDropdown, setShowDropdown] = useState(false) + + // Close dropdown when clicking outside + useEffect(() => { + const handleClickOutside = (event: MouseEvent) => { + if (showDropdown) { + setShowDropdown(false) + } + } + document.addEventListener("mousedown", handleClickOutside) + return () => document.removeEventListener("mousedown", handleClickOutside) + }, [showDropdown]) + // Handle enhanced prompt response useEffect(() => { @@ -54,7 +68,7 @@ const ChatTextArea = forwardRef( setIsEnhancingPrompt(false) } else if (message.type === "commitSearchResults") { const commits = message.commits.map((commit: any) => ({ - type: "git", + type: ContextMenuOptionType.Git, value: commit.hash, label: commit.subject, description: `${commit.shortHash} by ${commit.author} on ${commit.date}`, @@ -81,13 +95,13 @@ const ChatTextArea = forwardRef( setSelectedImages={setSelectedImages} onSend={onSend} onHeightChange={onHeightChange} - mode={mode} setMode={setMode} customModes={customModes} filePaths={filePaths} openedTabs={openedTabs} gitCommits={gitCommits} shouldDisableImages={shouldDisableImages} + cwd={cwd} /> ), selections: ( diff --git a/webview-ui/src/components/chat/ChatTextArea/ChatTextAreaInput.tsx b/webview-ui/src/components/chat/ChatTextArea/ChatTextAreaInput.tsx index de3679b926b..879e121229b 100644 --- a/webview-ui/src/components/chat/ChatTextArea/ChatTextAreaInput.tsx +++ b/webview-ui/src/components/chat/ChatTextArea/ChatTextAreaInput.tsx @@ -12,6 +12,7 @@ import ContextMenu from "../ContextMenu" import Thumbnails from "../../common/Thumbnails" import { Mode, getAllModes } from "../../../../../src/shared/modes" import { MAX_IMAGES_PER_MESSAGE } from "../ChatView" +import { convertToMentionPath } from "../../../utils/path-mentions" import { vscode } from "../../../utils/vscode" interface ChatTextAreaInputProps { @@ -24,12 +25,12 @@ interface ChatTextAreaInputProps { setSelectedImages: React.Dispatch> onSend: () => void onHeightChange?: (height: number) => void - mode: Mode setMode: (value: Mode) => void customModes: any[] filePaths: string[] openedTabs: Array<{ path?: string }> gitCommits: any[] + cwd?: string } const ChatTextAreaInput = React.forwardRef( @@ -44,9 +45,9 @@ const ChatTextAreaInput = React.forwardRef [@ Context] [/ Modes] - {!shouldDisableImages && [⇧ Drag Images]} + [⇧ Drag {!shouldDisableImages ? "Files/Images" : "Files"}] )} {selectedImages.length > 0 && ( diff --git a/webview-ui/src/components/chat/ChatView.tsx b/webview-ui/src/components/chat/ChatView.tsx index 08f287f51b5..a1b6236a5d6 100644 --- a/webview-ui/src/components/chat/ChatView.tsx +++ b/webview-ui/src/components/chat/ChatView.tsx @@ -878,7 +878,6 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie useEvent("wheel", handleWheel, window, { passive: true }) // passive improves scrolling performance const placeholderText = task ? "Type a message..." : "Type your task here..." - const itemContent = useCallback( (index: number, messageOrGroup: ClineMessage | ClineMessage[]) => { // browser session group @@ -1054,10 +1053,6 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie /> MCP Extensions -
- - Custom Tools -
{taskHistory.length > 0 && } diff --git a/webview-ui/src/components/chat/TaskHeader.tsx b/webview-ui/src/components/chat/TaskHeader.tsx index b35be0cd2a6..341855f796e 100644 --- a/webview-ui/src/components/chat/TaskHeader.tsx +++ b/webview-ui/src/components/chat/TaskHeader.tsx @@ -351,7 +351,7 @@ const TaskActions = ({ item }: { item: HistoryItem | undefined }) => ( - {item?.size && ( + {!!item?.size && item.size > 0 && ( + + + + + + + + ) +} diff --git a/webview-ui/src/components/history/HistoryView.tsx b/webview-ui/src/components/history/HistoryView.tsx index 38ca14df46c..ca60e1fcb89 100644 --- a/webview-ui/src/components/history/HistoryView.tsx +++ b/webview-ui/src/components/history/HistoryView.tsx @@ -1,4 +1,5 @@ import React, { memo, useMemo, useState, useEffect } from "react" +import { DeleteTaskDialog } from "./DeleteTaskDialog" import { Fzf } from "fzf" import prettyBytes from "pretty-bytes" import { Virtuoso } from "react-virtuoso" @@ -37,8 +38,12 @@ const HistoryView = ({ onDone }: HistoryViewProps) => { vscode.postMessage({ type: "showTaskWithId", text: id }) } + const [deleteDialogOpen, setDeleteDialogOpen] = useState(false) + const [taskToDelete, setTaskToDelete] = useState(null) + const handleDeleteHistoryItem = (id: string) => { - vscode.postMessage({ type: "deleteTaskWithId", text: id }) + setTaskToDelete(id) + setDeleteDialogOpen(true) } const formatDate = (timestamp: number) => { @@ -398,6 +403,18 @@ const HistoryView = ({ onDone }: HistoryViewProps) => { )} /> + {taskToDelete && ( + { + setDeleteDialogOpen(open) + if (!open) { + setTaskToDelete(null) + } + }} + /> + )} ) } diff --git a/webview-ui/src/components/history/__tests__/HistoryView.test.tsx b/webview-ui/src/components/history/__tests__/HistoryView.test.tsx index 7408b268786..12b0181af6b 100644 --- a/webview-ui/src/components/history/__tests__/HistoryView.test.tsx +++ b/webview-ui/src/components/history/__tests__/HistoryView.test.tsx @@ -135,7 +135,7 @@ describe("HistoryView", () => { }) }) - it("handles task deletion", () => { + it("handles task deletion", async () => { const onDone = jest.fn() render() @@ -143,9 +143,14 @@ describe("HistoryView", () => { const taskContainer = screen.getByTestId("virtuoso-item-1") fireEvent.mouseEnter(taskContainer) + // Click delete button to open confirmation dialog const deleteButton = within(taskContainer).getByTitle("Delete Task") fireEvent.click(deleteButton) + // Find and click the confirm delete button in the dialog + const confirmDeleteButton = screen.getByRole("button", { name: /delete/i }) + fireEvent.click(confirmDeleteButton) + // Verify vscode message was sent expect(vscode.postMessage).toHaveBeenCalledWith({ type: "deleteTaskWithId", diff --git a/webview-ui/src/components/settings/ApiErrorMessage.tsx b/webview-ui/src/components/settings/ApiErrorMessage.tsx new file mode 100644 index 00000000000..06764a1bfa0 --- /dev/null +++ b/webview-ui/src/components/settings/ApiErrorMessage.tsx @@ -0,0 +1,16 @@ +import React from "react" + +interface ApiErrorMessageProps { + errorMessage: string | undefined + children?: React.ReactNode +} + +export const ApiErrorMessage = ({ errorMessage, children }: ApiErrorMessageProps) => ( +
+
+
+
{errorMessage}
+
+ {children} +
+) diff --git a/webview-ui/src/components/settings/ApiOptions.tsx b/webview-ui/src/components/settings/ApiOptions.tsx index 1303e79c7ab..c30035cef01 100644 --- a/webview-ui/src/components/settings/ApiOptions.tsx +++ b/webview-ui/src/components/settings/ApiOptions.tsx @@ -1,8 +1,7 @@ -import { memo, useCallback, useMemo, useState } from "react" +import React, { memo, useCallback, useEffect, useMemo, useState } from "react" import { useDebounce, useEvent } from "react-use" import { Checkbox, Dropdown, Pane, type DropdownOption } from "vscrui" import { VSCodeLink, VSCodeRadio, VSCodeRadioGroup, VSCodeTextField } from "@vscode/webview-ui-toolkit/react" -import { TemperatureControl } from "./TemperatureControl" import * as vscodemodels from "vscode" import { @@ -34,45 +33,76 @@ import { requestyDefaultModelInfo, } from "../../../../src/shared/api" import { ExtensionMessage } from "../../../../src/shared/ExtensionMessage" + import { vscode } from "../../utils/vscode" import VSCodeButtonLink from "../common/VSCodeButtonLink" -import { OpenRouterModelPicker } from "./OpenRouterModelPicker" -import OpenAiModelPicker from "./OpenAiModelPicker" -import { GlamaModelPicker } from "./GlamaModelPicker" -import { UnboundModelPicker } from "./UnboundModelPicker" import { ModelInfoView } from "./ModelInfoView" import { DROPDOWN_Z_INDEX } from "./styles" -import { RequestyModelPicker } from "./RequestyModelPicker" +import { ModelPicker } from "./ModelPicker" +import { TemperatureControl } from "./TemperatureControl" +import { validateApiConfiguration, validateModelId } from "@/utils/validate" +import { ApiErrorMessage } from "./ApiErrorMessage" +import { ThinkingBudget } from "./ThinkingBudget" + +const modelsByProvider: Record> = { + anthropic: anthropicModels, + bedrock: bedrockModels, + vertex: vertexModels, + gemini: geminiModels, + "openai-native": openAiNativeModels, + deepseek: deepSeekModels, + mistral: mistralModels, +} interface ApiOptionsProps { uriScheme: string | undefined - apiConfiguration: ApiConfiguration | undefined + apiConfiguration: ApiConfiguration setApiConfigurationField: (field: K, value: ApiConfiguration[K]) => void - apiErrorMessage?: string - modelIdErrorMessage?: string fromWelcomeView?: boolean + errorMessage: string | undefined + setErrorMessage: React.Dispatch> } const ApiOptions = ({ uriScheme, apiConfiguration, setApiConfigurationField, - apiErrorMessage, - modelIdErrorMessage, fromWelcomeView, + errorMessage, + setErrorMessage, }: ApiOptionsProps) => { const [ollamaModels, setOllamaModels] = useState([]) const [lmStudioModels, setLmStudioModels] = useState([]) const [vsCodeLmModels, setVsCodeLmModels] = useState([]) + + const [openRouterModels, setOpenRouterModels] = useState>({ + [openRouterDefaultModelId]: openRouterDefaultModelInfo, + }) + + const [glamaModels, setGlamaModels] = useState>({ + [glamaDefaultModelId]: glamaDefaultModelInfo, + }) + + const [unboundModels, setUnboundModels] = useState>({ + [unboundDefaultModelId]: unboundDefaultModelInfo, + }) + + const [requestyModels, setRequestyModels] = useState>({ + [requestyDefaultModelId]: requestyDefaultModelInfo, + }) + + const [openAiModels, setOpenAiModels] = useState | null>(null) + const [anthropicBaseUrlSelected, setAnthropicBaseUrlSelected] = useState(!!apiConfiguration?.anthropicBaseUrl) const [azureApiVersionSelected, setAzureApiVersionSelected] = useState(!!apiConfiguration?.azureApiVersion) const [openRouterBaseUrlSelected, setOpenRouterBaseUrlSelected] = useState(!!apiConfiguration?.openRouterBaseUrl) const [isDescriptionExpanded, setIsDescriptionExpanded] = useState(false) - const inputEventTransform = (event: E) => (event as { target: HTMLInputElement })?.target?.value as any const noTransform = (value: T) => value + const inputEventTransform = (event: E) => (event as { target: HTMLInputElement })?.target?.value as any const dropdownEventTransform = (event: DropdownOption | string | undefined) => (typeof event == "string" ? event : event?.value) as T + const handleInputChange = useCallback( ( field: K, @@ -84,15 +114,32 @@ const ApiOptions = ({ [setApiConfigurationField], ) - const { selectedProvider, selectedModelId, selectedModelInfo } = useMemo(() => { - return normalizeApiConfiguration(apiConfiguration) - }, [apiConfiguration]) + const { selectedProvider, selectedModelId, selectedModelInfo } = useMemo( + () => normalizeApiConfiguration(apiConfiguration), + [apiConfiguration], + ) - // Pull ollama/lmstudio models - // Debounced model updates, only executed 250ms after the user stops typing + // Debounced refresh model updates, only executed 250ms after the user + // stops typing. useDebounce( () => { - if (selectedProvider === "ollama") { + if (selectedProvider === "openrouter") { + vscode.postMessage({ type: "refreshOpenRouterModels" }) + } else if (selectedProvider === "glama") { + vscode.postMessage({ type: "refreshGlamaModels" }) + } else if (selectedProvider === "unbound") { + vscode.postMessage({ type: "refreshUnboundModels" }) + } else if (selectedProvider === "requesty") { + vscode.postMessage({ + type: "refreshRequestyModels", + values: { apiKey: apiConfiguration?.requestyApiKey }, + }) + } else if (selectedProvider === "openai") { + vscode.postMessage({ + type: "refreshOpenAiModels", + values: { baseUrl: apiConfiguration?.openAiBaseUrl, apiKey: apiConfiguration?.openAiApiKey }, + }) + } else if (selectedProvider === "ollama") { vscode.postMessage({ type: "requestOllamaModels", text: apiConfiguration?.ollamaBaseUrl }) } else if (selectedProvider === "lmstudio") { vscode.postMessage({ type: "requestLmStudioModels", text: apiConfiguration?.lmStudioBaseUrl }) @@ -101,49 +148,95 @@ const ApiOptions = ({ } }, 250, - [selectedProvider, apiConfiguration?.ollamaBaseUrl, apiConfiguration?.lmStudioBaseUrl], + [ + selectedProvider, + apiConfiguration?.requestyApiKey, + apiConfiguration?.openAiBaseUrl, + apiConfiguration?.openAiApiKey, + apiConfiguration?.ollamaBaseUrl, + apiConfiguration?.lmStudioBaseUrl, + ], ) - const handleMessage = useCallback((event: MessageEvent) => { + + useEffect(() => { + const apiValidationResult = + validateApiConfiguration(apiConfiguration) || + validateModelId(apiConfiguration, glamaModels, openRouterModels, unboundModels, requestyModels) + + setErrorMessage(apiValidationResult) + }, [apiConfiguration, glamaModels, openRouterModels, setErrorMessage, unboundModels, requestyModels]) + + const onMessage = useCallback((event: MessageEvent) => { const message: ExtensionMessage = event.data - if (message.type === "ollamaModels" && Array.isArray(message.ollamaModels)) { - const newModels = message.ollamaModels - setOllamaModels(newModels) - } else if (message.type === "lmStudioModels" && Array.isArray(message.lmStudioModels)) { - const newModels = message.lmStudioModels - setLmStudioModels(newModels) - } else if (message.type === "vsCodeLmModels" && Array.isArray(message.vsCodeLmModels)) { - const newModels = message.vsCodeLmModels - setVsCodeLmModels(newModels) + + switch (message.type) { + case "openRouterModels": { + const updatedModels = message.openRouterModels ?? {} + setOpenRouterModels({ [openRouterDefaultModelId]: openRouterDefaultModelInfo, ...updatedModels }) + break + } + case "glamaModels": { + const updatedModels = message.glamaModels ?? {} + setGlamaModels({ [glamaDefaultModelId]: glamaDefaultModelInfo, ...updatedModels }) + break + } + case "unboundModels": { + const updatedModels = message.unboundModels ?? {} + setUnboundModels({ [unboundDefaultModelId]: unboundDefaultModelInfo, ...updatedModels }) + break + } + case "requestyModels": { + const updatedModels = message.requestyModels ?? {} + setRequestyModels({ [requestyDefaultModelId]: requestyDefaultModelInfo, ...updatedModels }) + break + } + case "openAiModels": { + const updatedModels = message.openAiModels ?? [] + setOpenAiModels(Object.fromEntries(updatedModels.map((item) => [item, openAiModelInfoSaneDefaults]))) + break + } + case "ollamaModels": + { + const newModels = message.ollamaModels ?? [] + setOllamaModels(newModels) + } + break + case "lmStudioModels": + { + const newModels = message.lmStudioModels ?? [] + setLmStudioModels(newModels) + } + break + case "vsCodeLmModels": + { + const newModels = message.vsCodeLmModels ?? [] + setVsCodeLmModels(newModels) + } + break } }, []) - useEvent("message", handleMessage) - - const createDropdown = (models: Record) => { - const options: DropdownOption[] = [ - { value: "", label: "Select a model..." }, - ...Object.keys(models).map((modelId) => ({ - value: modelId, - label: modelId, - })), - ] - return ( - { - setApiConfigurationField("apiModelId", typeof value == "string" ? value : value?.value) - }} - style={{ width: "100%" }} - options={options} - /> - ) - } + + useEvent("message", onMessage) + + const selectedProviderModelOptions: DropdownOption[] = useMemo( + () => + modelsByProvider[selectedProvider] + ? [ + { value: "", label: "Select a model..." }, + ...Object.keys(modelsByProvider[selectedProvider]).map((modelId) => ({ + value: modelId, + label: modelId, + })), + ] + : [], + [selectedProvider], + ) return (
-
+ {errorMessage && } + {selectedProvider === "anthropic" && (
- Anthropic API Key + Anthropic API Key { setAnthropicBaseUrlSelected(checked) + if (!checked) { setApiConfigurationField("anthropicBaseUrl", "") } @@ -228,7 +324,7 @@ const ApiOptions = ({ type="password" onInput={handleInputChange("glamaApiKey")} placeholder="Enter API Key..."> - Glama API Key + Glama API Key {!apiConfiguration?.glamaApiKey && ( - Requesty API Key + Requesty API Key

- OpenAI API Key + OpenAI API Key

- Mistral API Key + Mistral API Key

- Codestral Base URL (Optional) + Codestral Base URL (Optional)

- OpenRouter API Key + OpenRouter API Key {!apiConfiguration?.openRouterApiKey && (

@@ -384,6 +480,7 @@ const ApiOptions = ({ checked={openRouterBaseUrlSelected} onChange={(checked: boolean) => { setOpenRouterBaseUrlSelected(checked) + if (!checked) { setApiConfigurationField("openRouterBaseUrl", "") } @@ -429,7 +526,7 @@ const ApiOptions = ({ style={{ width: "100%" }} onInput={handleInputChange("awsProfile")} placeholder="Enter profile name"> - AWS Profile Name + AWS Profile Name ) : ( <> @@ -440,7 +537,7 @@ const ApiOptions = ({ type="password" onInput={handleInputChange("awsAccessKey")} placeholder="Enter Access Key..."> - AWS Access Key + AWS Access Key - AWS Secret Key + AWS Secret Key - AWS Session Token + AWS Session Token )}

)} - {apiConfiguration?.apiProvider === "vertex" && ( + {selectedProvider === "vertex" && (
- Google Cloud Project ID + Google Cloud Project ID
- Gemini API Key + Gemini API Key

- Base URL + Base URL - API Key + API Key - +

{ setAzureApiVersionSelected(checked) + if (!checked) { setApiConfigurationField("azureApiVersion", "") } @@ -635,12 +743,7 @@ const ApiOptions = ({ placeholder={`Default: ${azureOpenAiDefaultApiVersion}`} /> )} - -
+
{ + onInput={handleInputChange("openAiCustomModelInfo", (e) => { const value = parseInt((e.target as HTMLInputElement).value) return { ...(apiConfiguration?.openAiCustomModelInfo || @@ -700,7 +803,7 @@ const ApiOptions = ({ } })} placeholder="e.g. 4096"> - Max Output Tokens + Max Output Tokens
{ + onInput={handleInputChange("openAiCustomModelInfo", (e) => { const value = (e.target as HTMLInputElement).value const parsed = parseInt(value) return { @@ -750,7 +853,7 @@ const ApiOptions = ({ } })} placeholder="e.g. 128000"> - Context Window Size + Context Window Size
- Image Support + Image Support - Computer Use + Computer Use { + onInput={handleInputChange("openAiCustomModelInfo", (e) => { const value = (e.target as HTMLInputElement).value - const parsed = parseInt(value) + const parsed = parseFloat(value) return { ...(apiConfiguration?.openAiCustomModelInfo ?? openAiModelInfoSaneDefaults), @@ -897,7 +1000,7 @@ const ApiOptions = ({ })} placeholder="e.g. 0.0001">
- Input Price + Input Price { + onInput={handleInputChange("openAiCustomModelInfo", (e) => { const value = (e.target as HTMLInputElement).value - const parsed = parseInt(value) + const parsed = parseFloat(value) return { ...(apiConfiguration?.openAiCustomModelInfo || openAiModelInfoSaneDefaults), @@ -942,7 +1045,7 @@ const ApiOptions = ({ })} placeholder="e.g. 0.0002">
- Output Price + Output Price {/* end Model Info Configuration */} - -

- - (Note: Roo Code uses complex prompts and works best - with Claude models. Less capable models may not work as expected.) - -

)} @@ -989,14 +1080,14 @@ const ApiOptions = ({ type="url" onInput={handleInputChange("lmStudioBaseUrl")} placeholder={"Default: http://localhost:1234"}> - Base URL (optional) + Base URL (optional) - Model ID + Model ID {lmStudioModels.length > 0 && ( {" "} feature to use it with this extension.{" "} - (Note: Roo Code uses complex prompts and works best + (Note: Roo Code uses complex prompts and works best with Claude models. Less capable models may not work as expected.)

@@ -1050,7 +1141,7 @@ const ApiOptions = ({ type="password" onInput={handleInputChange("deepSeekApiKey")} placeholder="Enter API Key..."> - DeepSeek API Key + DeepSeek API Key

{vsCodeLmModels.length > 0 ? ( - Base URL (optional) + Base URL (optional) - Model ID + Model ID + {errorMessage && ( +
+ + {errorMessage} +
+ )} {ollamaModels.length > 0 && ( - (Note: Roo Code uses complex prompts and works best + (Note: Roo Code uses complex prompts and works best with Claude models. Less capable models may not work as expected.)

@@ -1189,7 +1286,7 @@ const ApiOptions = ({ type="password" onChange={handleInputChange("unboundApiKey")} placeholder="Enter API Key..."> - Unbound API Key + Unbound API Key {!apiConfiguration?.unboundApiKey && ( This key is stored locally and only used to make API requests from this extension.

-
)} - {apiErrorMessage && ( -

- - {apiErrorMessage} -

+ {selectedProvider === "openrouter" && ( + )} - {selectedProvider === "glama" && } - - {selectedProvider === "openrouter" && } - {selectedProvider === "requesty" && } - - {selectedProvider !== "glama" && - selectedProvider !== "openrouter" && - selectedProvider !== "requesty" && - selectedProvider !== "openai" && - selectedProvider !== "ollama" && - selectedProvider !== "lmstudio" && - selectedProvider !== "unbound" && ( - <> -
- - {selectedProvider === "anthropic" && createDropdown(anthropicModels)} - {selectedProvider === "bedrock" && createDropdown(bedrockModels)} - {selectedProvider === "vertex" && createDropdown(vertexModels)} - {selectedProvider === "gemini" && createDropdown(geminiModels)} - {selectedProvider === "openai-native" && createDropdown(openAiNativeModels)} - {selectedProvider === "deepseek" && createDropdown(deepSeekModels)} - {selectedProvider === "mistral" && createDropdown(mistralModels)} -
+ {selectedProvider === "glama" && ( + + )} + + {selectedProvider === "unbound" && ( + + )} - + )} + + {selectedProviderModelOptions.length > 0 && ( + <> +
+ + { + setApiConfigurationField("apiModelId", typeof value == "string" ? value : value?.value) + }} + options={selectedProviderModelOptions} + className="w-full" /> - - )} +
+ + + + )} {!fromWelcomeView && ( -
+
)} - - {modelIdErrorMessage && ( -

- - {modelIdErrorMessage} -

- )}
) } @@ -1300,6 +1423,7 @@ export function normalizeApiConfiguration(apiConfiguration?: ApiConfiguration) { const getProviderData = (models: Record, defaultId: string) => { let selectedModelId: string let selectedModelInfo: ModelInfo + if (modelId && modelId in models) { selectedModelId = modelId selectedModelInfo = models[modelId] @@ -1307,8 +1431,10 @@ export function normalizeApiConfiguration(apiConfiguration?: ApiConfiguration) { selectedModelId = defaultId selectedModelInfo = models[defaultId] } + return { selectedProvider: provider, selectedModelId, selectedModelInfo } } + switch (provider) { case "anthropic": return getProviderData(anthropicModels, anthropicDefaultModelId) @@ -1322,19 +1448,31 @@ export function normalizeApiConfiguration(apiConfiguration?: ApiConfiguration) { return getProviderData(deepSeekModels, deepSeekDefaultModelId) case "openai-native": return getProviderData(openAiNativeModels, openAiNativeDefaultModelId) + case "mistral": + return getProviderData(mistralModels, mistralDefaultModelId) + case "openrouter": + return { + selectedProvider: provider, + selectedModelId: apiConfiguration?.openRouterModelId || openRouterDefaultModelId, + selectedModelInfo: apiConfiguration?.openRouterModelInfo || openRouterDefaultModelInfo, + } case "glama": return { selectedProvider: provider, selectedModelId: apiConfiguration?.glamaModelId || glamaDefaultModelId, selectedModelInfo: apiConfiguration?.glamaModelInfo || glamaDefaultModelInfo, } - case "mistral": - return getProviderData(mistralModels, mistralDefaultModelId) - case "openrouter": + case "unbound": return { selectedProvider: provider, - selectedModelId: apiConfiguration?.openRouterModelId || openRouterDefaultModelId, - selectedModelInfo: apiConfiguration?.openRouterModelInfo || openRouterDefaultModelInfo, + selectedModelId: apiConfiguration?.unboundModelId || unboundDefaultModelId, + selectedModelInfo: apiConfiguration?.unboundModelInfo || unboundDefaultModelInfo, + } + case "requesty": + return { + selectedProvider: provider, + selectedModelId: apiConfiguration?.requestyModelId || requestyDefaultModelId, + selectedModelInfo: apiConfiguration?.requestyModelInfo || requestyDefaultModelInfo, } case "openai": return { @@ -1362,21 +1500,9 @@ export function normalizeApiConfiguration(apiConfiguration?: ApiConfiguration) { : "", selectedModelInfo: { ...openAiModelInfoSaneDefaults, - supportsImages: false, // VSCode LM API currently doesn't support images + supportsImages: false, // VSCode LM API currently doesn't support images. }, } - case "unbound": - return { - selectedProvider: provider, - selectedModelId: apiConfiguration?.unboundModelId || unboundDefaultModelId, - selectedModelInfo: apiConfiguration?.unboundModelInfo || unboundDefaultModelInfo, - } - case "requesty": - return { - selectedProvider: provider, - selectedModelId: apiConfiguration?.requestyModelId || requestyDefaultModelId, - selectedModelInfo: apiConfiguration?.requestyModelInfo || requestyDefaultModelInfo, - } default: return getProviderData(anthropicModels, anthropicDefaultModelId) } diff --git a/webview-ui/src/components/settings/GlamaModelPicker.tsx b/webview-ui/src/components/settings/GlamaModelPicker.tsx deleted file mode 100644 index cb813a0d058..00000000000 --- a/webview-ui/src/components/settings/GlamaModelPicker.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import { ModelPicker } from "./ModelPicker" -import { glamaDefaultModelId } from "../../../../src/shared/api" - -export const GlamaModelPicker = () => ( - -) diff --git a/webview-ui/src/components/settings/ModelPicker.tsx b/webview-ui/src/components/settings/ModelPicker.tsx index b21b37ef0f4..5a7737edd56 100644 --- a/webview-ui/src/components/settings/ModelPicker.tsx +++ b/webview-ui/src/components/settings/ModelPicker.tsx @@ -1,186 +1,95 @@ -import { VSCodeLink } from "@vscode/webview-ui-toolkit/react" -import debounce from "debounce" import { useMemo, useState, useCallback, useEffect, useRef } from "react" -import { useMount } from "react-use" -import { CaretSortIcon, CheckIcon } from "@radix-ui/react-icons" +import { VSCodeLink } from "@vscode/webview-ui-toolkit/react" -import { cn } from "@/lib/utils" -import { - Button, - Command, - CommandEmpty, - CommandGroup, - CommandInput, - CommandItem, - CommandList, - Popover, - PopoverContent, - PopoverTrigger, -} from "@/components/ui" +import { Combobox, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem } from "@/components/ui/combobox" + +import { ApiConfiguration, ModelInfo } from "../../../../src/shared/api" -import { useExtensionState } from "../../context/ExtensionStateContext" -import { vscode } from "../../utils/vscode" import { normalizeApiConfiguration } from "./ApiOptions" +import { ThinkingBudget } from "./ThinkingBudget" import { ModelInfoView } from "./ModelInfoView" -type ModelProvider = "glama" | "openRouter" | "unbound" | "requesty" | "openAi" +type ExtractType = NonNullable< + { [K in keyof ApiConfiguration]: Required[K] extends T ? K : never }[keyof ApiConfiguration] +> -type ModelKeys = `${T}Models` -type ConfigKeys = `${T}ModelId` -type InfoKeys = `${T}ModelInfo` -type RefreshMessageType = `refresh${Capitalize}Models` +type ModelIdKeys = NonNullable< + { [K in keyof ApiConfiguration]: K extends `${string}ModelId` ? K : never }[keyof ApiConfiguration] +> -interface ModelPickerProps { +interface ModelPickerProps { defaultModelId: string - modelsKey: ModelKeys - configKey: ConfigKeys - infoKey: InfoKeys - refreshMessageType: RefreshMessageType - refreshValues?: Record + defaultModelInfo?: ModelInfo + models: Record | null + modelIdKey: ModelIdKeys + modelInfoKey: ExtractType serviceName: string serviceUrl: string - recommendedModel: string - allowCustomModel?: boolean + apiConfiguration: ApiConfiguration + setApiConfigurationField: (field: K, value: ApiConfiguration[K]) => void } export const ModelPicker = ({ defaultModelId, - modelsKey, - configKey, - infoKey, - refreshMessageType, - refreshValues, + models, + modelIdKey, + modelInfoKey, serviceName, serviceUrl, - recommendedModel, - allowCustomModel = false, + apiConfiguration, + setApiConfigurationField, + defaultModelInfo, }: ModelPickerProps) => { - const [customModelId, setCustomModelId] = useState("") - const [isCustomModel, setIsCustomModel] = useState(false) - const [open, setOpen] = useState(false) - const [value, setValue] = useState(defaultModelId) const [isDescriptionExpanded, setIsDescriptionExpanded] = useState(false) - const prevRefreshValuesRef = useRef | undefined>() - - const { apiConfiguration, [modelsKey]: models, onUpdateApiConfig, setApiConfiguration } = useExtensionState() + const isInitialized = useRef(false) - const modelIds = useMemo( - () => (Array.isArray(models) ? models : Object.keys(models)).sort((a, b) => a.localeCompare(b)), - [models], - ) + const modelIds = useMemo(() => Object.keys(models ?? {}).sort((a, b) => a.localeCompare(b)), [models]) const { selectedModelId, selectedModelInfo } = useMemo( () => normalizeApiConfiguration(apiConfiguration), [apiConfiguration], ) - const onSelectCustomModel = useCallback( - (modelId: string) => { - setCustomModelId(modelId) - const modelInfo = { id: modelId } - const apiConfig = { ...apiConfiguration, [configKey]: modelId, [infoKey]: modelInfo } - setApiConfiguration(apiConfig) - onUpdateApiConfig(apiConfig) - setValue(modelId) - setOpen(false) - setIsCustomModel(false) - }, - [apiConfiguration, configKey, infoKey, onUpdateApiConfig, setApiConfiguration], - ) - const onSelect = useCallback( (modelId: string) => { - const modelInfo = Array.isArray(models) - ? { id: modelId } // For OpenAI models which are just strings - : models[modelId] // For other models that have full info objects - const apiConfig = { ...apiConfiguration, [configKey]: modelId, [infoKey]: modelInfo } - setApiConfiguration(apiConfig) - onUpdateApiConfig(apiConfig) - setValue(modelId) - setOpen(false) + const modelInfo = models?.[modelId] + setApiConfigurationField(modelIdKey, modelId) + setApiConfigurationField(modelInfoKey, modelInfo ?? defaultModelInfo) }, - [apiConfiguration, configKey, infoKey, models, onUpdateApiConfig, setApiConfiguration], + [modelIdKey, modelInfoKey, models, setApiConfigurationField, defaultModelInfo], ) - const debouncedRefreshModels = useMemo(() => { - return debounce(() => { - const message = refreshValues - ? { type: refreshMessageType, values: refreshValues } - : { type: refreshMessageType } - vscode.postMessage(message) - }, 100) - }, [refreshMessageType, refreshValues]) - - useMount(() => { - debouncedRefreshModels() - return () => debouncedRefreshModels.clear() - }) + const inputValue = apiConfiguration[modelIdKey] useEffect(() => { - if (!refreshValues) { - prevRefreshValuesRef.current = undefined - return - } - - // Check if all values in refreshValues are truthy - if (Object.values(refreshValues).some((value) => !value)) { - prevRefreshValuesRef.current = undefined - return + if (!inputValue && !isInitialized.current) { + const initialValue = modelIds.includes(selectedModelId) ? selectedModelId : defaultModelId + setApiConfigurationField(modelIdKey, initialValue) } - // Compare with previous values - const prevValues = prevRefreshValuesRef.current - if (prevValues && JSON.stringify(prevValues) === JSON.stringify(refreshValues)) { - return - } - - prevRefreshValuesRef.current = refreshValues - debouncedRefreshModels() - }, [debouncedRefreshModels, refreshValues]) - - useEffect(() => setValue(selectedModelId), [selectedModelId]) + isInitialized.current = true + }, [inputValue, modelIds, setApiConfigurationField, modelIdKey, selectedModelId, defaultModelId]) return ( <>
Model
- - - - - - - - - No model found. - - {modelIds.map((model) => ( - - {model} - - - ))} - - {allowCustomModel && ( - - { - setIsCustomModel(true) - setOpen(false) - }}> - + Add custom model - - - )} - - - - - {selectedModelId && selectedModelInfo && ( + + + + No model found. + {modelIds.map((model) => ( + + {model} + + ))} + + + + {selectedModelId && selectedModelInfo && selectedModelId === inputValue && ( If you're unsure which model to choose, Roo Code works best with{" "} - onSelect(recommendedModel)}>{recommendedModel}. + onSelect(defaultModelId)}>{defaultModelId}. You can also try searching "free" for no-cost options currently available.

- {allowCustomModel && isCustomModel && ( -
-
-

Add Custom Model

- setCustomModelId(e.target.value)} - /> -
- - -
-
-
- )} ) } diff --git a/webview-ui/src/components/settings/OpenAiModelPicker.tsx b/webview-ui/src/components/settings/OpenAiModelPicker.tsx deleted file mode 100644 index 040da1d4210..00000000000 --- a/webview-ui/src/components/settings/OpenAiModelPicker.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import React from "react" -import { useExtensionState } from "../../context/ExtensionStateContext" -import { ModelPicker } from "./ModelPicker" - -const OpenAiModelPicker: React.FC = () => { - const { apiConfiguration } = useExtensionState() - - return ( - - ) -} - -export default OpenAiModelPicker diff --git a/webview-ui/src/components/settings/OpenRouterModelPicker.tsx b/webview-ui/src/components/settings/OpenRouterModelPicker.tsx deleted file mode 100644 index 9111407cd61..00000000000 --- a/webview-ui/src/components/settings/OpenRouterModelPicker.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import { ModelPicker } from "./ModelPicker" -import { openRouterDefaultModelId } from "../../../../src/shared/api" - -export const OpenRouterModelPicker = () => ( - -) diff --git a/webview-ui/src/components/settings/RequestyModelPicker.tsx b/webview-ui/src/components/settings/RequestyModelPicker.tsx deleted file mode 100644 index e0759a43ba1..00000000000 --- a/webview-ui/src/components/settings/RequestyModelPicker.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import { ModelPicker } from "./ModelPicker" -import { requestyDefaultModelId } from "../../../../src/shared/api" -import { useExtensionState } from "@/context/ExtensionStateContext" - -export const RequestyModelPicker = () => { - const { apiConfiguration } = useExtensionState() - return ( - - ) -} diff --git a/webview-ui/src/components/settings/SettingsView.tsx b/webview-ui/src/components/settings/SettingsView.tsx index 495bf49bd77..d3e65a99ea8 100644 --- a/webview-ui/src/components/settings/SettingsView.tsx +++ b/webview-ui/src/components/settings/SettingsView.tsx @@ -1,15 +1,7 @@ +import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react" import { VSCodeButton, VSCodeCheckbox, VSCodeLink, VSCodeTextField } from "@vscode/webview-ui-toolkit/react" -import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useRef, useState } from "react" -import { ExtensionStateContextType, useExtensionState } from "../../context/ExtensionStateContext" -import { validateApiConfiguration, validateModelId } from "../../utils/validate" -import { vscode } from "../../utils/vscode" -import ApiOptions from "./ApiOptions" -import ExperimentalFeature from "./ExperimentalFeature" -import { EXPERIMENT_IDS, experimentConfigsMap, ExperimentId } from "../../../../src/shared/experiments" -import ApiConfigManager from "./ApiConfigManager" -import { Dropdown } from "vscrui" -import type { DropdownOption } from "vscrui" -import { ApiConfiguration } from "../../../../src/shared/api" +import { Button, Dropdown, type DropdownOption } from "vscrui" + import { AlertDialog, AlertDialogContent, @@ -19,7 +11,16 @@ import { AlertDialogAction, AlertDialogHeader, AlertDialogFooter, -} from "../ui/alert-dialog" +} from "@/components/ui" + +import { vscode } from "../../utils/vscode" +import { ExtensionStateContextType, useExtensionState } from "../../context/ExtensionStateContext" +import { EXPERIMENT_IDS, experimentConfigsMap, ExperimentId } from "../../../../src/shared/experiments" +import { ApiConfiguration } from "../../../../src/shared/api" + +import ExperimentalFeature from "./ExperimentalFeature" +import ApiConfigManager from "./ApiConfigManager" +import ApiOptions from "./ApiOptions" type SettingsViewProps = { onDone: () => void @@ -31,19 +32,17 @@ export interface SettingsViewRef { const SettingsView = forwardRef(({ onDone }, ref) => { const extensionState = useExtensionState() - const [apiErrorMessage, setApiErrorMessage] = useState(undefined) - const [modelIdErrorMessage, setModelIdErrorMessage] = useState(undefined) const [commandInput, setCommandInput] = useState("") const [isDiscardDialogShow, setDiscardDialogShow] = useState(false) const [cachedState, setCachedState] = useState(extensionState) const [isChangeDetected, setChangeDetected] = useState(false) const prevApiConfigName = useRef(extensionState.currentApiConfigName) const confirmDialogHandler = useRef<() => void>() + const [errorMessage, setErrorMessage] = useState(undefined) // TODO: Reduce WebviewMessage/ExtensionState complexity const { currentApiConfigName } = extensionState const { - apiConfiguration, alwaysAllowReadOnly, allowedCommands, alwaysAllowBrowser, @@ -68,17 +67,19 @@ const SettingsView = forwardRef(({ onDone }, writeDelayMs, } = cachedState + //Make sure apiConfiguration is initialized and managed by SettingsView + const apiConfiguration = useMemo(() => cachedState.apiConfiguration ?? {}, [cachedState.apiConfiguration]) + useEffect(() => { - // Update only when currentApiConfigName is changed - // Expected to be triggered by loadApiConfiguration/upsertApiConfiguration + // Update only when currentApiConfigName is changed. + // Expected to be triggered by loadApiConfiguration/upsertApiConfiguration. if (prevApiConfigName.current === currentApiConfigName) { return } - setCachedState((prevCachedState) => ({ - ...prevCachedState, - ...extensionState, - })) + + setCachedState((prevCachedState) => ({ ...prevCachedState, ...extensionState })) prevApiConfigName.current = currentApiConfigName + // console.log("useEffect: currentApiConfigName changed, setChangeDetected -> false") setChangeDetected(false) }, [currentApiConfigName, extensionState, isChangeDetected]) @@ -88,11 +89,10 @@ const SettingsView = forwardRef(({ onDone }, if (prevState[field] === value) { return prevState } + + // console.log(`setCachedStateField(${field} -> ${value}): setChangeDetected -> true`) setChangeDetected(true) - return { - ...prevState, - [field]: value, - } + return { ...prevState, [field]: value } }) }, [], @@ -104,14 +104,11 @@ const SettingsView = forwardRef(({ onDone }, if (prevState.apiConfiguration?.[field] === value) { return prevState } + + // console.log(`setApiConfigurationField(${field} -> ${value}): setChangeDetected -> true`) setChangeDetected(true) - return { - ...prevState, - apiConfiguration: { - ...prevState.apiConfiguration, - [field]: value, - }, - } + + return { ...prevState, apiConfiguration: { ...prevState.apiConfiguration, [field]: value } } }) }, [], @@ -122,7 +119,10 @@ const SettingsView = forwardRef(({ onDone }, if (prevState.experiments?.[id] === enabled) { return prevState } + + // console.log("setExperimentEnabled: setChangeDetected -> true") setChangeDetected(true) + return { ...prevState, experiments: { ...prevState.experiments, [id]: enabled }, @@ -130,17 +130,10 @@ const SettingsView = forwardRef(({ onDone }, }) }, []) + const isSettingValid = !errorMessage + const handleSubmit = () => { - const apiValidationResult = validateApiConfiguration(apiConfiguration) - const modelIdValidationResult = validateModelId( - apiConfiguration, - extensionState.glamaModels, - extensionState.openRouterModels, - ) - - setApiErrorMessage(apiValidationResult) - setModelIdErrorMessage(modelIdValidationResult) - if (!apiValidationResult && !modelIdValidationResult) { + if (isSettingValid) { vscode.postMessage({ type: "alwaysAllowReadOnly", bool: alwaysAllowReadOnly }) vscode.postMessage({ type: "alwaysAllowWrite", bool: alwaysAllowWrite }) vscode.postMessage({ type: "alwaysAllowExecute", bool: alwaysAllowExecute }) @@ -162,39 +155,14 @@ const SettingsView = forwardRef(({ onDone }, vscode.postMessage({ type: "rateLimitSeconds", value: rateLimitSeconds }) vscode.postMessage({ type: "maxOpenTabsContext", value: maxOpenTabsContext }) vscode.postMessage({ type: "currentApiConfigName", text: currentApiConfigName }) - vscode.postMessage({ - type: "updateExperimental", - values: experiments, - }) + vscode.postMessage({ type: "updateExperimental", values: experiments }) vscode.postMessage({ type: "alwaysAllowModeSwitch", bool: alwaysAllowModeSwitch }) - - vscode.postMessage({ - type: "upsertApiConfiguration", - text: currentApiConfigName, - apiConfiguration, - }) - // onDone() + vscode.postMessage({ type: "upsertApiConfiguration", text: currentApiConfigName, apiConfiguration }) + // console.log("handleSubmit: setChangeDetected -> false") setChangeDetected(false) } } - useEffect(() => { - setApiErrorMessage(undefined) - setModelIdErrorMessage(undefined) - }, [apiConfiguration]) - - // Initial validation on mount - useEffect(() => { - const apiValidationResult = validateApiConfiguration(apiConfiguration) - const modelIdValidationResult = validateModelId( - apiConfiguration, - extensionState.glamaModels, - extensionState.openRouterModels, - ) - setApiErrorMessage(apiValidationResult) - setModelIdErrorMessage(modelIdValidationResult) - }, [apiConfiguration, extensionState.glamaModels, extensionState.openRouterModels]) - const checkUnsaveChanges = useCallback( (then: () => void) => { if (isChangeDetected) { @@ -207,13 +175,7 @@ const SettingsView = forwardRef(({ onDone }, [isChangeDetected], ) - useImperativeHandle( - ref, - () => ({ - checkUnsaveChanges, - }), - [checkUnsaveChanges], - ) + useImperativeHandle(ref, () => ({ checkUnsaveChanges }), [checkUnsaveChanges]) const onConfirmDialogResult = useCallback((confirm: boolean) => { if (confirm) { @@ -231,10 +193,7 @@ const SettingsView = forwardRef(({ onDone }, const newCommands = [...currentCommands, commandInput] setCachedStateField("allowedCommands", newCommands) setCommandInput("") - vscode.postMessage({ - type: "allowedCommands", - commands: newCommands, - }) + vscode.postMessage({ type: "allowedCommands", commands: newCommands }) } } @@ -288,13 +247,14 @@ const SettingsView = forwardRef(({ onDone }, justifyContent: "space-between", gap: "6px", }}> - + disabled={!isChangeDetected || !isSettingValid}> Save - + (({ onDone }, uriScheme={extensionState.uriScheme} apiConfiguration={apiConfiguration} setApiConfigurationField={setApiConfigurationField} - apiErrorMessage={apiErrorMessage} - modelIdErrorMessage={modelIdErrorMessage} + errorMessage={errorMessage} + setErrorMessage={setErrorMessage} />
@@ -765,7 +725,7 @@ const SettingsView = forwardRef(({ onDone }, color: "var(--vscode-descriptionForeground)", }}> When enabled, Roo will be able to edit files more quickly and will automatically reject - truncated full-file writes. Works best with the latest Claude 3.5 Sonnet model. + truncated full-file writes. Works best with the latest Claude 3.7 Sonnet model.

{diffEnabled && ( diff --git a/webview-ui/src/components/settings/ThinkingBudget.tsx b/webview-ui/src/components/settings/ThinkingBudget.tsx new file mode 100644 index 00000000000..efaa90dc39a --- /dev/null +++ b/webview-ui/src/components/settings/ThinkingBudget.tsx @@ -0,0 +1,29 @@ +import { Slider } from "@/components/ui" + +import { ApiConfiguration, ModelInfo, THINKING_BUDGET } from "../../../../src/shared/api" + +interface ThinkingBudgetProps { + apiConfiguration: ApiConfiguration + setApiConfigurationField: (field: K, value: ApiConfiguration[K]) => void + modelInfo?: ModelInfo +} + +export const ThinkingBudget = ({ apiConfiguration, setApiConfigurationField, modelInfo }: ThinkingBudgetProps) => { + const budget = apiConfiguration?.anthropicThinking ?? THINKING_BUDGET.default + + return modelInfo && modelInfo.thinking ? ( +
+
Thinking Budget
+
+ setApiConfigurationField("anthropicThinking", value[0])} + /> +
{budget}
+
+
+ ) : null +} diff --git a/webview-ui/src/components/settings/UnboundModelPicker.tsx b/webview-ui/src/components/settings/UnboundModelPicker.tsx deleted file mode 100644 index 4901884f1e6..00000000000 --- a/webview-ui/src/components/settings/UnboundModelPicker.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import { ModelPicker } from "./ModelPicker" -import { unboundDefaultModelId } from "../../../../src/shared/api" - -export const UnboundModelPicker = () => ( - -) diff --git a/webview-ui/src/components/settings/__tests__/ApiOptions.test.tsx b/webview-ui/src/components/settings/__tests__/ApiOptions.test.tsx index 8f2d0dff893..73394bae104 100644 --- a/webview-ui/src/components/settings/__tests__/ApiOptions.test.tsx +++ b/webview-ui/src/components/settings/__tests__/ApiOptions.test.tsx @@ -51,6 +51,8 @@ describe("ApiOptions", () => { render( {}} uriScheme={undefined} apiConfiguration={{}} setApiConfigurationField={() => {}} @@ -69,4 +71,6 @@ describe("ApiOptions", () => { renderApiOptions({ fromWelcomeView: true }) expect(screen.queryByTestId("temperature-control")).not.toBeInTheDocument() }) + + //TODO: More test cases needed }) diff --git a/webview-ui/src/components/settings/__tests__/ModelPicker.test.tsx b/webview-ui/src/components/settings/__tests__/ModelPicker.test.tsx index 4e7c67c1872..49d60c55c48 100644 --- a/webview-ui/src/components/settings/__tests__/ModelPicker.test.tsx +++ b/webview-ui/src/components/settings/__tests__/ModelPicker.test.tsx @@ -3,7 +3,6 @@ import { screen, fireEvent, render } from "@testing-library/react" import { act } from "react" import { ModelPicker } from "../ModelPicker" -import { useExtensionState } from "../../../context/ExtensionStateContext" jest.mock("../../../context/ExtensionStateContext", () => ({ useExtensionState: jest.fn(), @@ -20,36 +19,40 @@ global.ResizeObserver = MockResizeObserver Element.prototype.scrollIntoView = jest.fn() describe("ModelPicker", () => { - const mockOnUpdateApiConfig = jest.fn() - const mockSetApiConfiguration = jest.fn() - + const mockSetApiConfigurationField = jest.fn() + const modelInfo = { + maxTokens: 8192, + contextWindow: 200_000, + supportsImages: true, + supportsComputerUse: true, + supportsPromptCache: true, + inputPrice: 3.0, + outputPrice: 15.0, + cacheWritesPrice: 3.75, + cacheReadsPrice: 0.3, + } + const mockModels = { + model1: { name: "Model 1", description: "Test model 1", ...modelInfo }, + model2: { name: "Model 2", description: "Test model 2", ...modelInfo }, + } const defaultProps = { + apiConfiguration: {}, defaultModelId: "model1", - modelsKey: "glamaModels" as const, - configKey: "glamaModelId" as const, - infoKey: "glamaModelInfo" as const, - refreshMessageType: "refreshGlamaModels" as const, + defaultModelInfo: modelInfo, + modelIdKey: "glamaModelId" as const, + modelInfoKey: "glamaModelInfo" as const, serviceName: "Test Service", serviceUrl: "https://test.service", recommendedModel: "recommended-model", - } - - const mockModels = { - model1: { name: "Model 1", description: "Test model 1" }, - model2: { name: "Model 2", description: "Test model 2" }, + models: mockModels, + setApiConfigurationField: mockSetApiConfigurationField, } beforeEach(() => { jest.clearAllMocks() - ;(useExtensionState as jest.Mock).mockReturnValue({ - apiConfiguration: {}, - setApiConfiguration: mockSetApiConfiguration, - glamaModels: mockModels, - onUpdateApiConfig: mockOnUpdateApiConfig, - }) }) - it("calls onUpdateApiConfig when a model is selected", async () => { + it("calls setApiConfigurationField when a model is selected", async () => { await act(async () => { render() }) @@ -67,20 +70,12 @@ describe("ModelPicker", () => { await act(async () => { // Find and click the model item by its value. - const modelItem = screen.getByRole("option", { name: "model2" }) - fireEvent.click(modelItem) + const modelItem = screen.getByTestId("model-input") + fireEvent.input(modelItem, { target: { value: "model2" } }) }) // Verify the API config was updated. - expect(mockSetApiConfiguration).toHaveBeenCalledWith({ - glamaModelId: "model2", - glamaModelInfo: mockModels["model2"], - }) - - // Verify onUpdateApiConfig was called with the new config. - expect(mockOnUpdateApiConfig).toHaveBeenCalledWith({ - glamaModelId: "model2", - glamaModelInfo: mockModels["model2"], - }) + expect(mockSetApiConfigurationField).toHaveBeenCalledWith(defaultProps.modelIdKey, "model2") + expect(mockSetApiConfigurationField).toHaveBeenCalledWith(defaultProps.modelInfoKey, mockModels.model2) }) }) diff --git a/webview-ui/src/components/ui/alert-dialog.tsx b/webview-ui/src/components/ui/alert-dialog.tsx index 7530cae54d6..82a25bf8f70 100644 --- a/webview-ui/src/components/ui/alert-dialog.tsx +++ b/webview-ui/src/components/ui/alert-dialog.tsx @@ -4,94 +4,97 @@ import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog" import { cn } from "@/lib/utils" import { buttonVariants } from "@/components/ui/button" -const AlertDialog = AlertDialogPrimitive.Root - -const AlertDialogTrigger = AlertDialogPrimitive.Trigger +function AlertDialog({ ...props }: React.ComponentProps) { + return +} -const AlertDialogPortal = AlertDialogPrimitive.Portal +function AlertDialogTrigger({ ...props }: React.ComponentProps) { + return +} -const AlertDialogOverlay = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)) -AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName +function AlertDialogPortal({ ...props }: React.ComponentProps) { + return +} -const AlertDialogContent = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - - - ) { + return ( + - -)) -AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName + ) +} -const AlertDialogHeader = ({ className, ...props }: React.HTMLAttributes) => ( -
-) -AlertDialogHeader.displayName = "AlertDialogHeader" +function AlertDialogContent({ className, ...props }: React.ComponentProps) { + return ( + + + + + ) +} -const AlertDialogFooter = ({ className, ...props }: React.HTMLAttributes) => ( -
-) -AlertDialogFooter.displayName = "AlertDialogFooter" +function AlertDialogHeader({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} -const AlertDialogTitle = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)) -AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName +function AlertDialogFooter({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} + +function AlertDialogTitle({ className, ...props }: React.ComponentProps) { + return ( + + ) +} -const AlertDialogDescription = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)) -AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName +function AlertDialogDescription({ + className, + ...props +}: React.ComponentProps) { + return ( + + ) +} -const AlertDialogAction = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)) -AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName +function AlertDialogAction({ className, ...props }: React.ComponentProps) { + return +} -const AlertDialogCancel = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)) -AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName +function AlertDialogCancel({ className, ...props }: React.ComponentProps) { + return +} export { AlertDialog, diff --git a/webview-ui/src/components/ui/combobox-primitive.tsx b/webview-ui/src/components/ui/combobox-primitive.tsx new file mode 100644 index 00000000000..13bad87abac --- /dev/null +++ b/webview-ui/src/components/ui/combobox-primitive.tsx @@ -0,0 +1,522 @@ +/* eslint-disable react/jsx-pascal-case */ +"use client" + +import * as React from "react" +import { composeEventHandlers } from "@radix-ui/primitive" +import { useComposedRefs } from "@radix-ui/react-compose-refs" +import * as PopoverPrimitive from "@radix-ui/react-popover" +import { Primitive } from "@radix-ui/react-primitive" +import * as RovingFocusGroupPrimitive from "@radix-ui/react-roving-focus" +import { useControllableState } from "@radix-ui/react-use-controllable-state" +import { Command as CommandPrimitive } from "cmdk" + +export type ComboboxContextProps = { + inputValue: string + onInputValueChange: (inputValue: string, reason: "inputChange" | "itemSelect" | "clearClick") => void + onInputBlur?: (e: React.FocusEvent) => void + open: boolean + onOpenChange: (open: boolean) => void + currentTabStopId: string | null + onCurrentTabStopIdChange: (currentTabStopId: string | null) => void + inputRef: React.RefObject + tagGroupRef: React.RefObject> + disabled?: boolean + required?: boolean +} & ( + | Required> + | Required> +) + +const ComboboxContext = React.createContext({ + type: "single", + value: "", + onValueChange: () => {}, + inputValue: "", + onInputValueChange: () => {}, + onInputBlur: () => {}, + open: false, + onOpenChange: () => {}, + currentTabStopId: null, + onCurrentTabStopIdChange: () => {}, + inputRef: { current: null }, + tagGroupRef: { current: null }, + disabled: false, + required: false, +}) + +export const useComboboxContext = () => React.useContext(ComboboxContext) + +export type ComboboxType = "single" | "multiple" + +export interface ComboboxBaseProps + extends React.ComponentProps, + Omit, "value" | "defaultValue" | "onValueChange"> { + type?: ComboboxType | undefined + inputValue?: string + defaultInputValue?: string + onInputValueChange?: (inputValue: string, reason: "inputChange" | "itemSelect" | "clearClick") => void + onInputBlur?: (e: React.FocusEvent) => void + disabled?: boolean + required?: boolean +} + +export type ComboboxValue = T extends "single" + ? string + : T extends "multiple" + ? string[] + : never + +export interface ComboboxSingleProps { + type: "single" + value?: string + defaultValue?: string + onValueChange?: (value: string) => void +} + +export interface ComboboxMultipleProps { + type: "multiple" + value?: string[] + defaultValue?: string[] + onValueChange?: (value: string[]) => void +} + +export type ComboboxProps = ComboboxBaseProps & (ComboboxSingleProps | ComboboxMultipleProps) + +export const Combobox = React.forwardRef( + ( + { + type = "single" as T, + open: openProp, + onOpenChange, + defaultOpen, + modal, + children, + value: valueProp, + defaultValue, + onValueChange, + inputValue: inputValueProp, + defaultInputValue, + onInputValueChange, + onInputBlur, + disabled, + required, + ...props + }: ComboboxProps, + ref: React.ForwardedRef>, + ) => { + const [value = type === "multiple" ? [] : "", setValue] = useControllableState>({ + prop: valueProp as ComboboxValue, + defaultProp: defaultValue as ComboboxValue, + onChange: onValueChange as (value: ComboboxValue) => void, + }) + const [inputValue = "", setInputValue] = useControllableState({ + prop: inputValueProp, + defaultProp: defaultInputValue, + }) + const [open = false, setOpen] = useControllableState({ + prop: openProp, + defaultProp: defaultOpen, + onChange: onOpenChange, + }) + const [currentTabStopId, setCurrentTabStopId] = React.useState(null) + const inputRef = React.useRef(null) + const tagGroupRef = React.useRef>(null) + + const handleInputValueChange: ComboboxContextProps["onInputValueChange"] = React.useCallback( + (inputValue, reason) => { + setInputValue(inputValue) + onInputValueChange?.(inputValue, reason) + }, + [setInputValue, onInputValueChange], + ) + + return ( + + + + {children} + {!open && + + + ) + }, +) +Combobox.displayName = "Combobox" + +export const ComboboxTagGroup = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>((props, ref) => { + const { currentTabStopId, onCurrentTabStopIdChange, tagGroupRef, type } = useComboboxContext() + + if (type !== "multiple") { + throw new Error(' should only be used when type is "multiple"') + } + + const composedRefs = useComposedRefs(ref, tagGroupRef) + + return ( + onCurrentTabStopIdChange(null)} + {...props} + /> + ) +}) +ComboboxTagGroup.displayName = "ComboboxTagGroup" + +export interface ComboboxTagGroupItemProps + extends React.ComponentPropsWithoutRef { + value: string + disabled?: boolean +} + +const ComboboxTagGroupItemContext = React.createContext>({ + value: "", + disabled: false, +}) + +const useComboboxTagGroupItemContext = () => React.useContext(ComboboxTagGroupItemContext) + +export const ComboboxTagGroupItem = React.forwardRef< + React.ElementRef, + ComboboxTagGroupItemProps +>(({ onClick, onKeyDown, value: valueProp, disabled, ...props }, ref) => { + const { value, onValueChange, inputRef, currentTabStopId, type } = useComboboxContext() + + if (type !== "multiple") { + throw new Error(' should only be used when type is "multiple"') + } + + const lastItemValue = value.at(-1) + + return ( + + { + if (event.key === "Escape") { + inputRef.current?.focus() + } + if (event.key === "ArrowUp" || event.key === "ArrowDown") { + event.preventDefault() + inputRef.current?.focus() + } + if (event.key === "ArrowRight" && currentTabStopId === lastItemValue) { + inputRef.current?.focus() + } + if (event.key === "Backspace" || event.key === "Delete") { + onValueChange(value.filter((v) => v !== currentTabStopId)) + inputRef.current?.focus() + } + })} + onClick={composeEventHandlers(onClick, () => disabled && inputRef.current?.focus())} + tabStopId={valueProp} + focusable={!disabled} + data-disabled={disabled} + active={valueProp === lastItemValue} + {...props} + /> + + ) +}) +ComboboxTagGroupItem.displayName = "ComboboxTagGroupItem" + +export const ComboboxTagGroupItemRemove = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ onClick, ...props }, ref) => { + const { value, onValueChange, type } = useComboboxContext() + + if (type !== "multiple") { + throw new Error(' should only be used when type is "multiple"') + } + + const { value: valueProp, disabled } = useComboboxTagGroupItemContext() + + return ( + onValueChange(value.filter((v) => v !== valueProp)))} + {...props} + /> + ) +}) +ComboboxTagGroupItemRemove.displayName = "ComboboxTagGroupItemRemove" + +export const ComboboxInput = React.forwardRef< + React.ElementRef, + Omit, "value" | "onValueChange"> +>(({ onKeyDown, onMouseDown, onFocus, onBlur, ...props }, ref) => { + const { + type, + inputValue, + onInputValueChange, + onInputBlur, + open, + onOpenChange, + value, + onValueChange, + inputRef, + disabled, + required, + tagGroupRef, + } = useComboboxContext() + + const composedRefs = useComposedRefs(ref, inputRef) + + return ( + { + if (!open) { + onOpenChange(true) + } + // Schedule input value change to the next tick. + setTimeout(() => onInputValueChange(search, "inputChange")) + if (!search && type === "single") { + onValueChange("") + } + }} + onKeyDown={composeEventHandlers(onKeyDown, (event) => { + if (event.key === "ArrowUp" || event.key === "ArrowDown") { + if (!open) { + event.preventDefault() + onOpenChange(true) + } + } + if (type !== "multiple") { + return + } + if (event.key === "ArrowLeft" && !inputValue && value.length) { + tagGroupRef.current?.focus() + } + if (event.key === "Backspace" && !inputValue) { + onValueChange(value.slice(0, -1)) + } + })} + onMouseDown={composeEventHandlers(onMouseDown, () => onOpenChange(!!inputValue || !open))} + onFocus={composeEventHandlers(onFocus, () => onOpenChange(true))} + onBlur={composeEventHandlers(onBlur, (event) => { + if (!event.relatedTarget?.hasAttribute("cmdk-list")) { + onInputBlur?.(event) + } + })} + {...props} + /> + ) +}) +ComboboxInput.displayName = "ComboboxInput" + +export const ComboboxClear = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ onClick, ...props }, ref) => { + const { value, onValueChange, inputValue, onInputValueChange, type } = useComboboxContext() + + const isValueEmpty = type === "single" ? !value : !value.length + + return ( + { + if (type === "single") { + onValueChange("") + } else { + onValueChange([]) + } + onInputValueChange("", "clearClick") + })} + {...props} + /> + ) +}) +ComboboxClear.displayName = "ComboboxClear" + +export const ComboboxTrigger = PopoverPrimitive.Trigger + +export const ComboboxAnchor = PopoverPrimitive.Anchor + +export const ComboboxPortal = PopoverPrimitive.Portal + +export const ComboboxContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ children, onOpenAutoFocus, onInteractOutside, ...props }, ref) => ( + event.preventDefault())} + onCloseAutoFocus={composeEventHandlers(onOpenAutoFocus, (event) => event.preventDefault())} + onInteractOutside={composeEventHandlers(onInteractOutside, (event) => { + if (event.target instanceof Element && event.target.hasAttribute("cmdk-input")) { + event.preventDefault() + } + })} + {...props}> + {children} + +)) +ComboboxContent.displayName = "ComboboxContent" + +export const ComboboxEmpty = CommandPrimitive.Empty + +export const ComboboxLoading = CommandPrimitive.Loading + +export interface ComboboxItemProps extends Omit, "value"> { + value: string +} + +const ComboboxItemContext = React.createContext({ isSelected: false }) + +const useComboboxItemContext = () => React.useContext(ComboboxItemContext) + +const findComboboxItemText = (children: React.ReactNode) => { + let text = "" + + React.Children.forEach(children, (child) => { + if (text) { + return + } + + if (React.isValidElement<{ children: React.ReactNode }>(child)) { + if (child.type === ComboboxItemText) { + text = child.props.children as string + } else { + text = findComboboxItemText(child.props.children) + } + } + }) + + return text +} + +export const ComboboxItem = React.forwardRef, ComboboxItemProps>( + ({ value: valueProp, children, onMouseDown, ...props }, ref) => { + const { type, value, onValueChange, onInputValueChange, onOpenChange } = useComboboxContext() + + const inputValue = React.useMemo(() => findComboboxItemText(children), [children]) + + const isSelected = type === "single" ? value === valueProp : value.includes(valueProp) + + return ( + + event.preventDefault())} + onSelect={() => { + if (type === "multiple") { + onValueChange( + value.includes(valueProp) + ? value.filter((v) => v !== valueProp) + : [...value, valueProp], + ) + onInputValueChange("", "itemSelect") + } else { + onValueChange(valueProp) + onInputValueChange(inputValue, "itemSelect") + // Schedule open change to the next tick. + setTimeout(() => onOpenChange(false)) + } + }} + value={inputValue} + {...props}> + {children} + + + ) + }, +) +ComboboxItem.displayName = "ComboboxItem" + +export const ComboboxItemIndicator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>((props, ref) => { + const { isSelected } = useComboboxItemContext() + + if (!isSelected) { + return null + } + + return +}) +ComboboxItemIndicator.displayName = "ComboboxItemIndicator" + +export interface ComboboxItemTextProps extends React.ComponentPropsWithoutRef { + children: string +} + +export const ComboboxItemText = (props: ComboboxItemTextProps) => +ComboboxItemText.displayName = "ComboboxItemText" + +export const ComboboxGroup = CommandPrimitive.Group + +export const ComboboxSeparator = CommandPrimitive.Separator + +const Root = Combobox +const TagGroup = ComboboxTagGroup +const TagGroupItem = ComboboxTagGroupItem +const TagGroupItemRemove = ComboboxTagGroupItemRemove +const Input = ComboboxInput +const Clear = ComboboxClear +const Trigger = ComboboxTrigger +const Anchor = ComboboxAnchor +const Portal = ComboboxPortal +const Content = ComboboxContent +const Empty = ComboboxEmpty +const Loading = ComboboxLoading +const Item = ComboboxItem +const ItemIndicator = ComboboxItemIndicator +const ItemText = ComboboxItemText +const Group = ComboboxGroup +const Separator = ComboboxSeparator + +export { + Root, + TagGroup, + TagGroupItem, + TagGroupItemRemove, + Input, + Clear, + Trigger, + Anchor, + Portal, + Content, + Empty, + Loading, + Item, + ItemIndicator, + ItemText, + Group, + Separator, +} diff --git a/webview-ui/src/components/ui/combobox.tsx b/webview-ui/src/components/ui/combobox.tsx new file mode 100644 index 00000000000..24b2f7be1f3 --- /dev/null +++ b/webview-ui/src/components/ui/combobox.tsx @@ -0,0 +1,177 @@ +"use client" + +import * as React from "react" +import { Slottable } from "@radix-ui/react-slot" +import { cva } from "class-variance-authority" +import { Check, ChevronsUpDown, Loader, X } from "lucide-react" + +import { cn } from "@/lib/utils" +import * as ComboboxPrimitive from "@/components/ui/combobox-primitive" +import { badgeVariants } from "@/components/ui/badge" +// import * as ComboboxPrimitive from "@/registry/default/ui/combobox-primitive" +import { + InputBase, + InputBaseAdornmentButton, + InputBaseControl, + InputBaseFlexWrapper, + InputBaseInput, +} from "@/components/ui/input-base" + +export const Combobox = ComboboxPrimitive.Root + +const ComboboxInputBase = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ children, ...props }, ref) => ( + + + {children} + + + + + + + + + + + + +)) +ComboboxInputBase.displayName = "ComboboxInputBase" + +export const ComboboxInput = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>((props, ref) => ( + + + + + + + +)) +ComboboxInput.displayName = "ComboboxInput" + +export const ComboboxTagsInput = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ children, ...props }, ref) => ( + + + + {children} + + + + + + + + +)) +ComboboxTagsInput.displayName = "ComboboxTagsInput" + +export const ComboboxTag = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ children, className, ...props }, ref) => ( + + {children} + + + Remove + + +)) +ComboboxTag.displayName = "ComboboxTag" + +export const ComboboxContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, align = "start", alignOffset = 0, ...props }, ref) => ( + + + +)) +ComboboxContent.displayName = "ComboboxContent" + +export const ComboboxEmpty = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +ComboboxEmpty.displayName = "ComboboxEmpty" + +export const ComboboxLoading = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)) +ComboboxLoading.displayName = "ComboboxLoading" + +export const ComboboxGroup = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +ComboboxGroup.displayName = "ComboboxGroup" + +const ComboboxSeparator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +ComboboxSeparator.displayName = "ComboboxSeparator" + +export const comboboxItemStyle = cva( + "relative flex w-full cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-vscode-dropdown-foreground data-[disabled=true]:opacity-50", +) + +export const ComboboxItem = React.forwardRef< + React.ElementRef, + Omit, "children"> & + Pick, "children"> +>(({ className, children, ...props }, ref) => ( + + {children} + + + + +)) +ComboboxItem.displayName = "ComboboxItem" diff --git a/webview-ui/src/components/ui/dialog.tsx b/webview-ui/src/components/ui/dialog.tsx index 11d5e2d3b0c..ed3160f692a 100644 --- a/webview-ui/src/components/ui/dialog.tsx +++ b/webview-ui/src/components/ui/dialog.tsx @@ -1,96 +1,108 @@ -"use client" - import * as React from "react" import * as DialogPrimitive from "@radix-ui/react-dialog" -import { Cross2Icon } from "@radix-ui/react-icons" +import { XIcon } from "lucide-react" import { cn } from "@/lib/utils" -const Dialog = DialogPrimitive.Root - -const DialogTrigger = DialogPrimitive.Trigger +function Dialog({ ...props }: React.ComponentProps) { + return +} -const DialogPortal = DialogPrimitive.Portal +function DialogTrigger({ ...props }: React.ComponentProps) { + return +} -const DialogClose = DialogPrimitive.Close +function DialogPortal({ ...props }: React.ComponentProps) { + return +} -const DialogOverlay = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)) -DialogOverlay.displayName = DialogPrimitive.Overlay.displayName +function DialogClose({ ...props }: React.ComponentProps) { + return +} -const DialogContent = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, children, ...props }, ref) => ( - - - ) { + return ( + - {children} - - - Close - - - -)) -DialogContent.displayName = DialogPrimitive.Content.displayName + {...props} + /> + ) +} -const DialogHeader = ({ className, ...props }: React.HTMLAttributes) => ( -
-) -DialogHeader.displayName = "DialogHeader" +function DialogContent({ className, children, ...props }: React.ComponentProps) { + return ( + + + + {children} + + + Close + + + + ) +} -const DialogFooter = ({ className, ...props }: React.HTMLAttributes) => ( -
-) -DialogFooter.displayName = "DialogFooter" +function DialogHeader({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} -const DialogTitle = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)) -DialogTitle.displayName = DialogPrimitive.Title.displayName +function DialogFooter({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} -const DialogDescription = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)) -DialogDescription.displayName = DialogPrimitive.Description.displayName +function DialogTitle({ className, ...props }: React.ComponentProps) { + return ( + + ) +} + +function DialogDescription({ className, ...props }: React.ComponentProps) { + return ( + + ) +} export { Dialog, - DialogPortal, - DialogOverlay, - DialogTrigger, DialogClose, DialogContent, - DialogHeader, + DialogDescription, DialogFooter, + DialogHeader, + DialogOverlay, + DialogPortal, DialogTitle, - DialogDescription, + DialogTrigger, } diff --git a/webview-ui/src/components/ui/index.ts b/webview-ui/src/components/ui/index.ts index bf00aa64425..6eb8dd25ba9 100644 --- a/webview-ui/src/components/ui/index.ts +++ b/webview-ui/src/components/ui/index.ts @@ -1,3 +1,4 @@ +export * from "./alert-dialog" export * from "./autosize-textarea" export * from "./badge" export * from "./button" diff --git a/webview-ui/src/components/ui/input-base.tsx b/webview-ui/src/components/ui/input-base.tsx new file mode 100644 index 00000000000..9dbda6eb138 --- /dev/null +++ b/webview-ui/src/components/ui/input-base.tsx @@ -0,0 +1,157 @@ +/* eslint-disable react/jsx-no-comment-textnodes */ +/* eslint-disable react/jsx-pascal-case */ +"use client" + +import * as React from "react" +import { composeEventHandlers } from "@radix-ui/primitive" +import { composeRefs } from "@radix-ui/react-compose-refs" +import { Primitive } from "@radix-ui/react-primitive" +import { Slot } from "@radix-ui/react-slot" + +import { cn } from "@/lib/utils" +import { Button } from "./button" + +export type InputBaseContextProps = Pick & { + controlRef: React.RefObject + onFocusedChange: (focused: boolean) => void +} + +const InputBaseContext = React.createContext({ + autoFocus: false, + controlRef: { current: null }, + disabled: false, + onFocusedChange: () => {}, +}) + +const useInputBaseContext = () => React.useContext(InputBaseContext) + +export interface InputBaseProps extends React.ComponentPropsWithoutRef { + autoFocus?: boolean + disabled?: boolean +} + +export const InputBase = React.forwardRef, InputBaseProps>( + ({ autoFocus, disabled, className, onClick, ...props }, ref) => { + // eslint-disable-next-line @typescript-eslint/no-unused-vars + const [focused, setFocused] = React.useState(false) + + const controlRef = React.useRef(null) + + return ( + + { + // Based on MUI's implementation. + // https://github.com/mui/material-ui/blob/master/packages/mui-material/src/InputBase/InputBase.js#L458~L460 + if (controlRef.current && event.currentTarget === event.target) { + controlRef.current.focus() + } + })} + className={cn( + "flex w-full text-vscode-input-foreground border border-vscode-dropdown-border bg-vscode-input-background rounded-xs px-3 py-0.5 text-base transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus:outline-0 focus-visible:outline-none focus-visible:border-vscode-focusBorder disabled:cursor-not-allowed disabled:opacity-50", + disabled && "cursor-not-allowed opacity-50", + className, + )} + {...props} + /> + + ) + }, +) +InputBase.displayName = "InputBase" + +export const InputBaseFlexWrapper = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +InputBaseFlexWrapper.displayName = "InputBaseFlexWrapper" + +export const InputBaseControl = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ onFocus, onBlur, ...props }, ref) => { + const { controlRef, autoFocus, disabled, onFocusedChange } = useInputBaseContext() + + return ( + onFocusedChange(true))} + onBlur={composeEventHandlers(onBlur, () => onFocusedChange(false))} + {...{ disabled }} + {...props} + /> + ) +}) +InputBaseControl.displayName = "InputBaseControl" + +export interface InputBaseAdornmentProps extends React.ComponentPropsWithoutRef<"div"> { + asChild?: boolean + disablePointerEvents?: boolean +} + +export const InputBaseAdornment = React.forwardRef, InputBaseAdornmentProps>( + ({ className, disablePointerEvents, asChild, children, ...props }, ref) => { + const Comp = asChild ? Slot : typeof children === "string" ? "p" : "div" + + const isAction = React.isValidElement(children) && children.type === InputBaseAdornmentButton + + return ( + + {children} + + ) + }, +) +InputBaseAdornment.displayName = "InputBaseAdornment" + +export const InputBaseAdornmentButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ type = "button", variant = "ghost", size = "icon", disabled: disabledProp, className, ...props }, ref) => { + const { disabled } = useInputBaseContext() + + return ( +
diff --git a/webview-ui/src/context/ExtensionStateContext.tsx b/webview-ui/src/context/ExtensionStateContext.tsx index 3dca8d5f51c..ae5c5b95398 100644 --- a/webview-ui/src/context/ExtensionStateContext.tsx +++ b/webview-ui/src/context/ExtensionStateContext.tsx @@ -1,18 +1,7 @@ import React, { createContext, useCallback, useContext, useEffect, useState } from "react" import { useEvent } from "react-use" import { ApiConfigMeta, ExtensionMessage, ExtensionState } from "../../../src/shared/ExtensionMessage" -import { - ApiConfiguration, - ModelInfo, - glamaDefaultModelId, - glamaDefaultModelInfo, - openRouterDefaultModelId, - openRouterDefaultModelInfo, - unboundDefaultModelId, - unboundDefaultModelInfo, - requestyDefaultModelId, - requestyDefaultModelInfo, -} from "../../../src/shared/api" +import { ApiConfiguration } from "../../../src/shared/api" import { vscode } from "../utils/vscode" import { convertTextMateToHljs } from "../utils/textMateToHljs" import { findLastIndex } from "../../../src/shared/array" @@ -26,11 +15,6 @@ export interface ExtensionStateContextType extends ExtensionState { didHydrateState: boolean showWelcome: boolean theme: any - glamaModels: Record - requestyModels: Record - openRouterModels: Record - unboundModels: Record - openAiModels: string[] mcpServers: McpServer[] currentCheckpoint?: string filePaths: string[] @@ -70,7 +54,6 @@ export interface ExtensionStateContextType extends ExtensionState { setRateLimitSeconds: (value: number) => void setCurrentApiConfigName: (value: string) => void setListApiConfigMeta: (value: ApiConfigMeta[]) => void - onUpdateApiConfig: (apiConfig: ApiConfiguration) => void mode: Mode setMode: (value: Mode) => void setCustomModePrompts: (value: CustomModePrompts) => void @@ -118,27 +101,15 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode autoApprovalEnabled: false, customModes: [], maxOpenTabsContext: 20, + cwd: "", }) const [didHydrateState, setDidHydrateState] = useState(false) const [showWelcome, setShowWelcome] = useState(false) const [theme, setTheme] = useState(undefined) const [filePaths, setFilePaths] = useState([]) - const [glamaModels, setGlamaModels] = useState>({ - [glamaDefaultModelId]: glamaDefaultModelInfo, - }) const [openedTabs, setOpenedTabs] = useState>([]) - const [openRouterModels, setOpenRouterModels] = useState>({ - [openRouterDefaultModelId]: openRouterDefaultModelInfo, - }) - const [unboundModels, setUnboundModels] = useState>({ - [unboundDefaultModelId]: unboundDefaultModelInfo, - }) - const [requestyModels, setRequestyModels] = useState>({ - [requestyDefaultModelId]: requestyDefaultModelInfo, - }) - const [openAiModels, setOpenAiModels] = useState([]) const [mcpServers, setMcpServers] = useState([]) const [currentCheckpoint, setCurrentCheckpoint] = useState() @@ -146,18 +117,6 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode (value: ApiConfigMeta[]) => setState((prevState) => ({ ...prevState, listApiConfigMeta: value })), [], ) - - const onUpdateApiConfig = useCallback((apiConfig: ApiConfiguration) => { - setState((currentState) => { - vscode.postMessage({ - type: "upsertApiConfiguration", - text: currentState.currentApiConfigName, - apiConfiguration: { ...currentState.apiConfiguration, ...apiConfig }, - }) - return currentState // No state update needed - }) - }, []) - const handleMessage = useCallback( (event: MessageEvent) => { const message: ExtensionMessage = event.data @@ -202,40 +161,6 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode }) break } - case "glamaModels": { - const updatedModels = message.glamaModels ?? {} - setGlamaModels({ - [glamaDefaultModelId]: glamaDefaultModelInfo, // in case the extension sent a model list without the default model - ...updatedModels, - }) - break - } - case "openRouterModels": { - const updatedModels = message.openRouterModels ?? {} - setOpenRouterModels({ - [openRouterDefaultModelId]: openRouterDefaultModelInfo, // in case the extension sent a model list without the default model - ...updatedModels, - }) - break - } - case "openAiModels": { - const updatedModels = message.openAiModels ?? [] - setOpenAiModels(updatedModels) - break - } - case "unboundModels": { - const updatedModels = message.unboundModels ?? {} - setUnboundModels(updatedModels) - break - } - case "requestyModels": { - const updatedModels = message.requestyModels ?? {} - setRequestyModels({ - [requestyDefaultModelId]: requestyDefaultModelInfo, // in case the extension sent a model list without the default model - ...updatedModels, - }) - break - } case "mcpServers": { setMcpServers(message.mcpServers ?? []) break @@ -264,11 +189,6 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode didHydrateState, showWelcome, theme, - glamaModels, - requestyModels, - openRouterModels, - openAiModels, - unboundModels, mcpServers, currentCheckpoint, filePaths, @@ -316,7 +236,6 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode setRateLimitSeconds: (value) => setState((prevState) => ({ ...prevState, rateLimitSeconds: value })), setCurrentApiConfigName: (value) => setState((prevState) => ({ ...prevState, currentApiConfigName: value })), setListApiConfigMeta, - onUpdateApiConfig, setMode: (value: Mode) => setState((prevState) => ({ ...prevState, mode: value })), setCustomModePrompts: (value) => setState((prevState) => ({ ...prevState, customModePrompts: value })), setCustomSupportPrompts: (value) => setState((prevState) => ({ ...prevState, customSupportPrompts: value })), diff --git a/webview-ui/src/utils/__tests__/path-mentions.test.ts b/webview-ui/src/utils/__tests__/path-mentions.test.ts new file mode 100644 index 00000000000..bb5591fbe54 --- /dev/null +++ b/webview-ui/src/utils/__tests__/path-mentions.test.ts @@ -0,0 +1,45 @@ +import { convertToMentionPath } from "../path-mentions" + +describe("path-mentions", () => { + describe("convertToMentionPath", () => { + it("should convert an absolute path to a mention path when it starts with cwd", () => { + // Windows-style paths + expect(convertToMentionPath("C:\\Users\\user\\project\\file.txt", "C:\\Users\\user\\project")).toBe( + "@/file.txt", + ) + + // Unix-style paths + expect(convertToMentionPath("/Users/user/project/file.txt", "/Users/user/project")).toBe("@/file.txt") + }) + + it("should handle paths with trailing slashes in cwd", () => { + expect(convertToMentionPath("/Users/user/project/file.txt", "/Users/user/project/")).toBe("@/file.txt") + }) + + it("should be case-insensitive when matching paths", () => { + expect(convertToMentionPath("/Users/User/Project/file.txt", "/users/user/project")).toBe("@/file.txt") + }) + + it("should return the original path when cwd is not provided", () => { + expect(convertToMentionPath("/Users/user/project/file.txt")).toBe("/Users/user/project/file.txt") + }) + + it("should return the original path when it does not start with cwd", () => { + expect(convertToMentionPath("/Users/other/project/file.txt", "/Users/user/project")).toBe( + "/Users/other/project/file.txt", + ) + }) + + it("should normalize backslashes to forward slashes", () => { + expect(convertToMentionPath("C:\\Users\\user\\project\\subdir\\file.txt", "C:\\Users\\user\\project")).toBe( + "@/subdir/file.txt", + ) + }) + + it("should handle nested paths correctly", () => { + expect(convertToMentionPath("/Users/user/project/nested/deeply/file.txt", "/Users/user/project")).toBe( + "@/nested/deeply/file.txt", + ) + }) + }) +}) diff --git a/webview-ui/src/utils/path-mentions.ts b/webview-ui/src/utils/path-mentions.ts new file mode 100644 index 00000000000..960483f5934 --- /dev/null +++ b/webview-ui/src/utils/path-mentions.ts @@ -0,0 +1,38 @@ +/** + * Utilities for handling path-related operations in mentions + */ + +/** + * Converts an absolute path to a mention-friendly path + * If the provided path starts with the current working directory, + * it's converted to a relative path prefixed with @ + * + * @param path The path to convert + * @param cwd The current working directory + * @returns A mention-friendly path + */ +export function convertToMentionPath(path: string, cwd?: string): string { + const normalizedPath = path.replace(/\\/g, "/") + let normalizedCwd = cwd ? cwd.replace(/\\/g, "/") : "" + + if (!normalizedCwd) { + return path + } + + // Remove trailing slash from cwd if it exists + if (normalizedCwd.endsWith("/")) { + normalizedCwd = normalizedCwd.slice(0, -1) + } + + // Always use case-insensitive comparison for path matching + const lowerPath = normalizedPath.toLowerCase() + const lowerCwd = normalizedCwd.toLowerCase() + + if (lowerPath.startsWith(lowerCwd)) { + const relativePath = normalizedPath.substring(normalizedCwd.length) + // Ensure there's a slash after the @ symbol when we create the mention path + return "@" + (relativePath.startsWith("/") ? relativePath : "/" + relativePath) + } + + return path +} diff --git a/webview-ui/src/utils/validate.ts b/webview-ui/src/utils/validate.ts index 19b13e2c6c2..82af23ab497 100644 --- a/webview-ui/src/utils/validate.ts +++ b/webview-ui/src/utils/validate.ts @@ -1,79 +1,83 @@ -import { - ApiConfiguration, - glamaDefaultModelId, - openRouterDefaultModelId, - unboundDefaultModelId, -} from "../../../src/shared/api" -import { ModelInfo } from "../../../src/shared/api" +import { ApiConfiguration, ModelInfo } from "../../../src/shared/api" + export function validateApiConfiguration(apiConfiguration?: ApiConfiguration): string | undefined { - if (apiConfiguration) { - switch (apiConfiguration.apiProvider) { - case "anthropic": - if (!apiConfiguration.apiKey) { - return "You must provide a valid API key or choose a different provider." - } - break - case "glama": - if (!apiConfiguration.glamaApiKey) { - return "You must provide a valid API key or choose a different provider." - } - break - case "bedrock": - if (!apiConfiguration.awsRegion) { - return "You must choose a region to use with AWS Bedrock." - } - break - case "openrouter": - if (!apiConfiguration.openRouterApiKey) { - return "You must provide a valid API key or choose a different provider." - } - break - case "vertex": - if (!apiConfiguration.vertexProjectId || !apiConfiguration.vertexRegion) { - return "You must provide a valid Google Cloud Project ID and Region." - } - break - case "gemini": - if (!apiConfiguration.geminiApiKey) { - return "You must provide a valid API key or choose a different provider." - } - break - case "openai-native": - if (!apiConfiguration.openAiNativeApiKey) { - return "You must provide a valid API key or choose a different provider." - } - break - case "mistral": - if (!apiConfiguration.mistralApiKey) { - return "You must provide a valid API key or choose a different provider." - } - break - case "openai": - if ( - !apiConfiguration.openAiBaseUrl || - !apiConfiguration.openAiApiKey || - !apiConfiguration.openAiModelId - ) { - return "You must provide a valid base URL, API key, and model ID." - } - break - case "ollama": - if (!apiConfiguration.ollamaModelId) { - return "You must provide a valid model ID." - } - break - case "lmstudio": - if (!apiConfiguration.lmStudioModelId) { - return "You must provide a valid model ID." - } - break - case "vscode-lm": - if (!apiConfiguration.vsCodeLmModelSelector) { - return "You must provide a valid model selector." - } - break - } + if (!apiConfiguration) { + return undefined + } + + switch (apiConfiguration.apiProvider) { + case "openrouter": + if (!apiConfiguration.openRouterApiKey) { + return "You must provide a valid API key." + } + break + case "glama": + if (!apiConfiguration.glamaApiKey) { + return "You must provide a valid API key." + } + break + case "unbound": + if (!apiConfiguration.unboundApiKey) { + return "You must provide a valid API key." + } + break + case "requesty": + if (!apiConfiguration.requestyApiKey) { + return "You must provide a valid API key." + } + break + case "anthropic": + if (!apiConfiguration.apiKey) { + return "You must provide a valid API key." + } + break + case "bedrock": + if (!apiConfiguration.awsRegion) { + return "You must choose a region to use with AWS Bedrock." + } + break + case "vertex": + if (!apiConfiguration.vertexProjectId || !apiConfiguration.vertexRegion) { + return "You must provide a valid Google Cloud Project ID and Region." + } + break + case "gemini": + if (!apiConfiguration.geminiApiKey) { + return "You must provide a valid API key." + } + break + case "openai-native": + if (!apiConfiguration.openAiNativeApiKey) { + return "You must provide a valid API key." + } + break + case "mistral": + if (!apiConfiguration.mistralApiKey) { + return "You must provide a valid API key." + } + break + case "openai": + if (!apiConfiguration.openAiBaseUrl || !apiConfiguration.openAiApiKey || !apiConfiguration.openAiModelId) { + return "You must provide a valid base URL, API key, and model ID." + } + break + case "ollama": + if (!apiConfiguration.ollamaModelId) { + return "You must provide a valid model ID." + } + break + case "lmstudio": + if (!apiConfiguration.lmStudioModelId) { + return "You must provide a valid model ID." + } + break + case "vscode-lm": + if (!apiConfiguration.vsCodeLmModelSelector) { + return "You must provide a valid model selector." + } + break } + return undefined } @@ -82,40 +86,81 @@ export function validateModelId( glamaModels?: Record, openRouterModels?: Record, unboundModels?: Record, + requestyModels?: Record, ): string | undefined { - if (apiConfiguration) { - switch (apiConfiguration.apiProvider) { - case "glama": - const glamaModelId = apiConfiguration.glamaModelId || glamaDefaultModelId // in case the user hasn't changed the model id, it will be undefined by default - if (!glamaModelId) { - return "You must provide a model ID." - } - if (glamaModels && !Object.keys(glamaModels).includes(glamaModelId)) { - // even if the model list endpoint failed, extensionstatecontext will always have the default model info - return "The model ID you provided is not available. Please choose a different model." - } - break - case "openrouter": - const modelId = apiConfiguration.openRouterModelId || openRouterDefaultModelId // in case the user hasn't changed the model id, it will be undefined by default - if (!modelId) { - return "You must provide a model ID." - } - if (openRouterModels && !Object.keys(openRouterModels).includes(modelId)) { - // even if the model list endpoint failed, extensionstatecontext will always have the default model info - return "The model ID you provided is not available. Please choose a different model." - } - break - case "unbound": - const unboundModelId = apiConfiguration.unboundModelId || unboundDefaultModelId - if (!unboundModelId) { - return "You must provide a model ID." - } - if (unboundModels && !Object.keys(unboundModels).includes(unboundModelId)) { - // even if the model list endpoint failed, extensionstatecontext will always have the default model info - return "The model ID you provided is not available. Please choose a different model." - } - break - } + if (!apiConfiguration) { + return undefined + } + + switch (apiConfiguration.apiProvider) { + case "openrouter": + const modelId = apiConfiguration.openRouterModelId + + if (!modelId) { + return "You must provide a model ID." + } + + if ( + openRouterModels && + Object.keys(openRouterModels).length > 1 && + !Object.keys(openRouterModels).includes(modelId) + ) { + return `The model ID (${modelId}) you provided is not available. Please choose a different model.` + } + + break + + case "glama": + const glamaModelId = apiConfiguration.glamaModelId + + if (!glamaModelId) { + return "You must provide a model ID." + } + + if ( + glamaModels && + Object.keys(glamaModels).length > 1 && + !Object.keys(glamaModels).includes(glamaModelId) + ) { + return `The model ID (${glamaModelId}) you provided is not available. Please choose a different model.` + } + + break + + case "unbound": + const unboundModelId = apiConfiguration.unboundModelId + + if (!unboundModelId) { + return "You must provide a model ID." + } + + if ( + unboundModels && + Object.keys(unboundModels).length > 1 && + !Object.keys(unboundModels).includes(unboundModelId) + ) { + return `The model ID (${unboundModelId}) you provided is not available. Please choose a different model.` + } + + break + + case "requesty": + const requestyModelId = apiConfiguration.requestyModelId + + if (!requestyModelId) { + return "You must provide a model ID." + } + + if ( + requestyModels && + Object.keys(requestyModels).length > 1 && + !Object.keys(requestyModels).includes(requestyModelId) + ) { + return `The model ID (${requestyModelId}) you provided is not available. Please choose a different model.` + } + + break } + return undefined }