From 423c74bdc9e01ff3a8d332149fc1d69076926cf1 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Fri, 31 May 2024 18:33:42 -0400
Subject: [PATCH] focus the textarea when the popup is visible

---
 frontend/src/components/select-and-edit/EditPopup.tsx | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/select-and-edit/EditPopup.tsx b/frontend/src/components/select-and-edit/EditPopup.tsx
index 5bc9d42..ca32e65 100644
--- a/frontend/src/components/select-and-edit/EditPopup.tsx
+++ b/frontend/src/components/select-and-edit/EditPopup.tsx
@@ -98,11 +98,16 @@ const EditPopup: React.FC<EditPopupProps> = ({
 
     // Reset the update text
     setUpdateText("");
-
-    // Focus the textarea
-    textareaRef.current?.focus();
   }, [event, iframeRef]);
 
+  // Focus the textarea when the popup is visible (we can't do this when handling the click event
+  // because the textarea is not rendered yet)
+  useEffect(() => {
+    if (popupVisible) {
+      textareaRef.current?.focus();
+    }
+  }, [popupVisible]);
+
   if (!popupVisible) return;
 
   return (