dmux 2.2.0 → 3.0.0

package/dist/DmuxApp.js

@@ -11,21 +11,22 @@ import useNavigation from './hooks/useNavigation.js';
 import useAutoUpdater from './hooks/useAutoUpdater.js';
 import useAgentDetection from './hooks/useAgentDetection.js';
 import useAgentStatus from './hooks/useAgentStatus.js';
-import useWorktreeActions from './hooks/useWorktreeActions.js';
 import usePaneRunner from './hooks/usePaneRunner.js';
 import usePaneCreation from './hooks/usePaneCreation.js';
+import useActionSystem from './hooks/useActionSystem.js';
 // Utils
 import { applySmartLayout } from './utils/tmux.js';
 import { suggestCommand } from './utils/commands.js';
 import { generateSlug } from './utils/slug.js';
 import { getMainBranch } from './utils/git.js';
+import { StateManager } from './shared/StateManager.js';
+import { getStatusDetector } from './services/StatusDetector.js';
+import { PaneAction, getAvailableActions } from './actions/index.js';
 const require = createRequire(import.meta.url);
 const packageJson = require('../package.json');
 import PanesGrid from './components/PanesGrid.js';
 import NewPaneDialog from './components/NewPaneDialog.js';
 import AgentChoiceDialog from './components/AgentChoiceDialog.js';
-import CloseOptionsDialog from './components/CloseOptionsDialog.js';
-import MergeConfirmationDialog from './components/MergeConfirmationDialog.js';
 import CommandPromptDialog from './components/CommandPromptDialog.js';
 import FileCopyPrompt from './components/FileCopyPrompt.js';
 import LoadingIndicator from './components/LoadingIndicator.js';
@@ -33,27 +34,33 @@ import RunningIndicator from './components/RunningIndicator.js';
 import UpdatingIndicator from './components/UpdatingIndicator.js';
 import CreatingIndicator from './components/CreatingIndicator.js';
 import FooterHelp from './components/FooterHelp.js';
-import MergePane from './MergePane.js';
-const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdater }) => {
+import QRCode from './components/QRCode.js';
+import KebabMenu from './components/KebabMenu.js';
+import ActionChoiceDialog from './components/ActionChoiceDialog.js';
+import ActionConfirmDialog from './components/ActionConfirmDialog.js';
+import ActionInputDialog from './components/ActionInputDialog.js';
+import ActionProgressDialog from './components/ActionProgressDialog.js';
+const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdater, serverPort, server }) => {
     /* panes state moved to usePanes */
     const [selectedIndex, setSelectedIndex] = useState(0);
     const [showNewPaneDialog, setShowNewPaneDialog] = useState(false);
     const [newPanePrompt, setNewPanePrompt] = useState('');
     const [statusMessage, setStatusMessage] = useState('');
-    const [showMergeConfirmation, setShowMergeConfirmation] = useState(false);
-    const [mergedPane, setMergedPane] = useState(null);
-    const [showMergePane, setShowMergePane] = useState(false);
-    const [mergingPane, setMergingPane] = useState(null);
-    const [showCloseOptions, setShowCloseOptions] = useState(false);
-    const [selectedCloseOption, setSelectedCloseOption] = useState(0);
-    const [closingPane, setClosingPane] = useState(null);
     const [isCreatingPane, setIsCreatingPane] = useState(false);
+    const [showQRCode, setShowQRCode] = useState(false);
+    const [tunnelUrl, setTunnelUrl] = useState(null);
+    const [isCreatingTunnel, setIsCreatingTunnel] = 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);
+    const [showKebabMenu, setShowKebabMenu] = useState(false);
+    const [kebabMenuPaneIndex, setKebabMenuPaneIndex] = useState(null);
+    const [kebabMenuOption, setKebabMenuOption] = useState(0);
+    const [kebabMenuActions, setKebabMenuActions] = useState([]);
     // Update state handled by hook
     const { updateInfo, showUpdateDialog, isUpdating, performUpdate, skipUpdate, dismissUpdate, updateAvailable } = useAutoUpdater(autoUpdater, setStatusMessage);
     const { exit } = useApp();
@@ -64,17 +71,28 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
     const [pendingPrompt, setPendingPrompt] = useState('');
     // Track terminal dimensions for responsive layout
     const terminalWidth = useTerminalWidth();
