enter

nmsimons · Sep 24, 2024 · 70f60b7 · 70f60b7
1 parent a63b6a1
commit 70f60b7
Showing 1 changed file with 50 additions and 38 deletions.
diff --git a/src/react/prompt_ux.tsx b/src/react/prompt_ux.tsx
@@ -22,6 +22,55 @@ export function HeaderPrompt(props: {
 	const [placeholder, setPlaceholder] = useState(placeholderType);
 	const [buttonColor, setButtonColor] = useState(buttonDefaultColor);
 
+	const handleInsertTemplate = () => {
+		if (isLoadingTemplate) {
+			props.abortController.abort("User cancelled");
+			setIsLoadingTemplate(false);
+			setButtonPrompt("Talk");
+			setPlaceholder(placeholderType);
+			setPromptText("");
+			setButtonColor(buttonDefaultColor);
+		} else {
+			setIsLoadingTemplate(true);
+			setButtonPrompt("Cancel");
+			setPlaceholder(placeholderTalk);
+			setPromptText("");
+			setButtonColor("bg-red-500");
+			console.log("Inserting template: " + prompt);
+			props
+				.applyAgentEdits(prompt, props.treeView, props.abortController)
+				.then((result: PrompterResult) => {
+					switch (result) {
+						case "success":
+							console.log("Template inserted successfully");
+							break;
+						case "tooManyErrors":
+							console.log("Too many errors");
+							break;
+						case "tooManyEdits":
+							console.log("Too many edits");
+							break;
+						case "aborted":
+							console.log("Aborted");
+							break;
+					}
+					setButtonColor(buttonDefaultColor);
+					setIsLoadingTemplate(false);
+					setButtonPrompt("Talk");
+					setPlaceholder(placeholderType);
+					setPromptText(prompt);
+				});
+		}
+	};
+
+	// capture the return key to insert the template
+	// when the input field is focused
+	document.onkeydown = (e) => {
+		if (e.key === "Enter" && document.activeElement?.id === "insertTemplateInput") {
+			handleInsertTemplate();
+		}
+	};
+
 	return (
 		<div className="h-full w-full flex flex-row items-center gap-2">
 			<div className="flex h-fit w-full">
@@ -45,44 +94,7 @@ export function HeaderPrompt(props: {
 					className={`${buttonColor} hover:bg-gray-800 text-white font-bold w-20 h-full py-1 px-2 rounded`}
 					id="insertTemplateButton"
 					onClick={() => {
-						if (isLoadingTemplate) {
-							props.abortController.abort("User cancelled");
-							setIsLoadingTemplate(false);
-							setButtonPrompt("Talk");
-							setPlaceholder(placeholderType);
-							setPromptText("");
-							setButtonColor(buttonDefaultColor);
-						} else {
-							setIsLoadingTemplate(true);
-							setButtonPrompt("Cancel");
-							setPlaceholder(placeholderTalk);
-							setPromptText("");
-							setButtonColor("bg-red-500");
-							console.log("Inserting template: " + prompt);
-							props
-								.applyAgentEdits(prompt, props.treeView, props.abortController)
-								.then((result: PrompterResult) => {
-									switch (result) {
-										case "success":
-											console.log("Template inserted successfully");
-											break;
-										case "tooManyErrors":
-											console.log("Too many errors");
-											break;
-										case "tooManyEdits":
-											console.log("Too many edits");
-											break;
-										case "aborted":
-											console.log("Aborted");
-											break;
-									}
-									setButtonColor(buttonDefaultColor);
-									setIsLoadingTemplate(false);
-									setButtonPrompt("Talk");
-									setPlaceholder(placeholderType);
-									setPromptText(prompt);
-								});
-						}
+						handleInsertTemplate();
 					}}
 				>
 					{buttonPrompt}