Add terminal emulator for better command interactivity; add python env to system information

webview-ui/src/components/ChatView.tsx

@@ -6,7 +6,7 @@ import { useEvent, useMount } from "react-use"
 import { Virtuoso, type VirtuosoHandle } from "react-virtuoso"
 import { ClaudeAsk, ClaudeSayTool, ExtensionMessage } from "../../../src/shared/ExtensionMessage"
 import { combineApiRequests } from "../../../src/shared/combineApiRequests"
-import { combineCommandSequences } from "../../../src/shared/combineCommandSequences"
+import { combineCommandSequences, COMMAND_STDIN_STRING } from "../../../src/shared/combineCommandSequences"
 import { getApiMetrics } from "../../../src/shared/getApiMetrics"
 import { useExtensionState } from "../context/ExtensionStateContext"
 import { getSyntaxHighlighterStyleFromTheme } from "../utils/getSyntaxHighlighterStyleFromTheme"
@@ -244,6 +244,20 @@ const ChatView = ({
 		}
 	}
 
+	const handleSendStdin = (text: string) => {
+		if (claudeAsk === "command_output") {
+			vscode.postMessage({
+				type: "askResponse",
+				askResponse: "messageResponse",
+				text: COMMAND_STDIN_STRING + text,
+			})
+			setClaudeAsk(undefined)
+			// don't need to disable since extension relinquishes control back immediately
+			// setTextAreaDisabled(true)
+			// setEnableButtons(false)
+		}
+	}
+
 	/*
 	This logic depends on the useEffect[messages] above to set claudeAsk, after which buttons are shown and we then send an askResponse to the extension.
 	*/
@@ -442,19 +456,13 @@ const ChatView = ({
 		return () => clearTimeout(timer)
 	}, [visibleMessages])
 
-	const [placeholderText, isInputPipingToStdin] = useMemo(() => {
-		if (messages.at(-1)?.ask === "command_output") {
-			return ["Type input to command stdin...", true]
-		}
+	const placeholderText = useMemo(() => {
 		const text = task ? "Type a message..." : "Type your task here..."
-		return [text, false]
-	}, [task, messages])
+		return text
+	}, [task])
 
 	const shouldDisableImages =
-		!selectedModelSupportsImages ||
-		textAreaDisabled ||
-		selectedImages.length >= MAX_IMAGES_PER_MESSAGE ||
-		isInputPipingToStdin
+		!selectedModelSupportsImages || textAreaDisabled || selectedImages.length >= MAX_IMAGES_PER_MESSAGE
 
 	return (
 		<div
@@ -536,7 +544,7 @@ const ChatView = ({
 								onToggleExpand={() => toggleRowExpansion(message.ts)}
 								lastModifiedMessage={modifiedMessages.at(-1)}
 								isLast={index === visibleMessages.length - 1}
-								apiProvider={apiConfiguration?.apiProvider}
+								handleSendStdin={handleSendStdin}
 							/>
 						)}
 					/>