perf: reuse mounted ref in floating terminal setup

src/renderer/src/components/floating-terminal/FloatingTerminalOrchestrationDialog.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState } from 'react'
+import { useCallback, useEffect, useState } from 'react'
 import { Check, Clipboard, Copy, Loader2 } from 'lucide-react'
 import { toast } from 'sonner'
 import { Button } from '@/components/ui/button'
@@ -21,6 +21,7 @@ import {
   ORCHESTRATION_SETUP_DISMISSED_STORAGE_KEY,
   notifyOrchestrationSetupStateChanged
 } from '@/lib/orchestration-setup-state'
+import { useMountedRef } from '@/hooks/useMountedRef'
 import type { CliInstallStatus } from '../../../../shared/cli-install-types'
 
 type FloatingTerminalOrchestrationDialogProps = {
@@ -40,20 +41,16 @@ export function FloatingTerminalOrchestrationDialog({
   const [cliLoading, setCliLoading] = useState(false)
   const [cliBusy, setCliBusy] = useState(false)
   const [skillBusy, setSkillBusy] = useState(false)
-  const mountedRef = useRef(true)
+  const mountedRef = useMountedRef()
 
-  useEffect(() => {
-    mountedRef.current = true
-    return () => {
-      mountedRef.current = false
-    }
-  }, [])
-
-  const setCliStatusIfMounted = useCallback((status: CliInstallStatus | null): void => {
-    if (mountedRef.current) {
-      setCliStatus(status)
-    }
-  }, [])
+  const setCliStatusIfMounted = useCallback(
+    (status: CliInstallStatus | null): void => {
+      if (mountedRef.current) {
+        setCliStatus(status)
+      }
+    },
+    [mountedRef]
+  )
 
   const refreshCliStatus = useCallback(async (): Promise<void> => {
     setCliLoading(true)
@@ -68,7 +65,7 @@ export function FloatingTerminalOrchestrationDialog({
         setCliLoading(false)
       }
     }
-  }, [setCliStatusIfMounted])
+  }, [mountedRef, setCliStatusIfMounted])
 
   useEffect(() => {
     if (open) {

src/renderer/src/components/floating-terminal/FloatingTerminalPanel.tsx

@@ -11,6 +11,7 @@ import TabBar from '@/components/tab-bar/TabBar'
 import { resolveGroupTabFromVisibleId } from '@/components/tab-group/tab-group-visible-id'
 import TerminalPane from '@/components/terminal-pane/TerminalPane'
 import { Button } from '@/components/ui/button'
+import { useMountedRef } from '@/hooks/useMountedRef'
 import { useShortcutKeys } from '@/hooks/useShortcutLabel'
 import {
   Dialog,
@@ -141,7 +142,7 @@ export function FloatingTerminalPanel({
   const panelRef = useRef<HTMLDivElement>(null)
   const shortcutFocusFrameRef = useRef<number | null>(null)
   const shortcutFocusTimeoutRef = useRef<number | null>(null)
-  const mountedRef = useRef(true)
+  const mountedRef = useMountedRef()
   const dragRef = useRef<{
     pointerId: number
     startX: number
@@ -345,13 +346,6 @@ export function FloatingTerminalPanel({
     handleSaveDialogCancel()
   }, [handleSaveDialogCancel])
 
-  useEffect(() => {
-    mountedRef.current = true
-    return () => {
-      mountedRef.current = false
-    }
-  }, [])
-
   useEffect(() => {
     if (!open || normalizedInitialBoundsRef.current || typeof window === 'undefined') {
       return
@@ -426,7 +420,7 @@ export function FloatingTerminalPanel({
         setShowOrchestrationSetup(true)
       }
     }
-  }, [])
+  }, [mountedRef])
 
   useEffect(() => {
     if (open) {