From 2ef3f87de493e89d92cc9f1dc2a096dff9def1c5 Mon Sep 17 00:00:00 2001
From: Neil <4138956+nwparker@users.noreply.github.com>
Date: Fri, 29 May 2026 14:56:06 -0700
Subject: [PATCH] Focus diff comment popover from ref

---
 .../components/diff-comments/DiffCommentPopover.tsx  | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/renderer/src/components/diff-comments/DiffCommentPopover.tsx b/src/renderer/src/components/diff-comments/DiffCommentPopover.tsx
index aeebe5675dd..ff753bf4006 100644
--- a/src/renderer/src/components/diff-comments/DiffCommentPopover.tsx
+++ b/src/renderer/src/components/diff-comments/DiffCommentPopover.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useId, useRef, useState } from 'react'
+import { useCallback, useEffect, useId, useRef, useState } from 'react'
 import { CornerDownLeft, User } from 'lucide-react'
 import { Button } from '@/components/ui/button'
 import { useMountedRef } from '@/hooks/useMountedRef'
@@ -45,7 +45,6 @@ export function DiffCommentPopover({
   // reflect the in-flight status to the user.
   const [submitting, setSubmitting] = useState(false)
   const mountedRef = useMountedRef()
-  const textareaRef = useRef<HTMLTextAreaElement | null>(null)
   const popoverRef = useRef<HTMLDivElement | null>(null)
   // Why: stash onCancel in a ref so the document mousedown listener below can
   // read the freshest callback without listing `onCancel` in its dependency
@@ -61,8 +60,10 @@ export function DiffCommentPopover({
   // "Line N" label as the dialog's accessible name.
   const labelId = useId()
 
-  useEffect(() => {
-    textareaRef.current?.focus()
+  const focusTextareaRef = useCallback((textarea: HTMLTextAreaElement | null): void => {
+    // Why: the draft field should receive focus as soon as the popover mounts;
+    // no external system needs a post-render Effect for this.
+    textarea?.focus()
   }, [])
 
   // Why: Monaco's editor area does not bubble a synthetic React click up to
@@ -129,7 +130,6 @@ export function DiffCommentPopover({
           <User className="size-3" />
         </span>
       </div>
-
       {/* Right Column: Content */}
       <div className="orca-diff-comment-content-col" style={{ gap: '8px' }}>
         <div id={labelId} className="orca-diff-comment-popover-label">
@@ -139,7 +139,7 @@ export function DiffCommentPopover({
               : `Line ${lineNumber}`)}
         </div>
         <textarea
-          ref={textareaRef}
+          ref={focusTextareaRef}
           className="orca-diff-comment-popover-textarea"
           placeholder={placeholder}
           value={body}