From e77ffb42b01d8ef65651d649fa8462da30e7858e Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Mon, 2 Feb 2026 19:51:05 +0000
Subject: [PATCH] Clear queued message input

Co-authored-by: me <me@kentcdodds.com>
---
 .../_app+/recipients+/$recipientId.index.tsx    | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/app/routes/_app+/recipients+/$recipientId.index.tsx b/app/routes/_app+/recipients+/$recipientId.index.tsx
index 042c5c87..f3877b83 100644
--- a/app/routes/_app+/recipients+/$recipientId.index.tsx
+++ b/app/routes/_app+/recipients+/$recipientId.index.tsx
@@ -300,6 +300,22 @@ export default function RecipientRoute() {
 	const data = useLoaderData<typeof loader>()
 	const newMessageFetcher = useFetcher<typeof action>()
 	const isCreating = newMessageFetcher.state !== 'idle'
+	const newMessageInputRef = useRef<HTMLTextAreaElement | null>(null)
+	const shouldClearMessageInput = useRef(false)
+
+	useEffect(() => {
+		if (newMessageFetcher.state !== 'idle') {
+			shouldClearMessageInput.current = true
+			return
+		}
+		if (!shouldClearMessageInput.current) return
+
+		const hasErrors = Boolean(newMessageFetcher.data?.result?.error)
+		if (!hasErrors && newMessageInputRef.current) {
+			newMessageInputRef.current.value = ''
+		}
+		shouldClearMessageInput.current = false
+	}, [newMessageFetcher.state, newMessageFetcher.data])
 
 	return (
 		<div className="flex flex-col gap-8">
@@ -341,6 +357,7 @@ export default function RecipientRoute() {
 						<textarea
 							id="new-message"
 							name="content"
+							ref={newMessageInputRef}
 							placeholder="Aa"
 							className="text-foreground placeholder:text-muted-foreground min-h-[44px] flex-1 resize-none rounded-full bg-transparent px-4 py-2 text-sm leading-relaxed focus-visible:outline-none"
 							rows={1}