The fix is complete. Here's a summary of the changes: (#1435)

## Summary

Fixed GitHub issue #1433 - "Clicking on add review comment button no longer focus on the edit box"

### Changes Made

**1. `frontend/src/components/ui/wysiwyg.tsx`** (+5 lines)
- Added import for `AutoFocusPlugin` from `@lexical/react/LexicalAutoFocusPlugin`
- Added `autoFocus?: boolean` prop to `WysiwygProps` type
- Conditionally renders `<AutoFocusPlugin />` when `autoFocus` is true and editor is editable

**2. `frontend/src/components/diff/CommentWidgetLine.tsx`** (+1 line)
- Added `autoFocus` prop to the `WYSIWYGEditor` when creating new review comments

**3. `frontend/src/components/diff/ReviewCommentRenderer.tsx`** (+1 line)
- Added `autoFocus` prop to the `WYSIWYGEditor` when editing existing review comments

### Verification
- TypeScript type check: Passed
- ESLint: Passed
- Prettier: Passed

frontend/src/components/diff/CommentWidgetLine.tsx

@@ -83,6 +83,7 @@ export function CommentWidgetLine({
         className="w-full bg-primary text-primary-foreground text-sm font-mono min-h-[60px]"
         projectId={projectId}
         onCmdEnter={handleSave}
+        autoFocus
       />
       <div className="mt-2 flex gap-2">
         <Button size="xs" onClick={handleSave} disabled={!value.trim()}>

frontend/src/components/diff/ReviewCommentRenderer.tsx

@@ -47,6 +47,7 @@ export function ReviewCommentRenderer({
           className="w-full bg-background text-foreground text-sm font-mono min-h-[60px]"
           projectId={projectId}
           onCmdEnter={handleSave}
+          autoFocus
         />
         <div className="mt-2 flex gap-2">
           <Button size="xs" onClick={handleSave} disabled={!editText.trim()}>

frontend/src/components/ui/wysiwyg.tsx

@@ -2,6 +2,7 @@ import { useMemo, useState, useCallback, memo } from 'react';
 import { LexicalComposer } from '@lexical/react/LexicalComposer';
 import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
 import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';
+import { AutoFocusPlugin } from '@lexical/react/LexicalAutoFocusPlugin';
 import { ContentEditable } from '@lexical/react/LexicalContentEditable';
 import { MarkdownShortcutPlugin } from '@lexical/react/LexicalMarkdownShortcutPlugin';
 import { TRANSFORMERS, INLINE_CODE, type Transformer } from '@lexical/markdown';
@@ -62,6 +63,8 @@ type WysiwygProps = {
   onEdit?: () => void;
   /** Optional delete callback - shows delete button in read-only mode when provided */
   onDelete?: () => void;
+  /** Auto-focus the editor on mount */
+  autoFocus?: boolean;
 };
 
 function WYSIWYGEditor({
@@ -80,6 +83,7 @@ function WYSIWYGEditor({
   localImages,
   onEdit,
   onDelete,
+  autoFocus = false,
 }: WysiwygProps) {
   // Copy button state
   const [copied, setCopied] = useState(false);
@@ -225,6 +229,7 @@ function WYSIWYGEditor({
               {/* Only include editing plugins when not in read-only mode */}
               {!disabled && (
                 <>
+                  {autoFocus && <AutoFocusPlugin />}
                   <HistoryPlugin />
                   <MarkdownShortcutPlugin transformers={extendedTransformers} />
                   <FileTagTypeaheadPlugin projectId={projectId} />