-    // Panes state and persistence
-    const skipLoading = showNewPaneDialog || showMergeConfirmation || showCloseOptions ||
-        !!showCommandPrompt || showFileCopyPrompt || showMergePane;
-    const { panes, setPanes, isLoading, loadPanes, savePanes } = usePanes(panesFile, skipLoading);
-    // Worktree actions
-    const { closePane, mergeWorktree, mergeAndPrune, deleteUnsavedChanges, handleCloseOption } = useWorktreeActions({
+    // 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());
+    // Action system
+    const actionSystem = useActionSystem({
         panes,
         savePanes,
-        setStatusMessage,
-        setShowMergeConfirmation,
-        setMergedPane,
+        sessionName,
+        projectName,
+        onPaneRemove: (paneId) => {
+            // Mark this pane as intentionally closed
+            intentionallyClosedPanes.current.add(paneId);
+            const updated = panes.filter(p => p.id !== paneId);
+            setPanes(updated);
+            // Clean up the tracking after a delay (in case of race conditions)
+            setTimeout(() => {
+                intentionallyClosedPanes.current.delete(paneId);
+            }, 5000);
+        },
     });
     // Pane runner
     const { copyNonGitFiles, runCommandInternal, monitorTestOutput, monitorDevOutput, attachBackgroundWindow } = usePaneRunner({
@@ -94,32 +112,88 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
         setNewPanePrompt,
         loadPanes,
         panesFile,
+        availableAgents,
     });
+    // Listen for status updates with analysis data and merge into panes
+    useEffect(() => {
+        const statusDetector = getStatusDetector();
+        const handleStatusUpdate = (event) => {
+            setPanes(prevPanes => {
+                const updatedPanes = prevPanes.map(pane => {
+                    if (pane.id === event.paneId) {
+                        const updated = {
+                            ...pane,
+                            agentStatus: event.status,
+                        };
+                        // Only update analysis fields if they're present in the event (not undefined)
+                        // This prevents simple status changes from overwriting PaneAnalyzer results
+                        if (event.optionsQuestion !== undefined) {
+                            updated.optionsQuestion = event.optionsQuestion;
+                        }
+                        if (event.options !== undefined) {
+                            updated.options = event.options;
+                        }
+                        if (event.potentialHarm !== undefined) {
+                            updated.potentialHarm = event.potentialHarm;
+                        }
+                        if (event.summary !== undefined) {
+                            updated.agentSummary = event.summary;
+                        }
+                        if (event.analyzerError !== undefined) {
+                            updated.analyzerError = event.analyzerError;
+                        }
+                        // Clear option dialog data when transitioning away from 'waiting' state
+                        if (event.status !== 'waiting' && pane.agentStatus === 'waiting') {
+                            updated.optionsQuestion = undefined;
+                            updated.options = undefined;
+                            updated.potentialHarm = undefined;
+                        }
+                        // Clear summary when transitioning away from 'idle' state
+                        if (event.status !== 'idle' && pane.agentStatus === 'idle') {
+                            updated.agentSummary = undefined;
+                        }
+                        // Clear analyzer error when successfully getting a new analysis
+                        // or when transitioning to 'working' status
+                        if (event.status === 'working') {
+                            updated.analyzerError = undefined;
+                        }
+                        else if (event.status === 'waiting' || event.status === 'idle') {
+                            if (event.analyzerError === undefined && (event.optionsQuestion || event.summary)) {
+                                updated.analyzerError = undefined;
+                            }
+                        }
+                        return updated;
+                    }
+                    return pane;
+                });
+                // Persist to disk - ConfigWatcher will handle syncing to StateManager
+                savePanes(updatedPanes).catch(err => {
+                    console.error('Failed to save panes after status update:', err);
+                });
+                return updatedPanes;
+            });
+        };
+        statusDetector.on('status-updated', handleStatusUpdate);
+        return () => {
+            statusDetector.off('status-updated', handleStatusUpdate);
+        };
+    }, [setPanes, savePanes]);
+    // Note: No need to sync panes with StateManager here.
+    // The ConfigWatcher automatically updates StateManager when the config file changes.
+    // This prevents unnecessary SSE broadcasts on every local state update.
+    // Sync settings with StateManager
+    useEffect(() => {
+        const stateManager = StateManager.getInstance();
+        stateManager.updateSettings(projectSettings);
+    }, [projectSettings]);
     // Load panes and settings on mount and refresh periodically
     useEffect(() => {
-        // Add cleanup handlers for process termination
+        // SIGTERM should quit immediately (for process management)
         const handleTermination = () => {
-            // Clear screen multiple times to ensure no artifacts
-            process.stdout.write('\x1b[2J\x1b[H'); // Clear screen and move to home
-            process.stdout.write('\x1b[3J'); // Clear scrollback buffer
-            process.stdout.write('\n'.repeat(100)); // Push any remaining content off screen
-            // Clear tmux pane
-            try {
-                execSync('tmux clear-history', { stdio: 'pipe' });
-                execSync('tmux send-keys C-l', { stdio: 'pipe' });
-            }
-            catch { }
-            // Wait a moment for clearing to settle, then show goodbye message
-            setTimeout(() => {
-                process.stdout.write('\x1b[2J\x1b[H');
-                process.stdout.write('\n\n  dmux session ended.\n\n');
-                process.exit(0);
-            }, 100);
+            cleanExit();
         };
-        process.on('SIGINT', handleTermination);
         process.on('SIGTERM', handleTermination);
         return () => {
-            process.removeListener('SIGINT', handleTermination);
             process.removeListener('SIGTERM', handleTermination);
         };
     }, []);
@@ -133,8 +207,10 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
         if (!isLoading &&
             panes.length === 0 &&
             !showNewPaneDialog &&
-            !showMergeConfirmation &&
-            !showCloseOptions &&
+            !actionSystem.actionState.showConfirmDialog &&
+            !actionSystem.actionState.showChoiceDialog &&
+            !actionSystem.actionState.showInputDialog &&
+            !actionSystem.actionState.showProgressDialog &&
             !showCommandPrompt &&
             !showFileCopyPrompt &&
             !showAgentChoiceDialog &&
@@ -143,7 +219,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
             !isUpdating) {
             setShowNewPaneDialog(true);
         }
-    }, [isLoading, panes.length, showNewPaneDialog, showMergeConfirmation, showCloseOptions, showCommandPrompt, showFileCopyPrompt, showAgentChoiceDialog, isCreatingPane, runningCommand, isUpdating]);
+    }, [isLoading, panes.length, showNewPaneDialog, actionSystem.actionState.showConfirmDialog, actionSystem.actionState.showChoiceDialog, actionSystem.actionState.showInputDialog, actionSystem.actionState.showProgressDialog, showCommandPrompt, showFileCopyPrompt, showAgentChoiceDialog, isCreatingPane, runningCommand, isUpdating]);
     // Update checking moved to useAutoUpdater
     // Set default agent choice when detection completes
     useEffect(() => {
@@ -154,7 +230,18 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
     // Monitor agent status across panes (returns a map of pane ID to status)
     const agentStatuses = useAgentStatus({
         panes,
-        suspend: showNewPaneDialog || showMergeConfirmation || showCloseOptions || !!showCommandPrompt || showFileCopyPrompt || showMergePane,
+        suspend: showNewPaneDialog || actionSystem.actionState.showConfirmDialog || actionSystem.actionState.showChoiceDialog || actionSystem.actionState.showInputDialog || actionSystem.actionState.showProgressDialog || !!showCommandPrompt || showFileCopyPrompt,
+        onPaneRemoved: (paneId) => {
+            // Check if this pane was intentionally closed
+            // If so, don't re-save - the close action already handled it
+            if (intentionallyClosedPanes.current.has(paneId)) {
+                return;
+            }
+            // Pane was removed unexpectedly (e.g., user killed tmux pane manually)
+            // Remove it from our tracking
+            const updatedPanes = panes.filter(p => p.id !== paneId);
+            savePanes(updatedPanes);
+        },
     });
     // loadPanes moved to usePanes
     // getPanePositions moved to utils/tmux
@@ -288,7 +375,6 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
         if (agent === 'claude') {
             // Monitor for Claude Code trust prompt and auto-respond
             const autoApproveTrust = async () => {
-                console.error('[TRUST DEBUG] Starting autoApproveTrust monitoring...');
                 // 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
@@ -331,7 +417,6 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
                         const paneContent = execSync(`tmux capture-pane -t '${paneInfo}' -p -S -30`, // Capture last 30 lines
                         { encoding: 'utf-8', stdio: 'pipe' });
                         if (i % 10 === 0) { // Log every 10 checks (every second)
-                            console.error(`[TRUST DEBUG] Check ${i + 1}/${maxChecks}, content preview: "${paneContent.substring(0, 100).replace(/\n/g, '\\n')}"...`);
                         }
                         // Check if content has stabilized (same for 3 checks = prompt is waiting)
                         if (paneContent === lastContent) {
@@ -350,29 +435,23 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
                             paneContent.includes('allow') ||
                             (paneContent.includes('folder') && paneContent.includes('?'));
                         if ((hasTrustPrompt || hasClaudePermissionPrompt) && !promptHandled) {
-                            console.error(`[TRUST DEBUG] Trust prompt detected! Pattern match: ${hasTrustPrompt}, Permission text: ${hasClaudePermissionPrompt}, Stable count: ${stableContentCount}`);
-                            console.error(`[TRUST DEBUG] Content that triggered detection: "${paneContent}"`);
                             // Content is stable and we found a prompt
                             if (stableContentCount >= 2) {
-                                console.error('[TRUST DEBUG] Content is stable, attempting to auto-approve trust prompt...');
                                 // 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"
-                                    console.error('[TRUST DEBUG] Detected new Claude format, sending Enter to confirm default option');
                                     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)
-                                    console.error('[TRUST DEBUG] Sending "y" + Enter for legacy format');
                                     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));
-                                    console.error('[TRUST DEBUG] Sending additional Enter');
                                     execSync(`tmux send-keys -t '${paneInfo}' Enter`, { stdio: 'pipe' });
                                 }
                                 // Mark as handled to avoid duplicate responses
@@ -384,20 +463,16 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
                                 // If trust prompt is gone, check if we need to resend the Claude command
                                 const promptGone = !trustPromptPatterns.some(p => p.test(updatedContent));
                                 if (promptGone) {
-                                    console.error('[TRUST DEBUG] Trust prompt appears to be gone');
                                     // 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))));
-                                    console.error(`[TRUST DEBUG] Claude running check: ${claudeRunning}, has $: ${updatedContent.includes('$')}`);
                                     if (!claudeRunning && !updatedContent.includes('$')) {
-                                        console.error('[TRUST DEBUG] Claude not running after trust approval, restarting...');
                                         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' });
                                     }
-                                    console.error('[TRUST DEBUG] Successfully handled the trust prompt');
                                     break;
                                 }
                             }
@@ -410,13 +485,11 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
                     }
                     catch (error) {
                         // Continue checking, errors are non-fatal
-                        console.error(`[TRUST DEBUG] Error checking for trust prompt: ${error instanceof Error ? error.message : error}`);
                     }
                 }
             };
             // Start monitoring for trust prompt in background
             autoApproveTrust().catch(err => {
-                console.error(`[TRUST DEBUG] Error in autoApproveTrust: ${err instanceof Error ? err.message : err}`);
             });
         }
         // Keep focus on the new pane
