From 4c9ed33c14df9e37d7d11faafb4182a3534141ca Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Mon, 5 Jun 2023 12:09:13 -0400
Subject: Enter button on user input

---
 extension/react-app/src/components/StepContainer.tsx | 20 +++++---------------
 1 file changed, 5 insertions(+), 15 deletions(-)

(limited to 'extension/react-app/src/components/StepContainer.tsx')

diff --git a/extension/react-app/src/components/StepContainer.tsx b/extension/react-app/src/components/StepContainer.tsx
index 903f9b94..f54d4d75 100644
--- a/extension/react-app/src/components/StepContainer.tsx
+++ b/extension/react-app/src/components/StepContainer.tsx
@@ -23,6 +23,7 @@ import {
 import { HistoryNode } from "../../../schema/HistoryNode";
 import ReactMarkdown from "react-markdown";
 import ContinueButton from "./ContinueButton";
+import InputAndButton from "./InputAndButton";
 
 interface StepContainerProps {
   historyNode: HistoryNode;
@@ -177,22 +178,11 @@ function StepContainer(props: StepContainerProps) {
           )}
 
           {props.historyNode.step.name === "Waiting for user input" && (
-            <input
-              ref={userInputRef}
-              className="m-auto p-2 rounded-md border-1 border-solid text-white w-3/4 border-gray-200 bg-vsc-background"
-              onKeyDown={(e) => {
-                if (e.key === "Enter") {
-                  props.onUserInput(e.currentTarget.value);
-                }
+            <InputAndButton
+              onUserInput={(value) => {
+                props.onUserInput(value);
               }}
-              type="text"
-              onSubmit={(ev) => {
-                props.onUserInput(ev.currentTarget.value);
-              }}
-              onClick={(e) => {
-                e.stopPropagation();
-              }}
-            />
+            ></InputAndButton>
           )}
           {props.historyNode.step.name === "Waiting for user confirmation" && (
             <>
-- 
cgit v1.2.3-70-g09d2

