dmux 3.2.0 → 3.3.0

package/dist/DmuxApp.js

@@ -1,9 +1,7 @@
 import React, { useState, useEffect } from "react";
-import { Box, Text, useInput, useApp, useStdout } from "ink";
-import { execSync } from "child_process";
-import fs from "fs/promises";
-import path from "path";
+import { Box, Text, useApp, useStdout } from "ink";
 import { createRequire } from "module";
+import { TmuxService } from "./services/TmuxService.js";
 // Hooks
 import usePanes from "./hooks/usePanes.js";
 import useProjectSettings from "./hooks/useProjectSettings.js";
@@ -15,38 +13,40 @@ import useAgentStatus from "./hooks/useAgentStatus.js";
 import usePaneRunner from "./hooks/usePaneRunner.js";
 import usePaneCreation from "./hooks/usePaneCreation.js";
 import useActionSystem from "./hooks/useActionSystem.js";
+import { useStatusMessages } from "./hooks/useStatusMessages.js";
+import { useLayoutManagement } from "./hooks/useLayoutManagement.js";
+import { useInputHandling } from "./hooks/useInputHandling.js";
+import { useDialogState } from "./hooks/useDialogState.js";
+import { useTunnelManagement } from "./hooks/useTunnelManagement.js";
+import { useDebugInfo } from "./hooks/useDebugInfo.js";
 // Utils
-import { enforceControlPaneSize } from "./utils/tmux.js";
 import { SIDEBAR_WIDTH } from "./utils/layoutManager.js";
-import { suggestCommand } from "./utils/commands.js";
-import { generateSlug } from "./utils/slug.js";
-import { getMainBranch } from "./utils/git.js";
-import { capturePaneContent } from "./utils/paneCapture.js";
-import { supportsPopups, launchNodePopupNonBlocking, POPUP_POSITIONING, } from "./utils/popup.js";
+import { supportsPopups } from "./utils/popup.js";
 import { StateManager } from "./shared/StateManager.js";
-import { LogService } from "./services/LogService.js";
+import { REPAINT_SPINNER_DURATION, } from "./constants/timing.js";
 import { getStatusDetector, } from "./services/StatusDetector.js";
-import { PaneAction, getAvailableActions, } from "./actions/index.js";
-import { SettingsManager, SETTING_DEFINITIONS, } from "./utils/settingsManager.js";
+import { SettingsManager } from "./utils/settingsManager.js";
+import { useServices } from "./hooks/useServices.js";
+import { PaneLifecycleManager } from "./services/PaneLifecycleManager.js";
 import { fileURLToPath } from "url";
 import { dirname } from "path";
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 const require = createRequire(import.meta.url);
 const packageJson = require("../package.json");