@@ -425,7 +498,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
         const newPane = {
             id: `dmux-${Date.now()}`,
             slug,
-            prompt: prompt ? (prompt.substring(0, 50) + (prompt.length > 50 ? '...' : '')) : 'No initial prompt',
+            prompt: prompt || 'No initial prompt',
             paneId: paneInfo,
             worktreePath,
             agent
@@ -541,32 +614,227 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
         }
     };
     // Update handling moved to useAutoUpdater
-    // Cleanup function for exit
-    const cleanExit = () => {
-        // Clear screen multiple times to ensure no artifacts
-        process.stdout.write('\x1b[2J\x1b[H'); // Clear screen and move to home
-        process.stdout.write('\x1b[3J'); // Clear scrollback buffer
-        process.stdout.write('\n'.repeat(100)); // Push any remaining content off screen
-        // Clear tmux pane
+    // Helper function to clear screen artifacts
+    const clearScreen = () => {
+        // 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' });
-            execSync('tmux send-keys C-l', { stdio: 'pipe' });
         }
         catch { }
-        // Wait a moment for clearing to settle
+        // 3. Force tmux to refresh the display
+        try {
+            execSync('tmux refresh-client', { stdio: 'pipe' });
+        }
+        catch { }
+    };
+    // Cleanup function for exit
+    const cleanExit = () => {
+        // Clear screen before exiting Ink
+        process.stdout.write('\x1b[2J\x1b[3J\x1b[H');
+        // 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(() => {
-            // Final clear and show goodbye message
+            // 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' });
+            }
+            catch { }
+            // One more final clear
             process.stdout.write('\x1b[2J\x1b[H');
