From 2def9398219d5cfe60c4643cdb3b4a8c7a223d65 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Fri, 23 Dec 2022 19:33:51 +0800
Subject: [PATCH] Fix textarea focus not working

---
 src/components/compose.jsx | 48 ++++++++++++++++++++++++--------------
 1 file changed, 30 insertions(+), 18 deletions(-)

diff --git a/src/components/compose.jsx b/src/components/compose.jsx
index 64b0789d..1788ad49 100644
--- a/src/components/compose.jsx
+++ b/src/components/compose.jsx
@@ -96,28 +96,36 @@ function Compose({
     })();
   }, []);
 
+  const oninputTextarea = () => {
+    if (!textareaRef.current) return;
+    textareaRef.current.dispatchEvent(new Event('input'));
+  };
+  const focusTextarea = () => {
+    setTimeout(() => {
+      textareaRef.current?.focus();
+    }, 100);
+  };
+
   useEffect(() => {
     if (replyToStatus) {
       const { spoilerText, visibility, sensitive } = replyToStatus;
       if (spoilerText && spoilerTextRef.current) {
         spoilerTextRef.current.value = spoilerText;
-        spoilerTextRef.current.focus();
-      } else {
-        const mentions = new Set([
-          replyToStatus.account.acct,
-          ...replyToStatus.mentions.map((m) => m.acct),
-        ]);
-        const allMentions = [...mentions].filter(
-          (m) => m !== currentAccountInfo.acct,
-        );
-        if (allMentions.length > 0) {
-          textareaRef.current.value = `${allMentions
-            .map((m) => `@${m}`)
-            .join(' ')} `;
-          textareaRef.current.dispatchEvent(new Event('input'));
-        }
-        textareaRef.current.focus();
       }
+      const mentions = new Set([
+        replyToStatus.account.acct,
+        ...replyToStatus.mentions.map((m) => m.acct),
+      ]);
+      const allMentions = [...mentions].filter(
+        (m) => m !== currentAccountInfo.acct,
+      );
+      if (allMentions.length > 0) {
+        textareaRef.current.value = `${allMentions
+          .map((m) => `@${m}`)
+          .join(' ')} `;
+        oninputTextarea();
+      }
+      focusTextarea();
       setVisibility(visibility);
       setSensitive(sensitive);
     }
@@ -136,7 +144,8 @@ function Compose({
         expiresIn: poll?.expiresIn || expiresInFromExpiresAt(poll.expiresAt),
       };
       textareaRef.current.value = status;
-      textareaRef.current.dispatchEvent(new Event('input'));
+      oninputTextarea();
+      focusTextarea();
       spoilerTextRef.current.value = spoilerText;
       setVisibility(visibility);
       setSensitive(sensitive);
@@ -156,8 +165,9 @@ function Compose({
           console.log({ statusSource });
           const { text, spoilerText } = statusSource;
           textareaRef.current.value = text;
-          textareaRef.current.dispatchEvent(new Event('input'));
           textareaRef.current.dataset.source = text;
+          oninputTextarea();
+          focusTextarea();
           spoilerTextRef.current.value = spoilerText;
           setVisibility(visibility);
           setSensitive(sensitive);
@@ -170,6 +180,8 @@ function Compose({
           setUIState('error');
         }
       })();
+    } else {
+      focusTextarea();
     }
   }, [draftStatus, editStatus, replyToStatus]);