new: Ctrl+Enter to send message to chat draft

Author: lmtr0

packages/types/src/global-settings.ts

@@ -67,6 +67,7 @@ export const globalSettingsSchema = z.object({
 	alwaysAllowFollowupQuestions: z.boolean().optional(),
 	followupAutoApproveTimeoutMs: z.number().optional(),
 	alwaysAllowUpdateTodoList: z.boolean().optional(),
+	requireCtrlEnterToSend: z.boolean().optional(),
 	allowedCommands: z.array(z.string()).optional(),
 	deniedCommands: z.array(z.string()).optional(),
 	commandExecutionTimeout: z.number().optional(),

src/core/webview/webviewMessageHandler.ts

@@ -577,6 +577,10 @@ export const webviewMessageHandler = async (
 			await updateGlobalState("alwaysAllowUpdateTodoList", message.bool)
 			await provider.postStateToWebview()
 			break
+		case "requireCtrlEnterToSend":
+			await updateGlobalState("requireCtrlEnterToSend", message.bool ?? false)
+			await provider.postStateToWebview()
+			break
 		case "askResponse":
 			provider.getCurrentTask()?.handleWebviewAskResponse(message.askResponse!, message.text, message.images)
 			break
@@ -1454,6 +1458,10 @@ export const webviewMessageHandler = async (
 				Terminal.setTerminalZdotdir(message.bool)
 			}
 			break
+		case "requireCtrlEnterToSend":
+			await updateGlobalState("requireCtrlEnterToSend", message.bool)
+			await provider.postStateToWebview()
+			break
 		case "terminalCompressProgressBar":
 			await updateGlobalState("terminalCompressProgressBar", message.bool)
 			await provider.postStateToWebview()

src/shared/ExtensionMessage.ts

@@ -232,6 +232,7 @@ export type ExtensionState = Pick<
 	| "alwaysAllowFollowupQuestions"
 	| "alwaysAllowExecute"
 	| "alwaysAllowUpdateTodoList"
+	| "requireCtrlEnterToSend"
 	| "followupAutoApproveTimeoutMs"
 	| "allowedCommands"
 	| "deniedCommands"

src/shared/WebviewMessage.ts

@@ -48,6 +48,7 @@ export interface WebviewMessage {
 		| "alwaysAllowExecute"
 		| "alwaysAllowFollowupQuestions"
 		| "alwaysAllowUpdateTodoList"
+		| "requireCtrlEnterToSend"
 		| "followupAutoApproveTimeoutMs"
 		| "webviewDidLaunch"
 		| "newTask"

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

@@ -89,6 +89,7 @@ export const ChatTextArea = forwardRef<HTMLTextAreaElement, ChatTextAreaProps>(
 			clineMessages,
 			commands,
 			cloudUserInfo,
+			requireCtrlEnterToSend,
 		} = useExtensionState()
 
 		// Find the ID and display text for the currently selected API configuration.
@@ -468,6 +469,11 @@ export const ChatTextArea = forwardRef<HTMLTextAreaElement, ChatTextAreaProps>(
 				}
 
 				if (event.key === "Enter" && !event.shiftKey && !isComposing) {
+					// If Ctrl+Enter is required but Ctrl key is not pressed, don't send
+					if (requireCtrlEnterToSend && !event.ctrlKey) {
+						return
+					}
+
 					event.preventDefault()
 
 					// Always call onSend - let ChatView handle queueing when disabled
@@ -536,6 +542,7 @@ export const ChatTextArea = forwardRef<HTMLTextAreaElement, ChatTextAreaProps>(
 				handleHistoryNavigation,
 				resetHistoryNavigation,
 				commands,
+				requireCtrlEnterToSend,
 			],
 		)
 

webview-ui/src/components/settings/SettingsView.tsx

@@ -195,6 +195,7 @@ const SettingsView = forwardRef<SettingsViewRef, SettingsViewProps>(({ onDone, t
 		openRouterImageApiKey,
 		openRouterImageGenerationSelectedModel,
 		reasoningBlockCollapsed,
+		requireCtrlEnterToSend,
 	} = cachedState
 
 	const apiConfiguration = useMemo(() => cachedState.apiConfiguration ?? {}, [cachedState.apiConfiguration])
@@ -384,6 +385,7 @@ const SettingsView = forwardRef<SettingsViewRef, SettingsViewProps>(({ onDone, t
 			vscode.postMessage({ type: "updateSupportPrompt", values: customSupportPrompts || {} })
 			vscode.postMessage({ type: "includeTaskHistoryInEnhance", bool: includeTaskHistoryInEnhance ?? true })
 			vscode.postMessage({ type: "setReasoningBlockCollapsed", bool: reasoningBlockCollapsed ?? true })
+			vscode.postMessage({ type: "requireCtrlEnterToSend", bool: requireCtrlEnterToSend ?? false })
 			vscode.postMessage({ type: "upsertApiConfiguration", text: currentApiConfigName, apiConfiguration })
 			vscode.postMessage({ type: "telemetrySetting", text: telemetrySetting })
 			vscode.postMessage({ type: "profileThresholds", values: profileThresholds })
@@ -782,6 +784,7 @@ const SettingsView = forwardRef<SettingsViewRef, SettingsViewProps>(({ onDone, t
 					{activeTab === "ui" && (
 						<UISettings
 							reasoningBlockCollapsed={reasoningBlockCollapsed ?? true}
+							requireCtrlEnterToSend={requireCtrlEnterToSend ?? false}
 							setCachedStateField={setCachedStateField}
 						/>
 					)}

webview-ui/src/components/settings/UISettings.tsx

@@ -11,10 +11,16 @@ import { ExtensionStateContextType } from "@/context/ExtensionStateContext"
 
 interface UISettingsProps extends HTMLAttributes<HTMLDivElement> {
 	reasoningBlockCollapsed: boolean
+	requireCtrlEnterToSend?: boolean
 	setCachedStateField: SetCachedStateField<keyof ExtensionStateContextType>
 }
 
-export const UISettings = ({ reasoningBlockCollapsed, setCachedStateField, ...props }: UISettingsProps) => {
+export const UISettings = ({
+	reasoningBlockCollapsed,
+	requireCtrlEnterToSend,
+	setCachedStateField,
+	...props
+}: UISettingsProps) => {
 	const { t } = useAppTranslation()
 
 	const handleReasoningBlockCollapsedChange = (value: boolean) => {
@@ -26,6 +32,15 @@ export const UISettings = ({ reasoningBlockCollapsed, setCachedStateField, ...pr
 		})
 	}
 
+	const handleRequireCtrlEnterToSendChange = (value: boolean) => {
+		setCachedStateField("requireCtrlEnterToSend", value)
+
+		// Track telemetry event
+		telemetryClient.capture("ui_settings_ctrl_enter_changed", {
+			enabled: value,
+		})
+	}
+
 	return (
 		<div {...props}>
 			<SectionHeader>
@@ -49,6 +64,19 @@ export const UISettings = ({ reasoningBlockCollapsed, setCachedStateField, ...pr
 							{t("settings:ui.collapseThinking.description")}
 						</div>
 					</div>
+
+					{/* Require Ctrl+Enter to Send Setting */}
+					<div className="flex flex-col gap-1">
+						<VSCodeCheckbox
+							checked={requireCtrlEnterToSend ?? false}
+							onChange={(e: any) => handleRequireCtrlEnterToSendChange(e.target.checked)}
+							data-testid="ctrl-enter-checkbox">
+							<span className="font-medium">{t("settings:ui.requireCtrlEnterToSend.label")}</span>
+						</VSCodeCheckbox>
+						<div className="text-vscode-descriptionForeground text-sm ml-5 mt-1">
+							{t("settings:ui.requireCtrlEnterToSend.description")}
+						</div>
+					</div>
 				</div>
 			</Section>
 		</div>

webview-ui/src/context/ExtensionStateContext.tsx

@@ -158,6 +158,8 @@ export interface ExtensionStateContextType extends ExtensionState {
 	setMaxDiagnosticMessages: (value: number) => void
 	includeTaskHistoryInEnhance?: boolean
 	setIncludeTaskHistoryInEnhance: (value: boolean) => void
+	requireCtrlEnterToSend?: boolean
+	setRequireCtrlEnterToSend: (value: boolean) => void
 }
 
 export const ExtensionStateContext = createContext<ExtensionStateContextType | undefined>(undefined)
@@ -264,6 +266,7 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode
 		alwaysAllowUpdateTodoList: true,
 		includeDiagnosticMessages: true,
 		maxDiagnosticMessages: 50,
+		requireCtrlEnterToSend: false,
 		openRouterImageApiKey: "",
 		openRouterImageGenerationSelectedModel: "",
 	})
@@ -559,6 +562,10 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode
 		},
 		includeTaskHistoryInEnhance,
 		setIncludeTaskHistoryInEnhance,
+		requireCtrlEnterToSend: state.requireCtrlEnterToSend,
+		setRequireCtrlEnterToSend: (value) => {
+			setState((prevState) => ({ ...prevState, requireCtrlEnterToSend: value }))
+		},
 	}
 
 	return <ExtensionStateContext.Provider value={contextValue}>{children}</ExtensionStateContext.Provider>

webview-ui/src/i18n/locales/en/settings.json

@@ -42,6 +42,10 @@
 		"collapseThinking": {
 			"label": "Collapse Thinking messages by default",
 			"description": "When enabled, thinking blocks will be collapsed by default until you interact with them"
+		},
+		"requireCtrlEnterToSend": {
+			"label": "Require Ctrl+Enter to send messages",
+			"description": "When enabled, you must press Ctrl+Enter to send messages instead of just Enter"
 		}
 	},
 	"prompts": {