-            process.stdout.write('\n\n  dmux session ended.\n\n');
-            // Exit the app
-            exit();
+            // Show clean goodbye message
+            process.stdout.write('\n  Run dmux again to resume. Goodbye 👋\n\n');
+            // Exit process
+            process.exit(0);
         }, 100);
     };
     useInput(async (input, key) => {
-        if (isCreatingPane || runningCommand || isUpdating || isLoading) {
+        // 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 || isCreatingTunnel) {
             // Disable input while performing operations or loading
             return;
         }
+        // Handle kebab menu navigation
+        if (showKebabMenu && kebabMenuPaneIndex !== null) {
+            const currentPane = panes[kebabMenuPaneIndex];
+            const availableActions = kebabMenuActions;
+            if (key.escape) {
+                setShowKebabMenu(false);
+                setKebabMenuPaneIndex(null);
+                setKebabMenuOption(0);
+                setKebabMenuActions([]);
+                clearScreen();
+                return;
+            }
+            else if (key.upArrow) {
+                setKebabMenuOption(Math.max(0, kebabMenuOption - 1));
+                return;
+            }
+            else if (key.downArrow) {
+                setKebabMenuOption(Math.min(availableActions.length - 1, kebabMenuOption + 1));
+                return;
+            }
+            else if (key.return) {
+                // Execute the selected menu action
+                setShowKebabMenu(false);
+                clearScreen();
+                const selectedAction = availableActions[kebabMenuOption];
+                if (selectedAction) {
+                    // Use the action system to execute
+                    actionSystem.executeAction(selectedAction.id, currentPane, { mainBranch: getMainBranch() });
+                }
+                setKebabMenuPaneIndex(null);
+                setKebabMenuOption(0);
+                setKebabMenuActions([]);
+                return;
+            }
+            // Don't process other inputs while menu is open
+            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)
+        }
+        // Handle QR code view
+        if (showQRCode) {
+            if (key.escape) {
+                setShowQRCode(false);
+            }
+            return;
+        }
+        // Handle action system confirm dialog
+        if (actionSystem.actionState.showConfirmDialog) {
+            if (key.escape) {
+                if (actionSystem.actionState.onConfirmNo) {
+                    actionSystem.executeCallback(actionSystem.actionState.onConfirmNo);
+                }
+                else {
+                    actionSystem.setActionState(prev => ({ ...prev, showConfirmDialog: false }));
+                }
+                return;
+            }
+            else if (key.upArrow) {
+                actionSystem.setActionState(prev => ({
+                    ...prev,
+                    confirmSelectedIndex: Math.max(0, prev.confirmSelectedIndex - 1)
+                }));
+                return;
+            }
+            else if (key.downArrow) {
+                actionSystem.setActionState(prev => ({
+                    ...prev,
+                    confirmSelectedIndex: Math.min(1, prev.confirmSelectedIndex + 1)
+                }));
+                return;
+            }
+            else if (key.return) {
+                // Execute based on selected index
+                if (actionSystem.actionState.confirmSelectedIndex === 0) {
+                    if (actionSystem.actionState.onConfirmYes) {
+                        actionSystem.executeCallback(actionSystem.actionState.onConfirmYes);
+                    }
+                }
+                else {
+                    if (actionSystem.actionState.onConfirmNo) {
+                        actionSystem.executeCallback(actionSystem.actionState.onConfirmNo);
+                    }
+                    else {
+                        actionSystem.setActionState(prev => ({ ...prev, showConfirmDialog: false }));
+                    }
+                }
+                return;
+            }
+            else if (input === 'y' || input === 'Y') {
+                // Shortcut: yes
+                if (actionSystem.actionState.onConfirmYes) {
+                    actionSystem.executeCallback(actionSystem.actionState.onConfirmYes);
+                }
+                return;
+            }
+            else if (input === 'n' || input === 'N') {
+                // Shortcut: no
+                if (actionSystem.actionState.onConfirmNo) {
+                    actionSystem.executeCallback(actionSystem.actionState.onConfirmNo);
+                }
+                else {
+                    actionSystem.setActionState(prev => ({ ...prev, showConfirmDialog: false }));
+                }
+                return;
+            }
+            return;
+        }
+        // Handle action system input dialog
+        if (actionSystem.actionState.showInputDialog) {
+            if (key.escape) {
+                actionSystem.setActionState(prev => ({ ...prev, showInputDialog: false }));
+                return;
+            }
+            else if (key.return) {
+                if (actionSystem.actionState.onInputSubmit) {
+                    actionSystem.executeCallback(async () => actionSystem.actionState.onInputSubmit(actionSystem.actionState.inputValue));
+                }
+                return;
+            }
+            // Let CleanTextInput handle all other key events
+            return;
+        }
+        // Handle action system choice dialog
+        if (actionSystem.actionState.showChoiceDialog) {
+            if (key.escape) {
+                actionSystem.setActionState(prev => ({ ...prev, showChoiceDialog: false }));
+                return;
+            }
+            else if (key.upArrow) {
+                actionSystem.setActionState(prev => ({
+                    ...prev,
+                    choiceSelectedIndex: Math.max(0, prev.choiceSelectedIndex - 1)
+                }));
+                return;
+            }
+            else if (key.downArrow) {
+                const maxIndex = actionSystem.actionState.choiceOptions.length - 1;
+                actionSystem.setActionState(prev => ({
+                    ...prev,
+                    choiceSelectedIndex: Math.min(maxIndex, prev.choiceSelectedIndex + 1)
+                }));
+                return;
+            }
+            else if (key.return) {
+                const selectedOption = actionSystem.actionState.choiceOptions[actionSystem.actionState.choiceSelectedIndex];
+                if (selectedOption && actionSystem.actionState.onChoiceSelect) {
+                    actionSystem.executeCallback(async () => actionSystem.actionState.onChoiceSelect(selectedOption.id));
+                }
+                return;
+            }
+            return;
+        }
         if (showFileCopyPrompt) {
             if (input === 'y' || input === 'Y') {
                 setShowFileCopyPrompt(false);
@@ -667,10 +935,6 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
             }
             return;
         }
-        if (showMergePane) {
-            // MergePane handles its own input
-            return;
-        }
         if (showNewPaneDialog) {
             if (key.escape) {
                 setShowNewPaneDialog(false);
@@ -683,49 +947,6 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
             // TextInput handles other input events
             return;
         }
-        if (showMergeConfirmation) {
-            if (input === 'y' || input === 'Y') {
-                if (mergedPane) {
-                    closePane(mergedPane);
-                }
-                setShowMergeConfirmation(false);
-                setMergedPane(null);
-            }
-            else if (input === 'n' || input === 'N' || key.escape) {
-                setShowMergeConfirmation(false);
-                setMergedPane(null);
-            }
-            return;
-        }
-        if (showCloseOptions) {
-            if (key.escape) {
-                setShowCloseOptions(false);
-                setClosingPane(null);
-                setSelectedCloseOption(0);
-            }
-            else if (key.upArrow) {
-                setSelectedCloseOption(Math.max(0, selectedCloseOption - 1));
-            }
-            else if (key.downArrow) {
-                setSelectedCloseOption(Math.min(3, selectedCloseOption + 1));
-            }
-            else if (key.return && closingPane) {
-                handleCloseOption(selectedCloseOption, closingPane).then(() => {
-                    // Close the dialog after the action is performed
-                    setShowCloseOptions(false);
-                    setClosingPane(null);
-                    setSelectedCloseOption(0);
-                }).catch(error => {
-                    setStatusMessage('Failed to close pane');
-                    setTimeout(() => setStatusMessage(''), 2000);
-                    // Also close the dialog on error
-                    setShowCloseOptions(false);
-                    setClosingPane(null);
-                    setSelectedCloseOption(0);
-                });
-            }
-            return;
-        }
         // Handle directional navigation with spatial awareness based on card grid layout
         if (key.upArrow || key.downArrow || key.leftArrow || key.rightArrow) {
             let targetIndex = null;
@@ -746,9 +967,42 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
             }
             return;
         }
-        if (input === 'q') {
+        if ((input === 'm' || key.return) && selectedIndex < panes.length) {
+            // Open kebab menu for selected pane
+            const selectedPane = panes[selectedIndex];
+            const actions = getAvailableActions(selectedPane, projectSettings);
+            setKebabMenuActions(actions);
+            setShowKebabMenu(true);
+            setKebabMenuPaneIndex(selectedIndex);
+            setKebabMenuOption(0);
+        }
+        else if (input === 'q') {
             cleanExit();
         }
+        else if (input === 'r' && server) {
+            // Create tunnel if not already created, then show QR code
+            if (!tunnelUrl) {
+                setIsCreatingTunnel(true);
+                setStatusMessage('Creating tunnel...');
+                try {
+                    const url = await server.startTunnel();
+                    setTunnelUrl(url);
+                    setStatusMessage('');
+                    setShowQRCode(true);
+                }
+                catch (error) {
+                    setStatusMessage('Failed to create tunnel');
+                    setTimeout(() => setStatusMessage(''), 3000);
+                }
+                finally {
+                    setIsCreatingTunnel(false);
+                }
+            }
+            else {
+                // Tunnel already exists, just show the QR code
+                setShowQRCode(true);
+            }
+        }
         else if (!isLoading && (input === 'n' || (key.return && selectedIndex === panes.length))) {
             // Clear the prompt and show dialog in next tick to prevent 'n' bleeding through
             setNewPanePrompt('');
@@ -756,61 +1010,29 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
             return; // Consume the 'n' keystroke so it doesn't propagate
         }
         else if (input === 'j' && selectedIndex < panes.length) {
-            jumpToPane(panes[selectedIndex].paneId);
+            // Jump to pane (NEW: using action system)
+            actionSystem.executeAction(PaneAction.VIEW, panes[selectedIndex]);
         }
         else if (input === 'x' && selectedIndex < panes.length) {
-            setClosingPane(panes[selectedIndex]);
-            setShowCloseOptions(true);
-            setSelectedCloseOption(0);
-        }
-        else if (input === 'm' && selectedIndex < panes.length) {
-            setMergingPane(panes[selectedIndex]);
-            setShowMergePane(true);
-        }
-        else if (input === 't' && selectedIndex < panes.length) {
-            await runCommand('test', panes[selectedIndex]);
-        }
-        else if (input === 'd' && selectedIndex < panes.length) {
-            await runCommand('dev', panes[selectedIndex]);
-        }
-        else if (input === 'o' && selectedIndex < panes.length) {
-            const pane = panes[selectedIndex];
-            if (pane.testWindowId || pane.devWindowId) {
-                // If both exist, prefer dev (since it's usually more interactive)
-                if (pane.devWindowId && pane.devStatus === 'running') {
-                    await attachBackgroundWindow(pane, 'dev');
-                }
-                else if (pane.testWindowId) {
-                    await attachBackgroundWindow(pane, 'test');
-                }
-            }
-            else {
-                setStatusMessage('No test or dev window to open');
-                setTimeout(() => setStatusMessage(''), 2000);
-            }
+            // Close pane (NEW: using action system)
+            actionSystem.executeAction(PaneAction.CLOSE, panes[selectedIndex]);
         }
         else if (key.return && selectedIndex < panes.length) {
-            jumpToPane(panes[selectedIndex].paneId);
+            // Jump to pane (NEW: using action system)
+            actionSystem.executeAction(PaneAction.VIEW, panes[selectedIndex]);
         }
     });
