better styling for the new task tool

docs/tools/cline-tools-guide.md

@@ -81,6 +81,7 @@ Cline has access to the following tools for various tasks:
 4. **Interaction Tools**
     - `ask_followup_question`: Ask user for clarification
     - `attempt_completion`: Present final results
+    - `new_task`: Create a new task with preloaded context
 
 Each tool has specific parameters and usage patterns. Here are some examples:
 
@@ -113,6 +114,21 @@ Each tool has specific parameters and usage patterns. Here are some examples:
     </execute_command>
     ```
 
+-   Create a new task with context (new_task):
+    ```xml
+    <new_task>
+    <context>
+    We've completed the backend API with these endpoints:
+    - GET /api/tasks
+    - POST /api/tasks
+    - PUT /api/tasks/:id
+    - DELETE /api/tasks/:id
+    
+    Now we need to implement the React frontend.
+    </context>
+    </new_task>
+    ```
+
 ## Common Tasks
 
 1. **Create a New Component**

docs/tools/new-task-tool.md

@@ -0,0 +1,88 @@
+# New Task Tool
+
+The `new_task` tool allows Cline to create a new task with preloaded context. This is particularly useful for managing context window limitations and creating focused subtasks.
+
+## Overview
+
+When the context window is approaching capacity or when you want to create a focused subtask, Cline can suggest creating a new task with relevant context preloaded. This helps maintain continuity between tasks while keeping each task focused and efficient.
+
+## How It Works
+
+1. Cline uses the `new_task` tool to suggest creating a new task with specific context
+2. You'll see a preview of the context that will be preloaded into the new task
+3. You can choose to:
+   - Click "Create New Task" to start a new task with the preloaded context in Plan Mode
+   - Respond with a message to continue the current conversation (effectively declining the new task)
+
+## Use Cases
+
+### Context Window Management
+
+As conversations get longer, the context window may approach capacity. Cline can proactively suggest creating a new task with relevant context to continue the work without losing important information.
+
+```
+Cline: I notice our conversation is getting quite long. Would you like me to create a new task with the relevant context to continue our work on the authentication system?
+
+<new_task>
+We've been working on implementing an authentication system for the web application. So far, we've:
+1. Set up the basic user model
+2. Implemented password hashing with bcrypt
+3. Created login and registration endpoints
+
+Next steps:
+- Implement JWT token generation
+- Add token validation middleware
+- Set up refresh token functionality
+</new_task>
+```
+
+### Breaking Down Complex Tasks
+
+For complex projects, you can break down the work into focused subtasks, with each new task containing the relevant context from the previous work.
+
+```
+Cline: Now that we've completed the backend API, let's focus on the frontend implementation. I'll create a new task for this:
+
+<new_task>
+We've completed the backend API for our task management application with the following endpoints:
+- GET /api/tasks - List all tasks
+- POST /api/tasks - Create a new task
+- PUT /api/tasks/:id - Update a task
+- DELETE /api/tasks/:id - Delete a task
+
+Now we need to implement the React frontend that will consume these endpoints.
+</new_task>
+```
+
+### Maintaining Workflow Continuity
+
+When you need to pause work on one aspect of a project and return to it later, Cline can help you create a new task with the necessary context to pick up where you left off.
+
+```
+Cline: Let's save our progress on the database schema design so we can come back to it later:
+
+<new_task>
+Database schema design for e-commerce application:
+- Users table: id, email, password_hash, name, created_at, updated_at
+- Products table: id, name, description, price, inventory_count, category_id
+- Categories table: id, name, parent_category_id
+- Orders table: id, user_id, status, total, created_at, updated_at
+- OrderItems table: id, order_id, product_id, quantity, price
+
+We still need to design:
+- Payment processing tables
+- Shipping information tables
+- Review and rating tables
+</new_task>
+```
+
+## Best Practices
+
+- **Be Selective**: Only include relevant context in the new task to keep it focused
+- **Summarize**: Summarize previous work rather than copying everything verbatim
+- **Include Next Steps**: Clearly indicate what needs to be done in the new task
+- **Maintain Continuity**: Ensure the new task has enough context to continue the work without confusion
+
+## Implementation Details
+
+The `new_task` tool is implemented as part of Cline's tool system. When used, it presents a UI component with a preview of the context and a button to create the new task. The new task is created in Plan Mode, allowing you to review and refine the approach before switching to Act Mode for implementation.

package-lock.json

@@ -1,12 +1,12 @@
 {
 	"name": "claude-dev",
-	"version": "3.8.4",
+	"version": "3.8.5",
 	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "claude-dev",
-			"version": "3.8.4",
+			"version": "3.8.5",
 			"license": "Apache-2.0",
 			"dependencies": {
 				"@anthropic-ai/bedrock-sdk": "^0.12.4",

src/core/assistant-message/index.ts

@@ -22,6 +22,7 @@ export const toolUseNames = [
 	"ask_followup_question",
 	"plan_mode_respond",
 	"attempt_completion",
+	"new_task",
 ] as const
 
 // Converts array of tool call names into a union type ("execute_command" | "read_file" | ...)
@@ -48,6 +49,7 @@ export const toolParamNames = [
 	"options",
 	"response",
 	"result",
+	"context",
 ] as const
 
 export type ToolParamName = (typeof toolParamNames)[number]

src/core/context-management/ContextManager.ts

@@ -1,7 +1,7 @@
 import { Anthropic } from "@anthropic-ai/sdk"
 import { ClineApiReqInfo, ClineMessage } from "../../shared/ExtensionMessage"
 import { ApiHandler } from "../../api"
-import { OpenAiHandler } from "../../api/providers/openai"
+import { getContextWindowInfo } from "./context-window-utils"
 
 export class ContextManager {
 	getNewContextMessagesAndMetadata(
@@ -19,25 +19,7 @@ export class ContextManager {
 			if (previousRequest && previousRequest.text) {
 				const { tokensIn, tokensOut, cacheWrites, cacheReads }: ClineApiReqInfo = JSON.parse(previousRequest.text)
 				const totalTokens = (tokensIn || 0) + (tokensOut || 0) + (cacheWrites || 0) + (cacheReads || 0)
-				let contextWindow = api.getModel().info.contextWindow || 128_000
-				// FIXME: hack to get anyone using openai compatible with deepseek to have the proper context window instead of the default 128k. We need a way for the user to specify the context window for models they input through openai compatible
-				if (api instanceof OpenAiHandler && api.getModel().id.toLowerCase().includes("deepseek")) {
-					contextWindow = 64_000
-				}
-				let maxAllowedSize: number
-				switch (contextWindow) {
-					case 64_000: // deepseek models
-						maxAllowedSize = contextWindow - 27_000
-						break
-					case 128_000: // most models
-						maxAllowedSize = contextWindow - 30_000
-						break
-					case 200_000: // claude models
-						maxAllowedSize = contextWindow - 40_000
-						break
-					default:
-						maxAllowedSize = Math.max(contextWindow - 40_000, contextWindow * 0.8) // for deepseek, 80% of 64k meant only ~10k buffer which was too small and resulted in users getting context window errors.
-				}
+				const { contextWindow, maxAllowedSize } = getContextWindowInfo(api)
 
 				// This is the most reliable way to know when we're close to hitting the context window.
 				if (totalTokens >= maxAllowedSize) {

src/core/context-management/context-window-utils.ts

@@ -0,0 +1,34 @@
+import { ApiHandler } from "../../api"
+import { OpenAiHandler } from "../../api/providers/openai"
+
+/**
+ * Gets context window information for the given API handler
+ *
+ * @param api The API handler to get context window information for
+ * @returns An object containing the raw context window size and the effective max allowed size
+ */
+export function getContextWindowInfo(api: ApiHandler) {
+	let contextWindow = api.getModel().info.contextWindow || 128_000
+
+	// Handle special cases like DeepSeek
+	if (api instanceof OpenAiHandler && api.getModel().id.toLowerCase().includes("deepseek")) {
+		contextWindow = 64_000
+	}
+
+	let maxAllowedSize: number
+	switch (contextWindow) {
+		case 64_000: // deepseek models
+			maxAllowedSize = contextWindow - 27_000
+			break
+		case 128_000: // most models
+			maxAllowedSize = contextWindow - 30_000
+			break
+		case 200_000: // claude models
+			maxAllowedSize = contextWindow - 40_000
+			break
+		default:
+			maxAllowedSize = Math.max(contextWindow - 40_000, contextWindow * 0.8)
+	}
+
+	return { contextWindow, maxAllowedSize }
+}

src/core/prompts/responses.ts

@@ -199,6 +199,9 @@ Otherwise, if you have not completed the task and do not need additional informa
 
 	clineRulesFileInstructions: (cwd: string, content: string) =>
 		`# .clinerules\n\nThe following is provided by a root-level .clinerules file where the user has specified instructions for this working directory (${cwd.toPosix()})\n\n${content}`,
