From dd5690ee53ef267511061a52ed25bb9ac2e6034b Mon Sep 17 00:00:00 2001
From: Ryan Chen <ryan@torrtle.co>
Date: Mon, 27 Oct 2025 12:07:47 -0400
Subject: [PATCH] Add submit on Enter for chat textarea
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Press Enter to submit message
- Press Shift+Enter to insert new line
- Add helpful placeholder text explaining keyboard shortcuts
- Improve chat UX with standard messaging behavior

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 raggr-frontend/src/components/ChatScreen.tsx | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/raggr-frontend/src/components/ChatScreen.tsx b/raggr-frontend/src/components/ChatScreen.tsx
index fe8b96e..0beafb8 100644
--- a/raggr-frontend/src/components/ChatScreen.tsx
+++ b/raggr-frontend/src/components/ChatScreen.tsx
@@ -156,6 +156,14 @@ export const ChatScreen = ({ setAuthenticated }: ChatScreenProps) => {
     setQuery(event.target.value);
   };
 
+  const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {
+    // Submit on Enter, but allow Shift+Enter for new line
+    if (event.key === "Enter" && !event.shiftKey) {
+      event.preventDefault();
+      handleQuestionSubmit();
+    }
+  };
+
   return (
     <div className="h-screen bg-opacity-20">
       <div className="bg-white/85 h-screen">
@@ -200,8 +208,10 @@ export const ChatScreen = ({ setAuthenticated }: ChatScreenProps) => {
                 <textarea
                   className="p-3 sm:p-4 border border-blue-200 rounded-md grow bg-white min-h-[44px] resize-y"
                   onChange={handleQueryChange}
+                  onKeyDown={handleKeyDown}
                   value={query}
                   rows={2}
+                  placeholder="Type your message... (Press Enter to send, Shift+Enter for new line)"
                 />
               </div>
               <div className="flex flex-row justify-between gap-2 grow">