-    // If showing merge pane, render only that
-    if (showMergePane && mergingPane) {
-        return (React.createElement(MergePane, { pane: mergingPane, mainBranch: getMainBranch(), onComplete: () => {
-                // Close the pane after successful merge
-                closePane(mergingPane);
-                setShowMergePane(false);
-                setMergingPane(null);
-            }, onCancel: () => {
-                setShowMergePane(false);
-                setMergingPane(null);
-            } }));
+    // If showing QR code, render only that
+    if (showQRCode && tunnelUrl) {
+        return (React.createElement(Box, { flexDirection: "column" },
+            React.createElement(Box, { marginBottom: 1 },
+                React.createElement(Text, { bold: true, color: "cyan" }, "dmux - Remote Access")),
+            React.createElement(QRCode, { url: tunnelUrl }),
+            React.createElement(Box, { marginTop: 1 },
+                React.createElement(Text, { dimColor: true }, "Press ESC to return to pane list"))));
     }
     return (React.createElement(Box, { flexDirection: "column" },
-        React.createElement(Box, { marginBottom: 1 },
-            React.createElement(Text, { bold: true, color: "cyan" },
-                "dmux - ",
-                projectName)),
-        React.createElement(PanesGrid, { panes: panes, selectedIndex: selectedIndex, isLoading: isLoading, showNewPaneDialog: showNewPaneDialog, agentStatuses: agentStatuses }),
+        React.createElement(PanesGrid, { panes: panes, selectedIndex: selectedIndex, isLoading: isLoading, showNewPaneDialog: showNewPaneDialog, agentStatuses: agentStatuses, kebabMenuPaneIndex: kebabMenuPaneIndex ?? undefined }),
         isLoading && (React.createElement(LoadingIndicator, null)),
         showNewPaneDialog && !showAgentChoiceDialog && (React.createElement(NewPaneDialog, { value: newPanePrompt, onChange: setNewPanePrompt, onSubmit: (value) => {
                 const promptValue = value;
@@ -835,15 +1057,28 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
             } })),
         showAgentChoiceDialog && (React.createElement(AgentChoiceDialog, { agentChoice: agentChoice })),
         isCreatingPane && (React.createElement(CreatingIndicator, { message: statusMessage })),
-        showMergeConfirmation && mergedPane && (React.createElement(MergeConfirmationDialog, { pane: mergedPane })),
-        showCloseOptions && closingPane && (React.createElement(CloseOptionsDialog, { pane: closingPane, selectedIndex: selectedCloseOption })),
         showCommandPrompt && (React.createElement(CommandPromptDialog, { type: showCommandPrompt, value: commandInput, onChange: setCommandInput })),
         showFileCopyPrompt && (React.createElement(FileCopyPrompt, null)),
+        showKebabMenu && kebabMenuPaneIndex !== null && panes[kebabMenuPaneIndex] && (React.createElement(KebabMenu, { selectedOption: kebabMenuOption, actions: kebabMenuActions, paneName: panes[kebabMenuPaneIndex].slug })),
+        actionSystem.actionState.showConfirmDialog && (React.createElement(ActionConfirmDialog, { key: "confirm-dialog", title: actionSystem.actionState.confirmTitle, message: actionSystem.actionState.confirmMessage, yesLabel: actionSystem.actionState.confirmYesLabel, noLabel: actionSystem.actionState.confirmNoLabel, selectedIndex: actionSystem.actionState.confirmSelectedIndex })),
+        actionSystem.actionState.showChoiceDialog && (React.createElement(ActionChoiceDialog, { key: "choice-dialog", title: actionSystem.actionState.choiceTitle, message: actionSystem.actionState.choiceMessage, options: actionSystem.actionState.choiceOptions, selectedIndex: actionSystem.actionState.choiceSelectedIndex })),
+        actionSystem.actionState.showInputDialog && (React.createElement(ActionInputDialog, { key: "input-dialog", title: actionSystem.actionState.inputTitle, message: actionSystem.actionState.inputMessage, placeholder: actionSystem.actionState.inputPlaceholder, value: actionSystem.actionState.inputValue, onValueChange: (value) => {
+                actionSystem.setActionState(prev => ({ ...prev, inputValue: value }));
+            } })),
+        actionSystem.actionState.showProgressDialog && (React.createElement(ActionProgressDialog, { key: "progress-dialog", message: actionSystem.actionState.progressMessage, percent: actionSystem.actionState.progressPercent })),
         runningCommand && (React.createElement(RunningIndicator, null)),
         isUpdating && (React.createElement(UpdatingIndicator, null)),
+        isCreatingTunnel && (React.createElement(Box, { flexDirection: "column", borderStyle: "round", borderColor: "cyan", padding: 1, marginTop: 1 },
+            React.createElement(Text, { bold: true, color: "cyan" }, "Creating tunnel..."),
+            React.createElement(Box, { marginTop: 1 },
+                React.createElement(Text, { dimColor: true }, "This may take a few moments...")))),
         statusMessage && (React.createElement(Box, { marginTop: 1 },
             React.createElement(Text, { color: "green" }, statusMessage))),
-        React.createElement(FooterHelp, { show: !showNewPaneDialog && !showCommandPrompt, gridInfo: (() => {
+        actionSystem.actionState.statusMessage && (React.createElement(Box, { marginTop: 1 },
+            React.createElement(Text, { color: actionSystem.actionState.statusType === 'error' ? 'red' :
+                    actionSystem.actionState.statusType === 'success' ? 'green' :
+                        'cyan' }, actionSystem.actionState.statusMessage))),
+        React.createElement(FooterHelp, { show: !showNewPaneDialog && !showCommandPrompt, showRemoteKey: !!server, quitConfirmMode: quitConfirmMode, gridInfo: (() => {
                 if (!process.env.DEBUG_DMUX)
                     return undefined;
                 const cols = Math.max(1, Math.floor(terminalWidth / 37));
@@ -851,14 +1086,12 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, autoUpdate
                 const pos = getCardGridPosition(selectedIndex);
                 return `Grid: ${cols} cols × ${rows} rows | Selected: row ${pos.row}, col ${pos.col} | Terminal: ${terminalWidth}w`;
             })() }),
-        React.createElement(Box, { marginTop: 1 },
-            React.createElement(Text, { dimColor: true },
-                "dmux v",
-                packageJson.version,
-                updateAvailable && updateInfo && (React.createElement(Text, { color: "yellow" },
-                    " \u2022 New version ",
-                    updateInfo.latestVersion,
-                    " available! Run: npm i -g dmux@latest"))))));
+        React.createElement(Text, { dimColor: true },
+            "v",
+            packageJson.version,
+            updateAvailable && updateInfo && (React.createElement(Text, { color: "yellow" },
+                " \u2022 Update available: ",
+                updateInfo.latestVersion)))));
 };
 export default DmuxApp;
 //# sourceMappingURL=DmuxApp.js.map