+
+	newTaskContext: (context: string) =>
+		`Cline wants to start a new task with the following context:\n\n${context}\n\nClick "Start New Task" to start a new task with this context preloaded.`,
 }
 
 // to avoid circular dependency

src/core/prompts/system.ts

@@ -239,6 +239,23 @@ Your final result description here
 <command>Command to demonstrate result (optional)</command>
 </attempt_completion>
 
+## new_task
+Description: Request to create a new task with preloaded context. The user will be presented with a preview of the context and can choose to create a new task or keep chatting in the current conversation. 
+IMPORTANT NOTE: When creating a new task you must ALWAYS include context. You may use this tool proactively when the the context window usage is over 50%.
+
+Parameters:
+- context: (required) The context to preload the new task with. This should include:
+  * Comprehensively explain what has been accomplished in the current task - mention specific file names that are relevant
+  * The specific next steps or focus for the new task - mention specific file names that are relevant
+  * Any critical information needed to continue the work
+  * Clear indication of how this new task relates to the overall workflow
+  * This should be akin to a long handoff file, enough for a totally new developer to be able to pick up where you left off and know exactly what to do next and which files to look at.
+
+Usage:
+<new_task>
+<context>context to preload new task with</context>
+</new_task>
+
 ## plan_mode_respond
 Description: Respond to the user's inquiry in an effort to plan a solution to the user's task. This tool should be used when you need to provide a response to a question or statement from the user about how you plan to accomplish the task. This tool is only available in PLAN MODE. The environment_details will specify the current mode, if it is not PLAN MODE then you should not use this tool. Depending on the user's message, you may ask questions to get clarification about the user's request, architect a solution to the task, and to brainstorm ideas with the user. For example, if the user's task is to create a website, you may start by asking some clarifying questions, then present a detailed plan for how you will accomplish the task given the context, and perhaps engage in a back and forth to finalize the details before the user switches you to ACT MODE to implement the solution.
 Parameters:
