Unblock React Compiler for 6 components by removing render-phase ref access (#11544)

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>

src/state/messages/message-drafts.tsx

@@ -2,9 +2,9 @@ import {
   createContext,
   useContext,
   useEffect,
+  useEffectEvent,
   useMemo,
   useReducer,
-  useRef,
 } from 'react'
 
 import {useCurrentConvoId} from './current-convo-id'
@@ -44,8 +44,7 @@ export function useMessageDraft() {
 export function useSaveMessageDraft(message: string) {
   const {currentConvoId} = useCurrentConvoId()
   const {dispatch} = useMessageDraftsContext()
-  const messageRef = useRef(message)
-  messageRef.current = message
+  const getMessage = useEffectEvent(() => message)
 
   useEffect(() => {
     return () => {
@@ -53,7 +52,7 @@ export function useSaveMessageDraft(message: string) {
         dispatch({
           type: 'set',
           convoId: currentConvoId,
-          draft: messageRef.current,
+          draft: getMessage(),
         })
       }
     }