From 3390ccf4b1f17c71ebdfa46d03b6e5387e62e58e Mon Sep 17 00:00:00 2001
From: Sean Hatfield <seanhatfield5@gmail.com>
Date: Wed, 19 Feb 2025 07:18:55 +0800
Subject: [PATCH] Improve PromptInput component (#3266)
* allow typing while streaming + refactor props
* remove duplicate function
---
.../ChatContainer/PromptInput/index.jsx | 16 +++++-----------
.../WorkspaceChat/ChatContainer/index.jsx | 3 +--
2 files changed, 6 insertions(+), 13 deletions(-)
diff --git a/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx b/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx
index a0b5d7f82..8caa3dddf 100644
--- a/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx
+++ b/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx
@@ -24,8 +24,7 @@ const MAX_EDIT_STACK_SIZE = 100;
export default function PromptInput({
submit,
onChange,
- inputDisabled,
- buttonDisabled,
+ isStreaming,
sendCommand,
attachments = [],
}) {
@@ -49,11 +48,6 @@ export default function PromptInput({
setPromptInput(e?.detail ?? "");
}
- function resetTextAreaHeight() {
- if (!textareaRef.current) return;
- textareaRef.current.style.height = "auto";
- }
-
useEffect(() => {
if (!!window)
window.addEventListener(PROMPT_INPUT_EVENT, handlePromptUpdate);
@@ -62,9 +56,9 @@ export default function PromptInput({
}, []);
useEffect(() => {
- if (!inputDisabled && textareaRef.current) textareaRef.current.focus();
+ if (!isStreaming && textareaRef.current) textareaRef.current.focus();
resetTextAreaHeight();
- }, [inputDisabled]);
+ }, [isStreaming]);
/**
* Save the current state before changes
@@ -115,6 +109,7 @@ export default function PromptInput({
// Is simple enter key press w/o shift key
if (event.keyCode === 13 && !event.shiftKey) {
event.preventDefault();
+ if (isStreaming) return;
return submit(event);
}
@@ -264,7 +259,6 @@ export default function PromptInput({
handlePasteEvent(e);
}}
required={true}
- disabled={inputDisabled}
onFocus={() => setFocused(true)}
onBlur={(e) => {
setFocused(false);
@@ -274,7 +268,7 @@ export default function PromptInput({
className={`border-none cursor-text max-h-[50vh] md:max-h-[350px] md:min-h-[40px] mx-2 md:mx-0 pt-[12px] w-full leading-5 md:text-md text-white bg-transparent placeholder:text-white/60 light:placeholder:text-theme-text-primary resize-none active:outline-none focus:outline-none flex-grow ${textSizeClass}`}
placeholder={"Send a message"}
/>
- {buttonDisabled ? (
+ {isStreaming ? (
<StopGenerationButton />
) : (
<>
diff --git a/frontend/src/components/WorkspaceChat/ChatContainer/index.jsx b/frontend/src/components/WorkspaceChat/ChatContainer/index.jsx
index 9fc640c4b..3d2f374ea 100644
--- a/frontend/src/components/WorkspaceChat/ChatContainer/index.jsx
+++ b/frontend/src/components/WorkspaceChat/ChatContainer/index.jsx
@@ -282,8 +282,7 @@ export default function ChatContainer({ workspace, knownHistory = [] }) {
<PromptInput
submit={handleSubmit}
onChange={handleMessageChange}
- inputDisabled={loadingResponse}
- buttonDisabled={loadingResponse}
+ isStreaming={loadingResponse}
sendCommand={sendCommand}
attachments={files}
/>
--
GitLab