-import PanesGrid from "./components/PanesGrid.js";
-import CommandPromptDialog from "./components/CommandPromptDialog.js";
-import FileCopyPrompt from "./components/FileCopyPrompt.js";
-import LoadingIndicator from "./components/LoadingIndicator.js";
-import RunningIndicator from "./components/RunningIndicator.js";
-import UpdatingIndicator from "./components/UpdatingIndicator.js";
-import FooterHelp from "./components/FooterHelp.js";
+import PanesGrid from "./components/panes/PanesGrid.js";
+import CommandPromptDialog from "./components/dialogs/CommandPromptDialog.js";
+import FileCopyPrompt from "./components/ui/FileCopyPrompt.js";
+import LoadingIndicator from "./components/indicators/LoadingIndicator.js";
+import RunningIndicator from "./components/indicators/RunningIndicator.js";
+import UpdatingIndicator from "./components/indicators/UpdatingIndicator.js";
+import FooterHelp from "./components/ui/FooterHelp.js";
 const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoot, autoUpdater, serverPort, server, controlPaneId, }) => {
     const { stdout } = useStdout();
     const terminalHeight = stdout?.rows || 40;
     /* panes state moved to usePanes */
     const [selectedIndex, setSelectedIndex] = useState(0);
-    const [statusMessage, setStatusMessage] = useState("");
+    const { statusMessage, setStatusMessage, showStatus, clearStatus } = useStatusMessages();
     const [isCreatingPane, setIsCreatingPane] = useState(false);
     // Settings state
     const [settingsManager] = useState(() => new SettingsManager(projectRoot));
@@ -55,18 +55,16 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     // Spinner state - shows for a few frames to force render
     const [showRepaintSpinner, setShowRepaintSpinner] = useState(false);
     const { projectSettings, saveSettings } = useProjectSettings(settingsFile);
-    const [showCommandPrompt, setShowCommandPrompt] = useState(null);
-    const [commandInput, setCommandInput] = useState("");
-    const [showFileCopyPrompt, setShowFileCopyPrompt] = useState(false);
-    const [currentCommandType, setCurrentCommandType] = useState(null);
-    const [runningCommand, setRunningCommand] = useState(false);
-    const [quitConfirmMode, setQuitConfirmMode] = useState(false);
-    // Debug message state - for temporary logging messages
-    const [debugMessage, setDebugMessage] = useState("");
-    // Current git branch state (for dev builds)
-    const [currentBranch, setCurrentBranch] = useState(null);
+    // Dialog state management
+    const dialogState = useDialogState();
+    const { showCommandPrompt, setShowCommandPrompt, commandInput, setCommandInput, showFileCopyPrompt, setShowFileCopyPrompt, currentCommandType, setCurrentCommandType, runningCommand, setRunningCommand, quitConfirmMode, setQuitConfirmMode, } = dialogState;
+    // Tunnel/network state management
+    const tunnelState = useTunnelManagement();
+    const { tunnelUrl, setTunnelUrl, tunnelCreating, setTunnelCreating, tunnelCopied, setTunnelCopied, localIp, setLocalIp, } = tunnelState;
+    // Debug/development info
+    const { debugMessage, setDebugMessage, currentBranch } = useDebugInfo(__dirname);
     // Update state handled by hook
-    const { updateInfo, showUpdateDialog, isUpdating, performUpdate, skipUpdate, dismissUpdate, updateAvailable, } = useAutoUpdater(autoUpdater, setStatusMessage);
+    const { updateInfo, isUpdating, updateAvailable, } = useAutoUpdater(autoUpdater, setStatusMessage);
     const { exit } = useApp();
     // Flag to ignore input temporarily after popup closes (prevents buffered keys)
     const [ignoreInput, setIgnoreInput] = useState(false);
@@ -80,12 +78,6 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     // Track unread error and warning counts for logs badge
     const [unreadErrorCount, setUnreadErrorCount] = useState(0);
     const [unreadWarningCount, setUnreadWarningCount] = useState(0);
-    // Tunnel state
-    const [tunnelUrl, setTunnelUrl] = useState(null);
-    const [tunnelCreating, setTunnelCreating] = useState(false);
-    const [tunnelSpinnerFrame, setTunnelSpinnerFrame] = useState(0);
-    const [localIp, setLocalIp] = useState("127.0.0.1");
-    const [tunnelCopied, setTunnelCopied] = useState(false);
     // Subscribe to StateManager for unread error/warning count updates
     useEffect(() => {
         const stateManager = StateManager.getInstance();
@@ -103,12 +95,18 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     }, []);
     // Panes state and persistence (skipLoading will be updated after actionSystem is initialized)
     const { panes, setPanes, isLoading, loadPanes, savePanes } = usePanes(panesFile, false);
-    // Track intentionally closed panes to prevent race condition
-    // When a user closes a pane, we add it to this set. If the worker detects
-    // the pane is gone (which it will), we check this set first before re-saving.
-    const intentionallyClosedPanes = React.useRef(new Set());
+    // Pane lifecycle manager - handles locking to prevent race conditions
+    // Replaces the old timeout-based intentionallyClosedPanes Set
+    const lifecycleManager = React.useMemo(() => PaneLifecycleManager.getInstance(), []);
+    // Clean up stale lifecycle operations periodically
+    useEffect(() => {
+        const cleanupInterval = setInterval(() => {
+            lifecycleManager.cleanupStaleOperations();
+        }, 60000); // Every 60 seconds
+        return () => clearInterval(cleanupInterval);
+    }, [lifecycleManager]);
     // Pane runner
-    const { copyNonGitFiles, runCommandInternal, monitorTestOutput, monitorDevOutput, attachBackgroundWindow, } = usePaneRunner({
+    const { copyNonGitFiles, runCommandInternal, } = usePaneRunner({
         panes,
         savePanes,
         projectSettings,
@@ -120,15 +118,16 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         setForceRepaintTrigger((prev) => prev + 1);
         setShowRepaintSpinner(true);
         // Hide spinner after a few frames (enough to trigger multiple renders)
-        setTimeout(() => setShowRepaintSpinner(false), 100);
+        setTimeout(() => setShowRepaintSpinner(false), REPAINT_SPINNER_DURATION);
     };
     // Force repaint effect - ensures Ink re-renders when trigger changes
     useEffect(() => {
         if (forceRepaintTrigger > 0) {
             // Small delay to ensure terminal is ready
-            const timer = setTimeout(() => {
+            const timer = setTimeout(async () => {
                 try {
-                    execSync("tmux refresh-client", { stdio: "pipe" });
+                    const tmuxService = TmuxService.getInstance();
+                    await tmuxService.refreshClient();
                 }
                 catch { }
             }, 50);
@@ -137,48 +136,26 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     }, [forceRepaintTrigger]);
     // Get local network IP on mount
     useEffect(() => {
-        try {
-            // Get local IP address (not 127.0.0.1)
-            const result = execSync(`hostname -I 2>/dev/null || ifconfig | grep "inet " | grep -v 127.0.0.1 | awk '{print $2}' | head -1`, {
-                encoding: "utf-8",
-                stdio: "pipe",
-            }).trim();
-            if (result) {
-                setLocalIp(result.split(" ")[0]); // Take first IP if multiple
-            }
-        }
-        catch {
-            // Fallback to 127.0.0.1
-            setLocalIp("127.0.0.1");
-        }
-    }, []);
-    // Spinner animation for tunnel creation
-    useEffect(() => {
-        if (!tunnelCreating)
-            return;
-        const spinnerInterval = setInterval(() => {
-            setTunnelSpinnerFrame((prev) => (prev + 1) % 10);
-        }, 80); // Update every 80ms
-        return () => clearInterval(spinnerInterval);
-    }, [tunnelCreating]);
-    // Get current git branch on mount (only for dev builds)
-    useEffect(() => {
-        const isDev = process.env.DMUX_DEV === "true" || __dirname.includes("dist") === false;
-        if (isDev) {
+        const getLocalIp = async () => {
             try {
-                const branch = execSync("git rev-parse --abbrev-ref HEAD", {
+                // Get local IP address (not 127.0.0.1)
+                const { execSync } = await import("child_process");
+                const result = execSync(`hostname -I 2>/dev/null || ifconfig | grep "inet " | grep -v 127.0.0.1 | awk '{print $2}' | head -1`, {
                     encoding: "utf-8",
                     stdio: "pipe",
-                    cwd: projectRoot,
                 }).trim();
-                setCurrentBranch(branch);
+                if (result) {
+                    setLocalIp(result.split(" ")[0]); // Take first IP if multiple
+                }
             }
             catch {
-                // Not in a git repo or git not available
-                setCurrentBranch(null);
+                // Fallback to 127.0.0.1
+                setLocalIp("127.0.0.1");
             }
-        }
-    }, [projectRoot]);
+        };
+        getLocalIp();
+    }, []);
+    // Spinner animation and branch detection now handled in hooks
     // Pane creation
     const { createNewPane: createNewPaneHook } = usePaneCreation({
         panes,
@@ -191,6 +168,26 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         availableAgents,
         forceRepaint,
     });
+    // Initialize services
+    const { popupManager } = useServices({
+        // PopupManager config
+        sidebarWidth: SIDEBAR_WIDTH,
+        projectRoot: projectRoot || process.cwd(),
+        popupsSupported,
+        terminalWidth,
+        terminalHeight,
+        availableAgents,
+        agentChoice,
+        serverPort,
+        server,
+        settingsManager,
+        projectSettings,
+        // Callbacks
+        setStatusMessage,
+        setIgnoreInput,
+        savePanes,
+        loadPanes,
+    });
     // Listen for status updates with analysis data and merge into panes
     useEffect(() => {
         const statusDetector = getStatusDetector();
@@ -308,897 +305,142 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     // findCardInDirection provided by useNavigation
     // savePanes moved to usePanes
     // applySmartLayout moved to utils/tmux
-    const launchNewPanePopup = async () => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        try {
-            // Resolve the popup script path from the project root
-            // This handles both dev (tsx running from src) and prod (compiled to dist)
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "newPanePopup.js");
-            // Calculate popup height as 80% of terminal height to allow room for file list
-            const popupHeight = Math.floor(terminalHeight * 0.8);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [], {
-                ...POPUP_POSITIONING.centeredWithSidebar(SIDEBAR_WIDTH),
-                width: 90,
-                height: popupHeight,
-                title: "  ✨ dmux - Create New Pane  ",
-            });
-            LogService.getInstance().debug(`Popup created - PID: ${popupHandle.pid}, bounds: ${JSON.stringify(popupHandle.bounds)}`, "PopupTracking");
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            LogService.getInstance().debug("Popup closed, clearing tracking", "PopupTracking");
-            // Ignore input briefly after popup closes to prevent buffered keys
-            setIgnoreInput(true);
-            setTimeout(() => setIgnoreInput(false), 100);
-            if (result.success && result.data) {
-                // User entered a prompt - now decide which agent to use
-                const promptValue = result.data;
-                const agents = availableAgents;
-                if (agents.length === 0) {
-                    await createNewPaneHook(promptValue);
-                }
-                else if (agents.length === 1) {
-                    await createNewPaneHook(promptValue, agents[0]);
-                }
-                else {
-                    // Multiple agents available - check for default agent setting first
-                    const settings = settingsManager.getSettings();
-                    if (settings.defaultAgent && agents.includes(settings.defaultAgent)) {
-                        // Use the default agent from settings
-                        await createNewPaneHook(promptValue, settings.defaultAgent);
-                    }
-                    else {
-                        // No default agent configured or default not available - show agent choice popup
-                        const selectedAgent = await launchAgentChoicePopup(promptValue);
-                        if (selectedAgent) {
-                            await createNewPaneHook(promptValue, selectedAgent);
-                        }
-                    }
-                }
-            }
-            else if (result.cancelled) {
-                // User pressed ESC - do nothing
-                return;
-            }
-            else if (result.error) {
-                setStatusMessage(`Popup error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
-            }
+    // Helper function to handle agent choice and pane creation
+    const handlePaneCreationWithAgent = async (prompt) => {
+        const agents = availableAgents;
+        if (agents.length === 0) {
+            await createNewPaneHook(prompt);
         }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
+        else if (agents.length === 1) {
+            await createNewPaneHook(prompt, agents[0]);
         }
-    };
-    const launchKebabMenuPopup = async (paneIndex) => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        const selectedPane = panes[paneIndex];
-        if (!selectedPane) {
-            return;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "kebabMenuPopup.js");
-            // Get available actions for this pane
-            const actions = getAvailableActions(selectedPane, projectSettings);
-            const actionsJson = JSON.stringify(actions);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [selectedPane.slug, actionsJson], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 60,
-                height: Math.min(20, actions.length + 5),
-                title: `Menu: ${selectedPane.slug}`,
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Log the entire result for debugging
-            LogService.getInstance().debug(`Kebab menu result: ${JSON.stringify(result)}`, "KebabMenu");
-            if (result.success && result.data) {
-                // User selected an action
-                const actionId = result.data;
-                LogService.getInstance().debug(`Action selected: ${actionId}`, "KebabMenu");
-                // Handle merge action with dedicated popup
-                if (actionId === PaneAction.MERGE) {
-                    LogService.getInstance().debug(`Merge action selected for pane: ${selectedPane.slug}`, "MergeAction");
-                    try {
-                        await launchMergePopup(selectedPane);
-                        LogService.getInstance().debug("Merge popup completed", "MergeAction");
-                    }
-                    catch (error) {
-                        LogService.getInstance().error("Merge popup error", "MergeAction", selectedPane.id, error instanceof Error ? error : undefined);
-                        setStatusMessage(`Merge popup failed: ${error}`);
-                        setTimeout(() => setStatusMessage(""), 3000);
-                    }
-                }
-                else {
-                    // Execute other actions through action system
-                    await actionSystem.executeAction(actionId, selectedPane, {
-                        mainBranch: getMainBranch(),
-                    });
-                }
-            }
-            else if (result.cancelled) {
-                // User pressed ESC - do nothing
-                LogService.getInstance().debug("Kebab menu cancelled", "KebabMenu");
-                return;
-            }
-            else if (result.error) {
-                LogService.getInstance().error(`Kebab menu error: ${result.error}`, "KebabMenu");
-                setStatusMessage(`Popup error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
+        else {
+            // Multiple agents available - check for default agent setting first
+            const settings = settingsManager.getSettings();
+            if (settings.defaultAgent && agents.includes(settings.defaultAgent)) {
+                await createNewPaneHook(prompt, settings.defaultAgent);
             }
             else {
-                LogService.getInstance().warn(`Unexpected kebab menu result: ${JSON.stringify(result)}`, "KebabMenu");
-            }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-    };
-    const launchConfirmPopup = async (title, message, yesLabel, noLabel) => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return false;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "confirmPopup.js");
-            // Write data to temp file to avoid shell escaping issues
-            const dataFile = `/tmp/dmux-confirm-${Date.now()}.json`;
-            const dataJson = JSON.stringify({ title, message, yesLabel, noLabel });
-            await fs.writeFile(dataFile, dataJson);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [dataFile], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 60,
-                height: 12,
-                title: title || "Confirm",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Clean up temp file
-            try {
-                await fs.unlink(dataFile);
-            }
-            catch { }
-            if (result.success && result.data !== undefined) {
-                return result.data;
-            }
-            else if (result.cancelled) {
-                return false;
-            }
-            else if (result.error) {
-                setStatusMessage(`Popup error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
-                return false;
-            }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-        return false;
-    };
-    const launchAgentChoicePopup = async (prompt) => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return null;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "agentChoicePopup.js");
-            const agentsJson = JSON.stringify(availableAgents);
-            const defaultAgentArg = agentChoice || availableAgents[0] || "claude";
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [agentsJson, defaultAgentArg], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 50,
-                height: 10,
-                title: "Select Agent",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            if (result.success && result.data) {
-                return result.data;
-            }
-            else if (result.cancelled) {
-                return null;
-            }
-            else if (result.error) {
-                setStatusMessage(`Popup error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
-                return null;
-            }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-        return null;
-    };
-    const launchHooksPopup = async () => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "hooksPopup.js");
-            // Get hooks data
-            const { hasHook } = await import("./utils/hooks.js");
-            const allHookTypes = [
-                "before_pane_create",
-                "pane_created",
-                "worktree_created",
-                "before_pane_close",
-                "pane_closed",
-                "before_worktree_remove",
-                "worktree_removed",
-                "pre_merge",
-                "post_merge",
-                "run_test",
-                "run_dev",
-            ];
-            const hooks = allHookTypes.map((hookName) => ({
-                name: hookName,
-                active: hasHook(projectRoot || process.cwd(), hookName),
-            }));
-            const hooksJson = JSON.stringify(hooks);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [hooksJson], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 70,
-                height: 24,
-                title: "🪝 Manage Hooks",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            if (result.success && result.data?.action === "edit") {
-                // Edit hooks using an agent
-                const prompt = "I would like to edit my dmux hooks in .dmux-hooks, please read the instructions in there and ask me what I want to edit";
-                // Choose agent
-                const agents = availableAgents;
-                if (agents.length === 0) {
-                    await createNewPaneHook(prompt);
+                // Show agent choice popup
+                const selectedAgent = await popupManager.launchAgentChoicePopup();
+                if (selectedAgent) {
+                    await createNewPaneHook(prompt, selectedAgent);
                 }
-                else if (agents.length === 1) {
-                    await createNewPaneHook(prompt, agents[0]);
-                }
-                else {
-                    // Multiple agents available - check for default agent setting first
-                    const settings = settingsManager.getSettings();
-                    if (settings.defaultAgent && agents.includes(settings.defaultAgent)) {
-                        // Use the default agent from settings
-                        await createNewPaneHook(prompt, settings.defaultAgent);
-                    }
-                    else {
-                        // No default agent configured or default not available - show agent choice popup
-                        const selectedAgent = await launchAgentChoicePopup(prompt);
-                        if (selectedAgent) {
-                            await createNewPaneHook(prompt, selectedAgent);
-                        }
-                    }
-                }
-            }
-            else if (result.success && result.data?.action === "view") {
-                // View hooks file in editor - could implement this later
-                setStatusMessage("View in editor not yet implemented");
-                setTimeout(() => setStatusMessage(""), 2000);
-            }
-            else if (result.cancelled) {
-                // User pressed ESC - do nothing
-                return;
-            }
-            else if (result.error) {
-                setStatusMessage(`Popup error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
-            }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-    };
-    const launchLogsPopup = async () => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "logsPopup.js");
-            // Get logs from StateManager and write to temp file
-            const stateManager = StateManager.getInstance();
-            const allLogs = stateManager.getLogs();
-            const stats = stateManager.getLogStats();
-            const logsData = { logs: allLogs, stats };
-            // Write data to temp file to avoid shell escaping issues with complex JSON
-            const dataFile = `/tmp/dmux-logs-${Date.now()}.json`;
-            const dataJson = JSON.stringify(logsData);
-            await fs.writeFile(dataFile, dataJson);
-            // Launch the popup with large positioning
-            // Get tmux client dimensions (not process.stdout which is just the sidebar)
-            const tmuxDims = execSync('tmux display-message -p "#{client_width},#{client_height}"', { encoding: "utf-8" }).trim();
-            const [termWidth, termHeight] = tmuxDims.split(",").map(Number);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [dataFile], {
-                ...POPUP_POSITIONING.large(SIDEBAR_WIDTH, termWidth, termHeight),
-                title: "🪵 dmux Logs",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Clean up temp file
-            try {
-                await fs.unlink(dataFile);
-            }
-            catch (err) {
-                // Ignore cleanup errors
-            }
-            // Popup closed - mark all logs as read
-            if (result.success) {
-                stateManager.markAllLogsAsRead();
-            }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-    };
-    const launchShortcutsPopup = async () => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "shortcutsPopup.js");
-            // Prepare data for shortcuts popup
-            const shortcutsData = {
-                hasSidebarLayout: !!controlPaneId,
-                showRemoteKey: !!server,
-            };
-            // Write data to temp file
-            const dataFile = `/tmp/dmux-shortcuts-${Date.now()}.json`;
-            const dataJson = JSON.stringify(shortcutsData);
-            await fs.writeFile(dataFile, dataJson);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [dataFile], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 50,
-                height: 20,
-                title: "⌨️  Keyboard Shortcuts",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Clean up temp file
-            try {
-                await fs.unlink(dataFile);
-            }
-            catch (err) {
-                // Ignore cleanup errors
-            }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-    };
-    const launchRemotePopup = async () => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        // Check if server is available and tunnel URL exists
-        if (!server || !serverPort || !tunnelUrl) {
-            setStatusMessage("Tunnel not ready");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "remotePopup.js");
-            // Prepare status file with existing tunnel URL
-            const tunnelStatusFile = `/tmp/dmux-tunnel-status-${Date.now()}.json`;
-            await fs.writeFile(tunnelStatusFile, JSON.stringify({ url: tunnelUrl }));
-            // Prepare data for remote popup
-            const remoteData = {
-                loading: false,
-                serverPort: serverPort,
-                statusFile: tunnelStatusFile,
-            };
-            // Write data to temp file
-            const dataFile = `/tmp/dmux-remote-${Date.now()}.json`;
-            await fs.writeFile(dataFile, JSON.stringify(remoteData));
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [dataFile], {
-                ...POPUP_POSITIONING.centeredWithSidebar(SIDEBAR_WIDTH),
-                width: 60,
-                height: 30,
-                title: "🌐 Remote Access",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Show "Copied!" message if URL was copied
-            // Note: result is the parsed JSON directly, not wrapped in PopupResult.data
-            if (result && result.copied) {
-                setTunnelCopied(true);
-                setTimeout(() => setTunnelCopied(false), 2000);
-            }
-            // Clean up temp files
-            try {
-                await fs.unlink(dataFile);
             }
-            catch (err) {
-                // Ignore cleanup errors
-            }
-            try {
-                await fs.unlink(tunnelStatusFile);
-            }
-            catch (err) {
-                // Ignore cleanup errors (file might not exist yet)
-            }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
         }
     };
-    const launchSettingsPopup = async () => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
+    // Helper function to handle action results recursively
+    const handleActionResult = async (result) => {
+        // Handle ActionResults from background callbacks (e.g., conflict resolution completion)
+        // This allows showing dialogs even when not in the normal action flow
+        if (!popupsSupported)
             return;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "settingsPopup.js");
-            // Prepare settings data for popup
-            const settingsData = {
-                settingDefinitions: SETTING_DEFINITIONS,
-                settings: settingsManager.getSettings(),
-                globalSettings: settingsManager.getGlobalSettings(),
-                projectSettings: settingsManager.getProjectSettings(),
-            };
-            const settingsJson = JSON.stringify(settingsData);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [settingsJson], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 70,
-                height: Math.min(25, SETTING_DEFINITIONS.length + 8),
-                title: "⚙️  Settings",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            if (result.success) {
-                // Check if this is an action result (action field at top level)
-                if (result.action) {
-                    // Action type setting (like 'hooks')
-                    if (result.action === "hooks") {
-                        // Launch hooks popup
-                        await launchHooksPopup();
-                    }
+        // Handle the result type and show appropriate dialog
+        if (result.type === "confirm") {
+            const confirmed = await popupManager.launchConfirmPopup(result.title || "Confirm", result.message, result.confirmLabel, result.cancelLabel);
+            if (confirmed && result.onConfirm) {
+                const nextResult = await result.onConfirm();
+                // Recursively handle nested results
+                if (nextResult) {
+                    await handleActionResult(nextResult);
                 }
-                else if (result.data) {
-                    // Regular setting change (result.data contains the setting)
-                    const { key, value, scope } = result.data;
-                    settingsManager.updateSetting(key, value, scope);
-                    setStatusMessage(`Setting saved (${scope})`);
-                    setTimeout(() => setStatusMessage(""), 2000);
-                }
-            }
-            else if (result.cancelled) {
-                // User pressed ESC - do nothing
-                return;
             }
-            else if (result.error) {
-                setStatusMessage(`Popup error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
+            else if (!confirmed && result.onCancel) {
+                const nextResult = await result.onCancel();
+                if (nextResult) {
+                    await handleActionResult(nextResult);
+                }
             }
         }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-    };
-    const launchMergePopup = async (pane) => {
-        LogService.getInstance().debug(`launchMergePopup called for pane: ${pane.slug}`, "MergePopup");
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            LogService.getInstance().warn("Popups not supported", "MergePopup");
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        if (!pane.worktreePath) {
-            LogService.getInstance().warn("No worktree path for pane", "MergePopup", pane.id);
-            setStatusMessage("This pane has no worktree to merge");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "mergePopup.js");
-            LogService.getInstance().debug(`Popup script path: ${popupScriptPath}`, "MergePopup");
-            // Check if popup script exists
-            try {
-                await fs.access(popupScriptPath);
-                LogService.getInstance().debug("Popup script exists", "MergePopup");
-            }
-            catch {
-                LogService.getInstance().error(`Popup script NOT found at: ${popupScriptPath}`, "MergePopup");
-                setStatusMessage(`Merge popup script not found: ${popupScriptPath}`);
-                setTimeout(() => setStatusMessage(""), 5000);
+        else if (result.type === "choice") {
+            if (!result.options || !result.onSelect)
                 return;
-            }
-            // Prepare merge data
-            const mainRepoPath = pane.worktreePath.replace(/\/\.dmux\/worktrees\/[^/]+$/, "");
-            const mergeData = {
-                paneSlug: pane.slug,
-                worktreePath: pane.worktreePath,
-                mainRepoPath,
-                mainBranch: getMainBranch(),
-            };
-            // Write data to temp file
-            const dataFile = `/tmp/dmux-merge-${Date.now()}.json`;
-            await fs.writeFile(dataFile, JSON.stringify(mergeData));
-            LogService.getInstance().debug(`Merge data written to: ${dataFile}`, "MergePopup");
-            LogService.getInstance().debug(`Merge data: ${JSON.stringify(mergeData)}`, "MergePopup");
-            // Launch the popup non-blocking and track it
-            LogService.getInstance().debug("Launching merge popup...", "MergePopup");
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [dataFile], {
-                ...POPUP_POSITIONING.large(SIDEBAR_WIDTH, terminalWidth, terminalHeight),
-                width: 80,
-                height: 30,
-                title: `🔀 Merge: ${pane.slug}`,
-            });
-            LogService.getInstance().debug(`Popup launched, PID: ${popupHandle.pid}`, "MergePopup");
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Clean up temp file
-            try {
-                await fs.unlink(dataFile);
-            }
-            catch { }
-            if (result.success && result.data?.merged) {
-                if (result.data.closedPane) {
-                    // Pane was closed during merge, refresh pane list
-                    await loadPanes();
-                    setStatusMessage("Merge complete, pane closed");
+            const selectedId = await popupManager.launchChoicePopup(result.title || "Choose Option", result.message, result.options);
+            if (selectedId) {
+                const nextResult = await result.onSelect(selectedId);
+                // Recursively handle nested results
+                if (nextResult) {
+                    await handleActionResult(nextResult);
                 }
-                else {
-                    setStatusMessage("Merge complete");
-                }
-                setTimeout(() => setStatusMessage(""), 3000);
-            }
-            else if (result.cancelled) {
-                // User cancelled
-                return;
             }
-            else if (result.error) {
-                setStatusMessage(`Merge error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
-            }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch merge popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
         }
-    };
-    const launchChoicePopup = async (title, message, options) => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return null;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "choicePopup.js");
-            // Write data to temp file to avoid shell escaping issues
-            const dataFile = `/tmp/dmux-choice-${Date.now()}.json`;
-            const dataJson = JSON.stringify({ title, message, options });
-            await fs.writeFile(dataFile, dataJson);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [dataFile], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 70,
-                height: Math.min(25, options.length * 3 + 8),
-                title: title || "Choose Option",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Clean up temp file
-            try {
-                await fs.unlink(dataFile);
-            }
-            catch { }
-            if (result.success && result.data) {
-                return result.data;
-            }
-            else if (result.cancelled) {
-                return null;
-            }
-            else if (result.error) {
-                setStatusMessage(`Popup error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
-                return null;
+        else if (result.type === "input") {
+            if (!result.onSubmit)
+                return;
+            const inputValue = await popupManager.launchInputPopup(result.title || "Input", result.message, result.placeholder, result.defaultValue);
+            if (inputValue !== null) {
+                const nextResult = await result.onSubmit(inputValue);
+                // Recursively handle nested results
+                if (nextResult) {
+                    await handleActionResult(nextResult);
+                }
             }
         }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-        return null;
-    };
-    const launchInputPopup = async (title, message, placeholder, defaultValue) => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage("Popups require tmux 3.2+");
-            setTimeout(() => setStatusMessage(""), 3000);
-            return null;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "inputPopup.js");
-            // Write data to temp file to avoid shell escaping issues
-            const dataFile = `/tmp/dmux-input-${Date.now()}.json`;
-            const dataJson = JSON.stringify({
-                title,
-                message,
-                placeholder,
-                defaultValue,
-            });
-            await fs.writeFile(dataFile, dataJson);
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [dataFile], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 70,
-                height: 15,
-                title: title || "Input",
-            });
-            // Wait for the popup to close
-            const result = await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Clean up temp file
-            try {
-                await fs.unlink(dataFile);
-            }
-            catch { }
-            if (result.success && result.data !== undefined) {
-                return result.data;
-            }
-            else if (result.cancelled) {
-                return null;
-            }
-            else if (result.error) {
-                setStatusMessage(`Popup error: ${result.error}`);
-                setTimeout(() => setStatusMessage(""), 3000);
-                return null;
+        else if (result.type === "navigation") {
+            // Navigate to target pane if specified
+            if (result.targetPaneId) {
+                const targetPane = panes.find(p => p.id === result.targetPaneId);
+                if (targetPane) {
+                    try {
+                        TmuxService.getInstance().selectPane(targetPane.paneId);
+                    }
+                    catch (error) {
+                        console.error('[onActionResult] Failed to navigate to pane:', error);
+                    }
+                }
             }
-        }
-        catch (error) {
-            setStatusMessage(`Failed to launch popup: ${error.message}`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-        return null;
-    };
-    const launchProgressPopup = async (message, type = "info", timeout = 2000) => {
-        // Only launch popup if tmux supports it
-        if (!popupsSupported) {
-            setStatusMessage(message);
-            setTimeout(() => setStatusMessage(""), timeout);
-            return;
-        }
-        try {
-            // Resolve the popup script path
-            const projectRootForPopup = __dirname.includes("/dist")
-                ? path.resolve(__dirname, "..") // If in dist/, go up one level
-                : path.resolve(__dirname, ".."); // If in src/, go up one level
-            const popupScriptPath = path.join(projectRootForPopup, "dist", "popups", "progressPopup.js");
-            // Write data to temp file to avoid shell escaping issues
-            const dataFile = `/tmp/dmux-progress-${Date.now()}.json`;
-            const dataJson = JSON.stringify({ message, type, timeout });
-            await fs.writeFile(dataFile, dataJson);
-            // Launch the popup - position at top, 1 char right of sidebar
-            // Height depends on message length
-            const lines = Math.ceil(message.length / 60) + 3; // Estimate lines needed
-            const titleText = type === "success"
-                ? "✓ Success"
-                : type === "error"
-                    ? "✗ Error"
-                    : type === "info"
-                        ? "ℹ Info"
-                        : "Progress";
-            // Launch the popup non-blocking and track it
-            const popupHandle = launchNodePopupNonBlocking(popupScriptPath, [dataFile], {
-                ...POPUP_POSITIONING.standard(SIDEBAR_WIDTH),
-                width: 70,
-                height: Math.min(15, lines + 4),
-                title: titleText,
-            });
-            // Wait for the popup to close
-            await popupHandle.resultPromise;
-            // Clear active popup tracking
-            // Clean up temp file
-            try {
-                await fs.unlink(dataFile);
+            // Show message if dismissable
+            if (result.message && result.dismissable) {
+                await popupManager.launchProgressPopup(result.message, "info", 3000);
             }
-            catch { }
         }
-        catch (error) {
-            // Fallback to inline message
-            setStatusMessage(message);
-            setTimeout(() => setStatusMessage(""), timeout);
+        else if (result.type === "info" ||
+            result.type === "success" ||
+            result.type === "error") {
+            await popupManager.launchProgressPopup(result.message, result.type, 3000);
         }
     };
-    // Action system - initialized after popup launchers are defined
+    // Action system - initialized after services are defined
     const actionSystem = useActionSystem({
         panes,
         savePanes,
         sessionName,
         projectName,
-        onPaneRemove: (paneId) => {
-            // Mark the pane as intentionally closed to prevent race condition with worker
-            intentionallyClosedPanes.current.add(paneId);
+        onPaneRemove: async (paneId) => {
+            // Mark pane as closing to prevent race condition with worker
+            await lifecycleManager.beginClose(paneId, 'user requested');
             // Remove from panes list
             const updatedPanes = panes.filter((p) => p.paneId !== paneId);
             savePanes(updatedPanes);
-            // Clean up after a delay
-            setTimeout(() => {
-                intentionallyClosedPanes.current.delete(paneId);
-            }, 5000);
+            // Mark close as completed (no more lock needed)
+            await lifecycleManager.completeClose(paneId);
         },
+        onActionResult: handleActionResult,
         forceRepaint,
         popupLaunchers: popupsSupported
             ? {
-                launchConfirmPopup,
-                launchChoicePopup,
-                launchInputPopup,
-                launchProgressPopup,
+                launchConfirmPopup: popupManager.launchConfirmPopup.bind(popupManager),
+                launchChoicePopup: popupManager.launchChoicePopup.bind(popupManager),
+                launchInputPopup: popupManager.launchInputPopup.bind(popupManager),
+                launchProgressPopup: popupManager.launchProgressPopup.bind(popupManager),
             }
             : undefined,
     });
     // Auto-show new pane dialog removed - users can press 'n' to create panes via popup
     // Periodic enforcement of control pane size and content pane rebalancing (left sidebar at 40 chars)
-    useEffect(() => {
-        if (!controlPaneId) {
-            return; // No sidebar layout configured
-        }
-        // Enforce sidebar width immediately on mount
-        enforceControlPaneSize(controlPaneId, SIDEBAR_WIDTH);
-        // Debounce resize handler to prevent infinite loops
-        let resizeTimeout = null;
-        let isApplyingLayout = false;
-        const handleResize = () => {
-            // Skip if we're already applying a layout (prevents loops)
-            if (isApplyingLayout) {
-                return;
-            }
-            // Clear any pending resize
-            if (resizeTimeout) {
-                clearTimeout(resizeTimeout);
-            }
-            // Debounce: wait 500ms after last resize event (prevents excessive recalculations)
-            resizeTimeout = setTimeout(() => {
-                // Only enforce if not showing dialogs (to avoid interference)
-                const hasActiveDialog = actionSystem.actionState.showConfirmDialog ||
-                    actionSystem.actionState.showChoiceDialog ||
-                    actionSystem.actionState.showInputDialog ||
-                    actionSystem.actionState.showProgressDialog ||
-                    !!showCommandPrompt ||
-                    showFileCopyPrompt ||
-                    isCreatingPane ||
-                    runningCommand ||
-                    isUpdating;
-                if (!hasActiveDialog) {
-                    isApplyingLayout = true;
-                    // Only enforce sidebar width when terminal resizes
-                    enforceControlPaneSize(controlPaneId, SIDEBAR_WIDTH);
-                    // Force Ink to repaint after resize to prevent blank dmux pane
-                    forceRepaint();
-                    // Reset flag after a brief delay
-                    setTimeout(() => {
-                        isApplyingLayout = false;
-                    }, 100);
-                }
-            }, 500);
-        };
-        // Listen to stdout resize events
-        process.stdout.on("resize", handleResize);
-        // Also listen for SIGWINCH and SIGUSR1 (tmux hook sends USR1)
-        process.on("SIGWINCH", handleResize);
-        process.on("SIGUSR1", handleResize);
-        return () => {
-            process.stdout.off("resize", handleResize);
-            process.off("SIGWINCH", handleResize);
-            process.off("SIGUSR1", handleResize);
-            if (resizeTimeout) {
-                clearTimeout(resizeTimeout);
-            }
-        };
-    }, [
+    useLayoutManagement({
         controlPaneId,
-        actionSystem.actionState.showConfirmDialog,
-        actionSystem.actionState.showChoiceDialog,
-        actionSystem.actionState.showInputDialog,
-        actionSystem.actionState.showProgressDialog,
-        showCommandPrompt,
-        showFileCopyPrompt,
-        isCreatingPane,
-        runningCommand,
-        isUpdating,
-    ]);
+        hasActiveDialog: actionSystem.actionState.showConfirmDialog ||
+            actionSystem.actionState.showChoiceDialog ||
+            actionSystem.actionState.showInputDialog ||
+            actionSystem.actionState.showProgressDialog ||
+            !!showCommandPrompt ||
+            showFileCopyPrompt ||
+            isCreatingPane ||
+            runningCommand ||
+            isUpdating,
+        onForceRepaint: forceRepaint,
+    });
     // Monitor agent status across panes (returns a map of pane ID to status)
     const agentStatuses = useAgentStatus({
         panes,
@@ -1209,9 +451,9 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
             !!showCommandPrompt ||
             showFileCopyPrompt,
         onPaneRemoved: (paneId) => {
-            // Check if this pane was intentionally closed
+            // Check if this pane is being closed intentionally or is locked
             // If so, don't re-save - the close action already handled it
-            if (intentionallyClosedPanes.current.has(paneId)) {
+            if (lifecycleManager.isClosing(paneId) || lifecycleManager.isLocked(paneId)) {
                 return;
             }
             // Pane was removed unexpectedly (e.g., user killed tmux pane manually)
@@ -1220,415 +462,9 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
             savePanes(updatedPanes);
         },
     });
-    const createNewPane = async (prompt, agent) => {
-        setIsCreatingPane(true);
-        setStatusMessage("Generating slug...");
-        const slug = await generateSlug(prompt);
-        setStatusMessage(`Creating worktree: ${slug}...`);
-        // Get git root directory for consistent worktree placement
-        let projectRoot;
-        try {
-            projectRoot = execSync("git rev-parse --show-toplevel", {
-                encoding: "utf-8",
-                stdio: "pipe",
-            }).trim();
-        }
-        catch {
-            // Fallback to current directory if not in a git repo
-            projectRoot = process.cwd();
-        }
-        // Create worktree path inside .dmux/worktrees directory
-        const worktreePath = path.join(projectRoot, ".dmux", "worktrees", slug);
-        // Get the original pane ID (where dmux is running) before clearing
-        const originalPaneId = execSync('tmux display-message -p "#{pane_id}"', {
-            encoding: "utf-8",
-        }).trim();
-        // Minimal clearing to avoid layout shifts
-        process.stdout.write("\x1b[2J\x1b[H");
-        // Get current pane count to determine layout
-        const paneCount = parseInt(execSync("tmux list-panes | wc -l", { encoding: "utf-8" }).trim());
-        // Enable pane borders to show titles
-        try {
-            execSync(`tmux set-option -g pane-border-status top`, { stdio: "pipe" });
-        }
-        catch {
-            // Ignore if already set or fails
-        }
-        // Create new pane
-        const paneInfo = execSync(`tmux split-window -h -P -F '#{pane_id}'`, {
-            encoding: "utf-8",
-        }).trim();
-        // Wait for pane creation to settle
-        await new Promise((resolve) => setTimeout(resolve, 500));
-        // Set pane title to match the slug
-        try {
-            execSync(`tmux select-pane -t '${paneInfo}' -T "${slug}"`, {
-                stdio: "pipe",
-            });
-        }
-        catch {
-            // Ignore if setting title fails
-        }
-        // Don't apply global layouts - let content panes arrange naturally
-        // Only enforce sidebar width
-        try {
-            const controlPaneId = execSync('tmux display-message -p "#{pane_id}"', {
-                encoding: "utf-8",
-            }).trim();
-            enforceControlPaneSize(controlPaneId, SIDEBAR_WIDTH);
-        }
-        catch { }
-        // Create git worktree and cd into it
-        // This MUST happen before launching Claude to ensure we're in the right directory
-        try {
-            // First, create the worktree and cd into it as a single command
-            // Use ; instead of && to ensure cd runs even if worktree already exists
-            const worktreeCmd = `git worktree add "${worktreePath}" -b ${slug} 2>/dev/null ; cd "${worktreePath}"`;
-            execSync(`tmux send-keys -t '${paneInfo}' '${worktreeCmd}' Enter`, {
-                stdio: "pipe",
-            });
-            // Wait longer for worktree creation and cd to complete
-            // This is critical - if we don't wait long enough, Claude will start in the wrong directory
-            await new Promise((resolve) => setTimeout(resolve, 2500));
-            // Verify we're in the worktree directory by sending pwd command
-            execSync(`tmux send-keys -t '${paneInfo}' 'echo "Worktree created at:" && pwd' Enter`, { stdio: "pipe" });
-            await new Promise((resolve) => setTimeout(resolve, 500));
-            setStatusMessage(agent
-                ? `Worktree created, launching ${agent === "opencode" ? "opencode" : "Claude"}...`
-                : "Worktree created.");
-        }
-        catch (error) {
-            // Log error but continue - worktree creation is essential
-            setStatusMessage(`Warning: Worktree issue: ${error}`);
-            // Even if worktree creation failed, try to cd to the directory in case it exists
-            execSync(`tmux send-keys -t '${paneInfo}' 'cd "${worktreePath}" 2>/dev/null || (echo "ERROR: Failed to create/enter worktree ${slug}" && pwd)' Enter`, { stdio: "pipe" });
-            await new Promise((resolve) => setTimeout(resolve, 1000));
-        }
-        // Prepare and send the agent command
-        let escapedCmd = "";
-        if (agent === "claude") {
-            // Claude should always be launched AFTER we're in the worktree directory
-            let claudeCmd;
-            if (prompt && prompt.trim()) {
-                const escapedPrompt = prompt
-                    .replace(/\\/g, "\\\\")
-                    .replace(/"/g, '\\"')
-                    .replace(/`/g, "\\`")
-                    .replace(/\$/g, "\\$");
-                claudeCmd = `claude "${escapedPrompt}" --permission-mode=acceptEdits`;
-            }
-            else {
-                claudeCmd = `claude --permission-mode=acceptEdits`;
-            }
-            // Send Claude command to new pane
-            escapedCmd = claudeCmd.replace(/'/g, "'\\''");
-            execSync(`tmux send-keys -t '${paneInfo}' '${escapedCmd}'`, {
-                stdio: "pipe",
-            });
-            execSync(`tmux send-keys -t '${paneInfo}' Enter`, { stdio: "pipe" });
-        }
-        else if (agent === "opencode") {
-            // opencode: start the TUI, then paste the prompt and submit
-            const openCoderCmd = `opencode`;
-            const escapedOpenCmd = openCoderCmd.replace(/'/g, "'\\''");
-            execSync(`tmux send-keys -t '${paneInfo}' '${escapedOpenCmd}'`, {
-                stdio: "pipe",
-            });
-            execSync(`tmux send-keys -t '${paneInfo}' Enter`, { stdio: "pipe" });
-            if (prompt && prompt.trim()) {
-                await new Promise((resolve) => setTimeout(resolve, 1500));
-                const bufName = `dmux_prompt_${Date.now()}`;
-                const promptEsc = prompt.replace(/\\/g, "\\\\").replace(/'/g, "'\\''");
-                execSync(`tmux set-buffer -b '${bufName}' -- '${promptEsc}'`, {
-                    stdio: "pipe",
-                });
-                execSync(`tmux paste-buffer -b '${bufName}' -t '${paneInfo}'`, {
-                    stdio: "pipe",
-                });
-                await new Promise((resolve) => setTimeout(resolve, 200));
-                execSync(`tmux delete-buffer -b '${bufName}'`, { stdio: "pipe" });
-                execSync(`tmux send-keys -t '${paneInfo}' Enter`, { stdio: "pipe" });
-            }
-        }
-        if (agent === "claude") {
-            // Monitor for Claude Code trust prompt and auto-respond
-            const autoApproveTrust = async () => {
-                // Wait for Claude to start up before checking for prompts
-                await new Promise((resolve) => setTimeout(resolve, 800));
-                const maxChecks = 100; // 100 checks * 100ms = 10 seconds total
-                const checkInterval = 100; // Check every 100ms
-                let lastContent = "";
-                let stableContentCount = 0;
-                let promptHandled = false;
-                // More comprehensive trust prompt patterns
-                const trustPromptPatterns = [
-                    /Do you trust the files in this folder\?/i,
-                    /Trust the files in this workspace\?/i,
-                    /Do you trust the authors of the files/i,
-                    /Do you want to trust this workspace\?/i,
-                    /trust.*files.*folder/i,
-                    /trust.*workspace/i,
-                    /Do you trust/i,
-                    /Trust this folder/i,
-                    /trust.*directory/i,
-                    /permission.*grant/i,
-                    /allow.*access/i,
-                    /workspace.*trust/i,
-                    /accept.*edits/i, // Claude's accept edits prompt
-                    /permission.*mode/i, // Permission mode prompt
-                    /allow.*claude/i, // Allow Claude prompt
-                    /\[y\/n\]/i, // Common yes/no prompt pattern
-                    /\(y\/n\)/i,
-                    /Yes\/No/i,
-                    /\[Y\/n\]/i, // Default yes pattern
-                    /press.*enter.*accept/i, // Press enter to accept
-                    /press.*enter.*continue/i, // Press enter to continue
-                    /❯\s*1\.\s*Yes,\s*proceed/i, // New Claude numbered menu format
-                    /Enter to confirm.*Esc to exit/i, // New Claude confirmation format
-                    /1\.\s*Yes,\s*proceed/i, // Yes proceed option
-                    /2\.\s*No,\s*exit/i, // No exit option
-                ];
-                for (let i = 0; i < maxChecks; i++) {
-                    await new Promise((resolve) => setTimeout(resolve, checkInterval));
-                    try {
-                        // Capture the pane content
-                        const paneContent = capturePaneContent(paneInfo, 30);
-                        if (i % 10 === 0) {
-                            // Log every 10 checks (every second)
-                        }
-                        // Check if content has stabilized (same for 3 checks = prompt is waiting)
-                        if (paneContent === lastContent) {
-                            stableContentCount++;
-                        }
-                        else {
-                            stableContentCount = 0;
-                            lastContent = paneContent;
-                        }
-                        // Look for trust prompt in the current content
-                        const hasTrustPrompt = trustPromptPatterns.some((pattern) => pattern.test(paneContent));
-                        // Also check if we see specific Claude permission text
-                        const hasClaudePermissionPrompt = paneContent.includes("Do you trust") ||
-                            paneContent.includes("trust the files") ||
-                            paneContent.includes("permission") ||
-                            paneContent.includes("allow") ||
-                            (paneContent.includes("folder") && paneContent.includes("?"));
-                        if ((hasTrustPrompt || hasClaudePermissionPrompt) &&
-                            !promptHandled) {
-                            // Content is stable and we found a prompt
-                            if (stableContentCount >= 2) {
-                                // Check if this is the new Claude numbered menu format
-                                const isNewClaudeFormat = /❯\s*1\.\s*Yes,\s*proceed/i.test(paneContent) ||
-                                    /Enter to confirm.*Esc to exit/i.test(paneContent);
-                                if (isNewClaudeFormat) {
-                                    // For new Claude format, just press Enter to confirm default "Yes, proceed"
-                                    execSync(`tmux send-keys -t '${paneInfo}' Enter`, {
-                                        stdio: "pipe",
-                                    });
-                                }
-                                else {
-                                    // Try multiple response methods for older formats
-                                    // Method 1: Send 'y' followed by Enter (most explicit)
-                                    execSync(`tmux send-keys -t '${paneInfo}' 'y'`, {
-                                        stdio: "pipe",
-                                    });
-                                    await new Promise((resolve) => setTimeout(resolve, 50));
-                                    execSync(`tmux send-keys -t '${paneInfo}' Enter`, {
-                                        stdio: "pipe",
-                                    });
-                                    // Method 2: Just Enter (if it's a yes/no with default yes)
-                                    await new Promise((resolve) => setTimeout(resolve, 100));
-                                    execSync(`tmux send-keys -t '${paneInfo}' Enter`, {
-                                        stdio: "pipe",
-                                    });
-                                }
-                                // Mark as handled to avoid duplicate responses
-                                promptHandled = true;
-                                // Wait and check if prompt is gone
-                                await new Promise((resolve) => setTimeout(resolve, 500));
-                                // Verify the prompt is gone
-                                const updatedContent = capturePaneContent(paneInfo, 10);
-                                // If trust prompt is gone, check if we need to resend the Claude command
-                                const promptGone = !trustPromptPatterns.some((p) => p.test(updatedContent));
-                                if (promptGone) {
-                                    // Check if Claude is running or if we need to restart it
-                                    const claudeRunning = updatedContent.includes("Claude") ||
-                                        updatedContent.includes("claude") ||
-                                        updatedContent.includes("Assistant") ||
-                                        (prompt &&
-                                            updatedContent.includes(prompt.substring(0, Math.min(20, prompt.length))));
-                                    if (!claudeRunning && !updatedContent.includes("$")) {
-                                        await new Promise((resolve) => setTimeout(resolve, 300));
-                                        execSync(`tmux send-keys -t '${paneInfo}' '${escapedCmd}'`, { stdio: "pipe" });
-                                        execSync(`tmux send-keys -t '${paneInfo}' Enter`, {
-                                            stdio: "pipe",
-                                        });
-                                    }
-                                    break;
-                                }
-                            }
-                        }
-                        // If we see Claude is already running without prompts, we're done
-                        if (!hasTrustPrompt &&
-                            !hasClaudePermissionPrompt &&
-                            (paneContent.includes("Claude") ||
-                                paneContent.includes("Assistant"))) {
-                            break;
-                        }
-                    }
-                    catch (error) {
-                        // Continue checking, errors are non-fatal
-                    }
-                }
-            };
-            // Start monitoring for trust prompt in background
-            autoApproveTrust().catch((err) => { });
-        }
-        // Keep focus on the new pane
-        execSync(`tmux select-pane -t '${paneInfo}'`, { stdio: "pipe" });
-        // Save pane info
-        const newPane = {
-            id: `dmux-${Date.now()}`,
-            slug,
-            prompt: prompt || "No initial prompt",
-            paneId: paneInfo,
-            worktreePath,
-            agent,
-        };
-        const updatedPanes = [...panes, newPane];
-        await savePanes(updatedPanes);
-        // Switch back to the original pane (where dmux is running)
-        execSync(`tmux select-pane -t '${originalPaneId}'`, { stdio: "pipe" });
-        // Re-set the title for the dmux pane
-        try {
-            execSync(`tmux select-pane -t '${originalPaneId}' -T "dmux v${packageJson.version} - ${projectName}"`, { stdio: "pipe" });
-        }
-        catch {
-            // Ignore if setting title fails
-        }
-        // Clear the screen and redraw the UI
-        process.stdout.write("\x1b[2J\x1b[H");
-        // Reset the creating pane flag and refresh
-        setIsCreatingPane(false);
-        setStatusMessage("");
-        // Force a reload of panes to ensure UI is up to date
-        await loadPanes();
-    };
-    const jumpToPane = (paneId) => {
-        try {
-            // Enable pane borders to show titles (if not already enabled)
-            try {
-                execSync(`tmux set-option -g pane-border-status top`, { stdio: "pipe" });
-            }
-            catch {
-                // Ignore if already set or fails
-            }
-            execSync(`tmux select-pane -t '${paneId}'`, { stdio: "pipe" });
-            // Clear screen after jump to remove artifacts
-            clearScreen();
-            setStatusMessage("Jumped to pane");
-            setTimeout(() => setStatusMessage(""), 2000);
-        }
-        catch {
-            setStatusMessage("Failed to jump - pane may be closed");
-            setTimeout(() => setStatusMessage(""), 2000);
-        }
-    };
-    const runCommand = async (type, pane) => {
-        if (!pane.worktreePath) {
-            setStatusMessage("No worktree path for this pane");
-            setTimeout(() => setStatusMessage(""), 2000);
-            return;
-        }
-        const command = type === "test" ? projectSettings.testCommand : projectSettings.devCommand;
-        const isFirstRun = type === "test"
-            ? !projectSettings.firstTestRun
-            : !projectSettings.firstDevRun;
-        if (!command) {
-            // No command configured, prompt user
-            setShowCommandPrompt(type);
-            return;
-        }
-        // Check if this is the first run and offer to copy non-git files
-        if (isFirstRun) {
-            // Show file copy prompt and wait for response
-            setShowFileCopyPrompt(true);
-            setCurrentCommandType(type);
-            setStatusMessage(`First time running ${type} command...`);
-            // Return here - the actual command will be run after user responds to prompt
-            return;
-        }
-        try {
-            setRunningCommand(true);
-            setStatusMessage(`Starting ${type} in background window...`);
-            // Kill existing window if present
-            const existingWindowId = type === "test" ? pane.testWindowId : pane.devWindowId;
-            if (existingWindowId) {
-                try {
-                    execSync(`tmux kill-window -t '${existingWindowId}'`, {
-                        stdio: "pipe",
-                    });
-                }
-                catch { }
-            }
-            // Create a new background window for the command
-            const windowName = `${pane.slug}-${type}`;
-            const windowId = execSync(`tmux new-window -d -n '${windowName}' -P -F '#{window_id}'`, { encoding: "utf-8", stdio: "pipe" }).trim();
-            // Create a log file to capture output
-            const logFile = `/tmp/dmux-${pane.id}-${type}.log`;
-            // Build the command with output capture
-            const fullCommand = type === "test"
-                ? `cd "${pane.worktreePath}" && ${command} 2>&1 | tee ${logFile}`
-                : `cd "${pane.worktreePath}" && ${command} 2>&1 | tee ${logFile}`;
-            // Send the command to the new window
-            execSync(`tmux send-keys -t '${windowId}' '${fullCommand.replace(/'/g, "'\\''")}'`, { stdio: "pipe" });
-            execSync(`tmux send-keys -t '${windowId}' Enter`, { stdio: "pipe" });
-            // Update pane with window info
-            const updatedPane = {
-                ...pane,
-                [type === "test" ? "testWindowId" : "devWindowId"]: windowId,
-                [type === "test" ? "testStatus" : "devStatus"]: "running",
-            };
-            const updatedPanes = panes.map((p) => p.id === pane.id ? updatedPane : p);
-            await savePanes(updatedPanes);
-            // Start monitoring the output
-            if (type === "test") {
-                // For tests, monitor for completion
-                setTimeout(() => monitorTestOutput(pane.id, logFile), 2000);
-            }
-            else {
-                // For dev, monitor for server URL
-                setTimeout(() => monitorDevOutput(pane.id, logFile), 2000);
-            }
-            setRunningCommand(false);
-            setStatusMessage(`${type === "test" ? "Test" : "Dev server"} started in background`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-        catch (error) {
-            setRunningCommand(false);
-            setStatusMessage(`Failed to run ${type} command`);
-            setTimeout(() => setStatusMessage(""), 3000);
-        }
-    };
+    // jumpToPane and runCommand functions removed - now handled by action system and pane runner
     // Update handling moved to useAutoUpdater
-    // Helper function to clear screen artifacts
-    const clearScreen = () => {
-        // CRITICAL: Force Ink to re-render FIRST, before clearing
-        // This prevents blank screen by ensuring React starts rendering immediately
-        setForceRepaintTrigger((prev) => prev + 1);
-        // Multiple clearing strategies to prevent artifacts
-        // 1. Clear screen with ANSI codes
-        process.stdout.write("\x1b[2J\x1b[H");
-        // 2. Clear tmux history
-        try {
-            execSync("tmux clear-history", { stdio: "pipe" });
-        }
-        catch { }
-        // 3. Force tmux to refresh the display
-        try {
-            execSync("tmux refresh-client", { stdio: "pipe" });
-        }
-        catch { }
-    };
+    // clearScreen function removed - no longer used (was only used by removed jumpToPane function)
     // Cleanup function for exit
     const cleanExit = () => {
         // Clear screen before exiting Ink
@@ -1636,15 +472,16 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         // Exit the Ink app (this cleans up the React tree)
         exit();
         // Give Ink a moment to clean up its rendering, then do final cleanup
-        setTimeout(() => {
+        setTimeout(async () => {
             // Multiple aggressive clearing strategies
             process.stdout.write("\x1b[2J\x1b[H"); // Clear screen and move cursor to home
             process.stdout.write("\x1b[3J"); // Clear scrollback buffer
             process.stdout.write("\x1b[0m"); // Reset all attributes
             // Clear tmux history and pane
             try {
-                execSync("tmux clear-history", { stdio: "pipe" });
-                execSync("tmux send-keys C-l", { stdio: "pipe" });
+                const tmuxService = TmuxService.getInstance();
+                tmuxService.clearHistorySync();
+                await tmuxService.sendKeys("", "C-l");
             }
             catch { }
             // One more final clear
@@ -1655,244 +492,46 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
             process.exit(0);
         }, 100);
     };
-    useInput(async (input, key) => {
-        const logService = LogService.getInstance();
-        // Log all input for debugging (only first 50 chars to avoid spam)
-        const inputPreview = input.length > 50 ? input.substring(0, 50) + "..." : input;
-        logService.debug(`Input: "${inputPreview}"`, "InputDebug");
-        // Ignore input temporarily after popup operations (prevents buffered keys from being processed)
-        if (ignoreInput) {
-            return;
-        }
-        // Handle Ctrl+C for quit confirmation (must be first, before any other checks)
-        if (key.ctrl && input === "c") {
-            if (quitConfirmMode) {
-                // Second Ctrl+C - actually quit
-                cleanExit();
-            }
-            else {
-                // First Ctrl+C - show confirmation
-                setQuitConfirmMode(true);
-                // Reset after 3 seconds if user doesn't press Ctrl+C again
-                setTimeout(() => {
-                    setQuitConfirmMode(false);
-                }, 3000);
-            }
-            return;
-        }
-        if (isCreatingPane || runningCommand || isUpdating || isLoading) {
-            // Disable input while performing operations or loading
-            return;
-        }
-        // Handle quit confirm mode - ESC cancels it
-        if (quitConfirmMode) {
-            if (key.escape) {
-                setQuitConfirmMode(false);
-                return;
-            }
-            // Allow other inputs to continue (don't return early)
-        }
-        if (showFileCopyPrompt) {
-            if (input === "y" || input === "Y") {
-                setShowFileCopyPrompt(false);
-                const selectedPane = panes[selectedIndex];
-                if (selectedPane && selectedPane.worktreePath && currentCommandType) {
-                    await copyNonGitFiles(selectedPane.worktreePath);
-                    // Mark as not first run and continue with command
-                    const newSettings = {
-                        ...projectSettings,
-                        [currentCommandType === "test" ? "firstTestRun" : "firstDevRun"]: true,
-                    };
-                    await saveSettings(newSettings);
-                    // Now run the actual command
-                    await runCommandInternal(currentCommandType, selectedPane);
-                }
-                setCurrentCommandType(null);
-            }
-            else if (input === "n" || input === "N" || key.escape) {
-                setShowFileCopyPrompt(false);
-                const selectedPane = panes[selectedIndex];
-                if (selectedPane && currentCommandType) {
-                    // Mark as not first run and continue without copying
-                    const newSettings = {
-                        ...projectSettings,
-                        [currentCommandType === "test" ? "firstTestRun" : "firstDevRun"]: true,
-                    };
-                    await saveSettings(newSettings);
-                    // Now run the actual command
-                    await runCommandInternal(currentCommandType, selectedPane);
-                }
-                setCurrentCommandType(null);
-            }
-            return;
-        }
-        if (showCommandPrompt) {
-            if (key.escape) {
-                setShowCommandPrompt(null);
-                setCommandInput("");
-            }
-            else if (key.return) {
-                if (commandInput.trim() === "") {
-                    // If empty, suggest a default command based on package manager
-                    const suggested = await suggestCommand(showCommandPrompt);
-                    if (suggested) {
-                        setCommandInput(suggested);
-                    }
-                }
-                else {
-                    // User provided manual command
-                    const newSettings = {
-                        ...projectSettings,
-                        [showCommandPrompt === "test" ? "testCommand" : "devCommand"]: commandInput.trim(),
-                    };
-                    await saveSettings(newSettings);
-                    const selectedPane = panes[selectedIndex];
-                    if (selectedPane) {
-                        // Check if first run
-                        const isFirstRun = showCommandPrompt === "test"
-                            ? !projectSettings.firstTestRun
-                            : !projectSettings.firstDevRun;
-                        if (isFirstRun) {
-                            setCurrentCommandType(showCommandPrompt);
-                            setShowCommandPrompt(null);
-                            setShowFileCopyPrompt(true);
-                        }
-                        else {
-                            await runCommandInternal(showCommandPrompt, selectedPane);
-                            setShowCommandPrompt(null);
-                            setCommandInput("");
-                        }
-                    }
-                    else {
-                        setShowCommandPrompt(null);
-                        setCommandInput("");
-                    }
-                }
-            }
-            return;
-        }
-        // Handle directional navigation with spatial awareness based on card grid layout
-        if (key.upArrow || key.downArrow || key.leftArrow || key.rightArrow) {
-            let targetIndex = null;
-            if (key.upArrow) {
-                targetIndex = findCardInDirection(selectedIndex, "up");
-            }
-            else if (key.downArrow) {
-                targetIndex = findCardInDirection(selectedIndex, "down");
-            }
-            else if (key.leftArrow) {
-                targetIndex = findCardInDirection(selectedIndex, "left");
-            }
-            else if (key.rightArrow) {
-                targetIndex = findCardInDirection(selectedIndex, "right");
-            }
-            if (targetIndex !== null) {
-                setSelectedIndex(targetIndex);
-            }
-            return;
-        }
-        if (input === "m" && selectedIndex < panes.length) {
-            // Open kebab menu popup for selected pane
-            await launchKebabMenuPopup(selectedIndex);
-        }
-        else if (input === "s") {
-            // Open settings popup
-            await launchSettingsPopup();
-        }
-        else if (input === "l") {
-            // Open logs popup
-            await launchLogsPopup();
-        }
-        else if (input === "?") {
-            // Open keyboard shortcuts popup
-            await launchShortcutsPopup();
-        }
-        else if (input === "L" && controlPaneId) {
-            // Reset layout to sidebar configuration (Shift+L)
-            enforceControlPaneSize(controlPaneId, SIDEBAR_WIDTH);
-            setStatusMessage("Layout reset");
-            setTimeout(() => setStatusMessage(""), 2000);
-        }
-        else if (input === "q") {
-            cleanExit();
-        }
-        else if (input === "r" && server) {
-            // Handle remote tunnel
-            if (tunnelUrl) {
-                // Tunnel exists - open popup with QR code
-                await launchRemotePopup();
-            }
-            else if (!tunnelCreating) {
-                // Start tunnel creation
-                setTunnelCreating(true);
-                (async () => {
-                    try {
-                        const url = await server.startTunnel();
-                        setTunnelUrl(url);
-                    }
-                    catch (error) {
-                        setStatusMessage(`Failed to create tunnel: ${error.message}`);
-                        setTimeout(() => setStatusMessage(""), 3000);
-                    }
-                    finally {
-                        setTunnelCreating(false);
-                    }
-                })();
-            }
-            // If tunnelCreating is true, do nothing (already creating)
-            return;
-        }
-        else if (!isLoading &&
-            (input === "n" || (key.return && selectedIndex === panes.length))) {
-            // Launch popup modal for new pane
-            await launchNewPanePopup();
-            return;
-        }
-        else if (!isLoading &&
-            (input === "t" || (key.return && selectedIndex === panes.length + 1))) {
-            // Create a new terminal pane without an agent
-            try {
-                setIsCreatingPane(true);
-                setStatusMessage("Creating terminal pane...");
-                // Create a simple tmux pane split
-                const paneInfo = execSync(`tmux split-window -h -P -F '#{pane_id}'`, {
-                    encoding: "utf-8",
-                }).trim();
-                // Wait for pane creation to settle
-                await new Promise((resolve) => setTimeout(resolve, 300));
-                // The shell pane will be automatically detected by the shell pane detection system
-                // No need to manually add it to the panes array
-                setIsCreatingPane(false);
-                setStatusMessage("Terminal pane created");
-                setTimeout(() => setStatusMessage(""), 2000);
-                // Force a reload to pick up the new shell pane
-                await loadPanes();
-            }
-            catch (error) {
-                setIsCreatingPane(false);
-                setStatusMessage(`Failed to create terminal pane: ${error.message}`);
-                setTimeout(() => setStatusMessage(""), 3000);
-            }
-            return;
-        }
-        else if (input === "j" && selectedIndex < panes.length) {
-            // Jump to pane (NEW: using action system)
-            StateManager.getInstance().setDebugMessage(`Jumping to pane: ${panes[selectedIndex].slug}`);
-            setTimeout(() => StateManager.getInstance().setDebugMessage(""), 2000);
-            actionSystem.executeAction(PaneAction.VIEW, panes[selectedIndex]);
-        }
-        else if (input === "x" && selectedIndex < panes.length) {
-            // Close pane (NEW: using action system)
-            StateManager.getInstance().setDebugMessage(`Closing pane: ${panes[selectedIndex].slug}`);
-            setTimeout(() => StateManager.getInstance().setDebugMessage(""), 2000);
-            actionSystem.executeAction(PaneAction.CLOSE, panes[selectedIndex]);
-        }
-        else if (key.return && selectedIndex < panes.length) {
-            // Jump to pane (NEW: using action system)
-            StateManager.getInstance().setDebugMessage(`Jumping to pane: ${panes[selectedIndex].slug}`);
-            setTimeout(() => StateManager.getInstance().setDebugMessage(""), 2000);
-            actionSystem.executeAction(PaneAction.VIEW, panes[selectedIndex]);
-        }
+    // Input handling - extracted to dedicated hook
+    useInputHandling({
+        panes,
+        selectedIndex,
+        setSelectedIndex,
+        isCreatingPane,
+        setIsCreatingPane,
+        runningCommand,
+        isUpdating,
+        isLoading,
+        ignoreInput,
+        quitConfirmMode,
+        setQuitConfirmMode,
+        showCommandPrompt,
+        setShowCommandPrompt,
+        commandInput,
+        setCommandInput,
+        showFileCopyPrompt,
+        setShowFileCopyPrompt,
+        currentCommandType,
+        setCurrentCommandType,
+        projectSettings,
+        saveSettings,
+        settingsManager,
+        tunnelUrl,
+        setTunnelUrl,
+        tunnelCreating,
+        setTunnelCreating,
+        setTunnelCopied,
+        popupManager,
+        actionSystem,
+        server,
+        controlPaneId,
+        setStatusMessage,
+        copyNonGitFiles,
+        runCommandInternal,
+        handlePaneCreationWithAgent,
+        loadPanes,
+        cleanExit,
+        findCardInDirection,
     });
     // Calculate available height for content (terminal height - footer lines - active status messages)
     // Footer height varies based on state:
@@ -1949,21 +588,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
                     : actionSystem.actionState.statusType === "success"
                         ? "green"
                         : "cyan" }, actionSystem.actionState.statusMessage))),
-        React.createElement(FooterHelp, { show: !showCommandPrompt, showRemoteKey: !!server, quitConfirmMode: quitConfirmMode, hasSidebarLayout: !!controlPaneId, serverPort: serverPort, unreadErrorCount: unreadErrorCount, unreadWarningCount: unreadWarningCount, localIp: localIp, tunnelUrl: tunnelUrl, tunnelCreating: tunnelCreating, tunnelCopied: tunnelCopied, tunnelSpinner: (() => {
-                const spinnerFrames = [
-                    "⠋",
-                    "⠙",
-                    "⠹",
-                    "⠸",
-                    "⠼",
-                    "⠴",
-                    "⠦",
-                    "⠧",
-                    "⠇",
-                    "⠏",
-                ];
-                return spinnerFrames[tunnelSpinnerFrame];
-            })(), gridInfo: (() => {
+        React.createElement(FooterHelp, { show: !showCommandPrompt, showRemoteKey: !!server, quitConfirmMode: quitConfirmMode, hasSidebarLayout: !!controlPaneId, serverPort: serverPort, unreadErrorCount: unreadErrorCount, unreadWarningCount: unreadWarningCount, localIp: localIp, tunnelUrl: tunnelUrl, tunnelCreating: tunnelCreating, tunnelCopied: tunnelCopied, tunnelSpinner: tunnelState.getSpinnerChar(), gridInfo: (() => {
                 if (!process.env.DEBUG_DMUX)
                     return undefined;
                 const cols = Math.max(1, Math.floor(terminalWidth / 37));