@@ -283,7 +300,23 @@ Array of options here (optional), e.g. ["Option 1", "Option 2", "Option 3"]
 </content>
 </write_to_file>
 
-## Example 3: Requesting to make targeted edits to a file
+## Example 3: Creating a new task
+
+<new_task>
+Authentication System Implementation:
+- We've implemented the basic user model with email/password
+- Password hashing is working with bcrypt
+- Login endpoint is functional with proper validation
+- JWT token generation is implemented
+
+Next Steps:
+- Implement refresh token functionality
+- Add token validation middleware
+- Create password reset flow
+- Implement role-based access control
+</new_task>
+
+## Example 4: Requesting to make targeted edits to a file
 
 <replace_in_file>
 <path>src/components/App.tsx</path>
@@ -321,7 +354,7 @@ ${
 	mcpHub.getMode() !== "off"
 		? `
 
-## Example 4: Requesting to use an MCP tool
+## Example 5: Requesting to use an MCP tool
 
 <use_mcp_tool>
 <server_name>weather-server</server_name>
@@ -334,14 +367,14 @@ ${
 </arguments>
 </use_mcp_tool>
 
-## Example 5: Requesting to access an MCP resource
+## Example 6: Requesting to access an MCP resource
 
 <access_mcp_resource>
 <server_name>weather-server</server_name>
 <uri>weather://san-francisco/current</uri>
 </access_mcp_resource>
 
-## Example 6: Another example of using an MCP tool (where the server name is a unique identifier such as a URL)
+## Example 7: Another example of using an MCP tool (where the server name is a unique identifier such as a URL)
 
 <use_mcp_tool>
 <server_name>github.com/modelcontextprotocol/servers/tree/main/src/github</server_name>

src/core/task/index.ts

@@ -13,6 +13,7 @@ import { ApiHandler, buildApiHandler } from "../../api"
 import { AnthropicHandler } from "../../api/providers/anthropic"
 import { ClineHandler } from "../../api/providers/cline"
 import { OpenRouterHandler } from "../../api/providers/openrouter"
+import { getContextWindowInfo } from "../context-management/context-window-utils"
 import { ApiStream } from "../../api/transform/stream"
 import { GlobalFileNames } from "../storage/disk"
 import CheckpointTracker from "../../integrations/checkpoints/CheckpointTracker"
@@ -1447,6 +1448,8 @@ export class Task {
 							return `[${block.name}]`
 						case "attempt_completion":
 							return `[${block.name}]`
+						case "new_task":
+							return `[${block.name} for creating a new task]`
 					}
 				}
 
@@ -2678,6 +2681,51 @@ export class Task {
 							break
 						}
 					}
+					case "new_task": {
+						const context: string | undefined = block.params.context
+						try {
+							if (block.partial) {
+								await this.ask("new_task", removeClosingTag("context", context), block.partial).catch(() => {})
+								break
+							} else {
+								if (!context) {
+									this.consecutiveMistakeCount++
+									pushToolResult(await this.sayAndCreateMissingParamError("new_task", "context"))
+									break
+								}
+								this.consecutiveMistakeCount = 0
+
+								if (this.autoApprovalSettings.enabled && this.autoApprovalSettings.enableNotifications) {
+									showSystemNotification({
+										subtitle: "Cline wants to start a new task...",
+										message: "Cline is suggesting to start a new task with preloaded context.",
+									})
+								}
+
+								const { text, images } = await this.ask("new_task", context, false)
+
+								// If the user provided a response, treat it as feedback
+								if (text || images?.length) {
+									await this.say("user_feedback", text ?? "", images)
+									pushToolResult(
+										formatResponse.toolResult(
+											`The user provided feedback instead of creating a new task:\n<feedback>\n${text}\n</feedback>`,
+											images,
+										),
+									)
+								} else {
+									// If no response, the user clicked the "Create New Task" button
+									pushToolResult(
+										formatResponse.toolResult(`The user has created a new task with the provided context.`),
+									)
+								}
+								break
+							}
+						} catch (error) {
+							await handleError("creating new task", error)
+							break
+						}
+					}
 					case "plan_mode_respond": {
 						const response: string | undefined = block.params.response
 						const optionsRaw: string | undefined = block.params.options
@@ -3519,6 +3567,37 @@ export class Task {
 			}
 		}
 
+		// Add context window usage information
+		const { contextWindow, maxAllowedSize } = getContextWindowInfo(this.api)
+
+		// Get the token count from the most recent API request to accurately reflect context management
+		const getTotalTokensFromApiReqMessage = (msg: ClineMessage) => {
+			if (!msg.text) {
+				return 0
+			}
+			try {
+				const { tokensIn, tokensOut, cacheWrites, cacheReads } = JSON.parse(msg.text)
+				return (tokensIn || 0) + (tokensOut || 0) + (cacheWrites || 0) + (cacheReads || 0)
+			} catch (e) {
+				return 0
+			}
+		}
+
+		const modifiedMessages = combineApiRequests(combineCommandSequences(this.clineMessages.slice(1)))
+		const lastApiReqMessage = findLast(modifiedMessages, (msg) => {
+			if (msg.say !== "api_req_started") {
+				return false
+			}
+			return getTotalTokensFromApiReqMessage(msg) > 0
+		})
+
+		const lastApiReqTotalTokens = lastApiReqMessage ? getTotalTokensFromApiReqMessage(lastApiReqMessage) : 0
+		const usagePercentage = Math.round((lastApiReqTotalTokens / contextWindow) * 100)
+
+		details += "\n\n# Context Window Usage"
+		details += `\n${lastApiReqTotalTokens.toLocaleString()} / ${contextWindow.toLocaleString()} tokens (${usagePercentage}%)`
+		details += `\nModel: ${this.api.getModel().id} (${(contextWindow / 1000).toLocaleString()}K context window)`
+
 		details += "\n\n# Current Mode"
 		if (this.chatSettings.mode === "plan") {
 			details += "\nPLAN MODE\n" + formatResponse.planModeInstructions()

src/shared/ExtensionMessage.ts

@@ -142,6 +142,7 @@ export type ClineAsk =
 	| "auto_approval_max_req_reached"
 	| "browser_action_launch"
 	| "use_mcp_server"
+	| "new_task"
 
 export type ClineSay =
 	| "task"
@@ -222,6 +223,10 @@ export interface ClineAskQuestion {
 	selected?: string
 }
 
+export interface ClineAskNewTask {
+	context: string
+}
+
 export interface ClineApiReqInfo {
 	request?: string
 	tokensIn?: number

src/test/new-task-tool.test.ts

@@ -0,0 +1,28 @@
+import * as assert from "assert"
+import * as vscode from "vscode"
+import { ClineMessage } from "../shared/ExtensionMessage"
+import { formatResponse } from "../core/prompts/responses"
+
+suite("New Task Tool Tests", () => {
+	test("formatResponse.newTaskContext formats context correctly", () => {
+		const context = "This is a test context for a new task"
+		const result = formatResponse.newTaskContext(context)
+
+		assert.strictEqual(
+			result,
+			`Cline wants to create a new task with the following context:\n\nThis is a test context for a new task\n\nClick "Create New Task" to start a new task with this context preloaded in Plan Mode.`,
+		)
+	})
+
+	test("ClineAskNewTask interface exists", () => {
+		// This is a type check test, it will fail at compile time if the interface doesn't exist
+		const message: ClineMessage = {
+			ts: Date.now(),
+			type: "ask",
+			ask: "new_task",
+			text: JSON.stringify({ context: "Test context" }),
+		}
+
+		assert.ok(message)
+	})
+})

webview-ui/src/components/chat/ChatRow.tsx

@@ -31,6 +31,7 @@ import { OptionsButtons } from "./OptionsButtons"
 import { highlightMentions } from "./TaskHeader"
 import SuccessButton from "../common/SuccessButton"
 import TaskFeedbackButtons from "./TaskFeedbackButtons"
+import NewTaskPreview from "./NewTaskPreview"
 
 const ChatRowContainer = styled.div`
 	padding: 10px 6px 10px 15px;
@@ -1233,6 +1234,21 @@ export const ChatRowContent = ({ message, isExpanded, onToggleExpand, lastModifi
 							</div>
 						</>
 					)
+				case "new_task":
+					return (
+						<>
+							<div style={headerStyle}>
+								<span
+									className="codicon codicon-new-file"
+									style={{
+										color: normalColor,
+										marginBottom: "-1.5px",
+									}}></span>
+								<span style={{ color: normalColor, fontWeight: "bold" }}>Cline wants to start a new task:</span>
+							</div>
+							<NewTaskPreview context={message.text || ""} />
+						</>
+					)
 				case "plan_mode_respond": {
 					let response: string | undefined
 					let options: string[] | undefined

webview-ui/src/components/chat/ChatView.tsx

@@ -195,6 +195,13 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie
 							setSecondaryButtonText(undefined)
 							setDidClickCancel(false)
 							break
+						case "new_task":
+							setTextAreaDisabled(isPartial)
+							setClineAsk("new_task")
+							setEnableButtons(!isPartial)
+							setPrimaryButtonText("Start New Task with Context")
+							setSecondaryButtonText(undefined)
+							break
 					}
 					break
 				case "say":
@@ -295,6 +302,7 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie
 						case "resume_task":
 						case "resume_completed_task":
 						case "mistake_limit_reached":
+						case "new_task": // user can provide feedback or reject the new task suggestion
 							vscode.postMessage({
 								type: "askResponse",
 								askResponse: "messageResponse",
@@ -360,6 +368,13 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie
 					// extension waiting for feedback. but we can just present a new task button
 					startNewTask()
 					break
+				case "new_task":
+					console.log("new task button clicked!", { lastMessage, messages, clineAsk, text })
+					vscode.postMessage({
+						type: "newTask",
+						text: lastMessage?.text,
+					})
+					break
 			}
 			setTextAreaDisabled(true)
 			setClineAsk(undefined)
@@ -368,7 +383,7 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie
 			// setSecondaryButtonText(undefined)
 			disableAutoScrollRef.current = false
 		},
-		[clineAsk, startNewTask],
+		[clineAsk, startNewTask, lastMessage],
 	)
 
 	const handleSecondaryButtonClick = useCallback(

webview-ui/src/components/chat/NewTaskPreview.tsx

@@ -0,0 +1,16 @@
+import React from "react"
+import MarkdownBlock from "../common/MarkdownBlock"
+
+interface NewTaskPreviewProps {
+	context: string
+}
+
+const NewTaskPreview: React.FC<NewTaskPreviewProps> = ({ context }) => {
+	return (
+		<div className="bg-[var(--vscode-badge-background)] text-[var(--vscode-badge-foreground)] rounded-[3px] p-[9px] pt-0 border-t-8 border-[var(--vscode-charts-green)]">
+			<MarkdownBlock markdown={context} />
+		</div>
+	)
+}
+
+export default NewTaskPreview