From d70883515c8691091846d721687a9e90b03e1f57 Mon Sep 17 00:00:00 2001
From: WofWca <wofwca@protonmail.com>
Date: Mon, 16 Sep 2024 17:40:26 +0400
Subject: [PATCH] fix: inconsistent & wrong `composer.focus()`

- Erasing draft text and immediately focusing another element
  would return the focus to the composer after 500ms, when the draft
  gets deleted (`clearDraft` would get invoked from `saveDraft()`.
- Composer would not get re-focused when deleting / adding
  attachments or removing quotation if the draft text is not empty.

`.focus()` inside of `clearDraft()` was introduced in
199ea232539e77ea9b4c903451b90a56dc880554, most likely to re-focus the
input after sending a message. We now have separate code for this,
see `composerSendMessage`.

This change likely needs some more testing.
---
 CHANGELOG.md                                         |  1 +
 .../frontend/src/components/composer/Composer.tsx    | 12 +++++++-----
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b7d1a1e7c..4ee91e31f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -27,6 +27,7 @@
 - fix: packaging: windows 64bit and 32bit releases now have different filenames, bring back 64bit windows releases. #4131
 - some shortcuts (e.g. `Ctrl + N`, `Ctrl + K`) not working on some languages' keyboard layots #4140
 - fix chat "scrolling up" when someone adds a reaction, resulting in new messages not getting scrolled into view when they arrive #4120
+- message input getting unexpectedly re-focused, and not re-focused after some actions if the draft text is not empty #4136
 
 <a id="1_46_8"></a>
 
diff --git a/packages/frontend/src/components/composer/Composer.tsx b/packages/frontend/src/components/composer/Composer.tsx
index 6344ca56e..7d504be9f 100644
--- a/packages/frontend/src/components/composer/Composer.tsx
+++ b/packages/frontend/src/components/composer/Composer.tsx
@@ -436,8 +436,7 @@ export function useDraft(
 
   const clearDraft = useCallback(() => {
     _setDraft(_ => emptyDraft(chatId))
-    inputRef.current?.focus()
-  }, [chatId, inputRef])
+  }, [chatId])
 
   const loadDraft = useCallback(
     (chatId: number) => {
@@ -549,21 +548,24 @@ export function useDraft(
       draftRef.current.quote = null
     }
     saveDraft()
-  }, [saveDraft])
+    inputRef.current?.focus()
+  }, [inputRef, saveDraft])
 
   const removeFile = useCallback(() => {
     draftRef.current.file = ''
     draftRef.current.viewType = 'Text'
     saveDraft()
-  }, [saveDraft])
+    inputRef.current?.focus()
+  }, [inputRef, saveDraft])
 
   const addFileToDraft = useCallback(
     async (file: string, viewType: Viewtype) => {
       draftRef.current.file = file
       draftRef.current.viewType = viewType
+      inputRef.current?.focus()
       return saveDraft()
     },
-    [saveDraft]
+    [inputRef, saveDraft]
   )
 
   const settingsStore = useSettingsStore()[0]