dmux 5.6.2 → 5.7.0

package/dist/DmuxApp.js

@@ -1,5 +1,6 @@
-import React, { useState, useEffect, useMemo } from "react";
+import React, { useState, useEffect, useMemo, useRef } from "react";
 import { Box, Text, useApp, useStdout, useInput } from "ink";
+import stringWidth from "string-width";
 import { TmuxService } from "./services/TmuxService.js";
 // Hooks
 import usePanes from "./hooks/usePanes.js";
@@ -39,17 +40,25 @@ import { getPaneBranchName } from "./utils/git.js";
 import { getGitStatus } from "./utils/mergeValidation.js";
 import { createMergeTargetChain } from "./utils/mergeTargets.js";
 import { claimProcessShutdown } from "./utils/processShutdown.js";
+import { getPaneDisplayName } from "./utils/paneTitle.js";
 import { FOOTER_TIP_ROTATION_INTERVAL, getFooterTips, getNextFooterTipIndex, getRandomFooterTipIndex, } from "./utils/footerTips.js";
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
+const ACTIVE_PANE_SYNC_INTERVAL_MS = 125;
 import PanesGrid from "./components/panes/PanesGrid.js";
 import CommandPromptDialog from "./components/dialogs/CommandPromptDialog.js";
 import FileCopyPrompt from "./components/ui/FileCopyPrompt.js";
 import FooterHelp from "./components/ui/FooterHelp.js";
 import TmuxHooksPromptDialog from "./components/dialogs/TmuxHooksPromptDialog.js";
 import { PaneEventService } from "./services/PaneEventService.js";
-import { buildProjectActionLayout, buildVisualNavigationRows, buildGroupStartRows, getProjectActionByIndex, } from "./utils/projectActions.js";
+import { buildProjectActionLayout, buildVisualNavigationRows, buildGroupStartRows, getProjectActionByIndex, resolveSelectionAfterPaneClose, } from "./utils/projectActions.js";
 import { getPaneProjectRoot } from "./utils/paneProject.js";
+import { applyDmuxTheme, getDmuxThemePalette, } from "./theme/colors.js";
+import { applyTmuxThemeToSession, refreshWelcomePaneTheme, } from "./utils/welcomePane.js";
+import { syncWelcomePaneVisibility } from "./utils/welcomePaneManager.js";
+import { getPaneColorTheme, resolveProjectColorTheme, } from "./utils/paneColors.js";
+import { getPaneTitlePrefixValue, paneNeedsAnimatedTitlePrefix, PANE_TITLE_BUSY_FRAMES, } from "./utils/paneTitlePrefix.js";
+import { getPaneTmuxDisplayTitle } from "./utils/paneTitle.js";
 const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoot, autoUpdater, controlPaneId, }) => {
     const { stdout } = useStdout();
     const terminalHeight = stdout?.rows || 40;
@@ -57,13 +66,19 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     const sessionProjectRoot = projectRoot || process.cwd();
     /* panes state moved to usePanes */
     const [selectedIndex, setSelectedIndex] = useState(0);
+    const [focusedPaneId, setFocusedPaneId] = useState(null);
     const { statusMessage, setStatusMessage } = useStatusMessages();
     const [isCreatingPane, setIsCreatingPane] = useState(false);
     const { trackProjectActivity, isProjectBusy: isTrackedProjectBusy, } = useProjectActivity(sessionProjectRoot);
     // Settings state
     const [settingsManager] = useState(() => new SettingsManager(projectRoot));
     const { projectSettings, saveSettings } = useProjectSettings(settingsFile);
-    const settings = settingsManager.getSettings();
+    const [themeRefreshNonce, setThemeRefreshNonce] = useState(0);
+    const [settings, setSettings] = useState(() => new SettingsManager(sessionProjectRoot).getSettings());
+    const paneTitlePrefixCacheRef = useRef(new Map());
+    const paneTitleLabelCacheRef = useRef(new Map());
+    const paneActiveBorderStyleCacheRef = useRef(new Map());
+    const paneTitleSpinnerFrameRef = useRef(0);
     // Dialog state management
     const dialogState = useDialogState();
     const { showCommandPrompt, setShowCommandPrompt, commandInput, setCommandInput, showFileCopyPrompt, setShowFileCopyPrompt, currentCommandType, setCurrentCommandType, runningCommand, setRunningCommand, quitConfirmMode, setQuitConfirmMode, } = dialogState;
@@ -77,6 +92,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     // Agent selection is settings-driven.
     // Installation checks are performed lazily in the Enabled Agents settings popup.
     const availableAgents = resolveEnabledAgentsSelection(settings.enabledAgents);
+    const getAvailableAgentsForProject = (targetProjectRoot = selectedProjectRoot) => resolveEnabledAgentsSelection(new SettingsManager(targetProjectRoot).getSettings().enabledAgents);
     const footerTips = useMemo(() => getFooterTips(isDevMode), [isDevMode]);
     const showFooterTips = settings.showFooterTips !== false && footerTips.length > 0;
     const [footerTipIndex, setFooterTipIndex] = useState(() => getRandomFooterTipIndex(footerTips.length));
@@ -132,12 +148,12 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         };
     }, []);
     // Panes state and persistence (skipLoading will be updated after actionSystem is initialized)
-    const { panes, setPanes, sidebarProjects, isLoading, loadPanes, savePanes, saveSidebarProjects, } = usePanes(panesFile, false, sessionName, controlPaneId, useHooks);
+    const { panes, setPanes, sidebarProjects, isLoading, loadPanes, savePanes, saveSidebarProjects, eventMode, } = usePanes(panesFile, false, sessionName, controlPaneId, useHooks);
     // Check for tmux hooks preference on startup
     useEffect(() => {
         const checkHooksPreference = async () => {
             // Check if user already has a preference
-            const settings = settingsManager.getSettings();
+            const settings = new SettingsManager(sessionProjectRoot).getSettings();
             if (settings.useTmuxHooks !== undefined) {
                 // User has already decided
                 setUseHooks(settings.useTmuxHooks);
@@ -152,6 +168,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
                 setUseHooks(true);
                 // Save the preference
                 settingsManager.updateSetting('useTmuxHooks', true, 'global');
+                refreshDmuxSettings();
             }
             else {
                 // Need to ask user - show prompt
@@ -346,18 +363,163 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     // getPanePositions moved to utils/tmux
     const activeDevSourcePath = isDevMode ? process.cwd() : undefined;
     const projectActionLayout = useMemo(() => buildProjectActionLayout(panes, sidebarProjects, sessionProjectRoot, projectName), [panes, sidebarProjects, sessionProjectRoot, projectName]);
+    const selectedPane = useMemo(() => {
+        for (const group of projectActionLayout.groups) {
+            const entry = group.panes.find((candidate) => candidate.index === selectedIndex);
+            if (entry) {
+                return entry.pane;
+            }
+        }
+        return undefined;
+    }, [projectActionLayout.groups, selectedIndex]);
     const selectedProjectRoot = useMemo(() => {
-        const selectedPane = selectedIndex < panes.length ? panes[selectedIndex] : undefined;
         if (selectedPane) {
             return getPaneProjectRoot(selectedPane, sessionProjectRoot);
         }
         return (getProjectActionByIndex(projectActionLayout.actionItems, selectedIndex)?.projectRoot
             || sessionProjectRoot);
-    }, [selectedIndex, panes, projectActionLayout.actionItems, sessionProjectRoot]);
+    }, [selectedPane, selectedIndex, projectActionLayout.actionItems, sessionProjectRoot]);
+    const focusedPane = useMemo(() => focusedPaneId
+        ? panes.find((pane) => pane.paneId === focusedPaneId)
+        : undefined, [focusedPaneId, panes]);
+    const activeProjectRoot = selectedProjectRoot;
+    const resolveProjectThemeName = React.useCallback((activeProjectRoot) => {
+        return resolveProjectColorTheme(activeProjectRoot, sidebarProjects);
+    }, [sidebarProjects]);
+    const activeBorderPane = focusedPane || selectedPane;
+    const activeBorderPaneId = activeBorderPane?.paneId;
+    const selectedThemeName = useMemo(() => resolveProjectThemeName(activeProjectRoot), [
+        resolveProjectThemeName,
+        activeProjectRoot,
+        themeRefreshNonce,
+    ]);
+    const visiblePaneCount = useMemo(() => panes.filter((pane) => !pane.hidden).length, [panes]);
+    const controlPaneActiveBorderStyle = useMemo(() => `fg=colour${getDmuxThemePalette(selectedThemeName).activeBorder}`, [selectedThemeName]);
+    const projectThemeByRoot = useMemo(() => {
+        const themeMap = new Map();
+        for (const group of projectActionLayout.groups) {
+            const paneTheme = group.panes.find((entry) => entry.pane.colorTheme)?.pane.colorTheme;
+            themeMap.set(group.projectRoot, paneTheme || resolveProjectThemeName(group.projectRoot));
+        }
+        return themeMap;
+    }, [projectActionLayout.groups, resolveProjectThemeName, themeRefreshNonce]);
+    applyDmuxTheme(selectedThemeName);
+    const refreshDmuxSettings = (_activeProjectRoot = selectedProjectRoot) => {
+        setSettings(new SettingsManager(sessionProjectRoot).getSettings());
+        setThemeRefreshNonce((current) => current + 1);
+    };
     const navigationRows = useMemo(() => isLoading
         ? projectActionLayout.groups.flatMap((group) => group.panes.map((entry) => [entry.index]))
         : buildVisualNavigationRows(projectActionLayout), [isLoading, projectActionLayout]);
     const groupStartRows = useMemo(() => isLoading ? [] : buildGroupStartRows(projectActionLayout), [isLoading, projectActionLayout]);
+    useEffect(() => {
+        try {
+            applyTmuxThemeToSession(sessionName, activeProjectRoot, selectedThemeName);
+        }
+        catch {
+            // Theme updates are best-effort at runtime.
+        }
+        void refreshWelcomePaneTheme(panesFile, activeProjectRoot, selectedThemeName);
+    }, [panesFile, activeProjectRoot, selectedThemeName, sessionName]);
+    useEffect(() => {
+        if (isLoading) {
+            return;
+        }
+        void syncWelcomePaneVisibility(sessionProjectRoot, controlPaneId, visiblePaneCount === 0, selectedThemeName);
+    }, [
+        controlPaneId,
+        isLoading,
+        selectedThemeName,
+        sessionProjectRoot,
+        visiblePaneCount,
+    ]);
+    useEffect(() => {
+        if (!process.env.TMUX) {
+            return;
+        }
+        const tmuxService = TmuxService.getInstance();
+        const syncPaneTitlePrefixes = () => {
+            const cachedPrefixes = paneTitlePrefixCacheRef.current;
+            const cachedLabels = paneTitleLabelCacheRef.current;
+            const cachedActiveBorderStyles = paneActiveBorderStyleCacheRef.current;
+            const activePaneIds = new Set(panes.map((pane) => pane.paneId));
+            const activeBorderStylePaneIds = new Set(activePaneIds);
+            if (controlPaneId) {
+                activeBorderStylePaneIds.add(controlPaneId);
+            }
+            for (const paneId of Array.from(cachedPrefixes.keys())) {
+                if (!activePaneIds.has(paneId)) {
+                    tmuxService.unsetPaneOptionSync(paneId, '@dmux_title_prefix');
+                    cachedPrefixes.delete(paneId);
+                }
+            }
+            for (const paneId of Array.from(cachedLabels.keys())) {
+                if (!activePaneIds.has(paneId)) {
+                    tmuxService.unsetPaneOptionSync(paneId, '@dmux_title_label');
+                    cachedLabels.delete(paneId);
+                }
+            }
+            for (const paneId of Array.from(cachedActiveBorderStyles.keys())) {
+                if (!activeBorderStylePaneIds.has(paneId)) {
+                    tmuxService.unsetPaneOptionSync(paneId, '@dmux_active_border_style');
+                    cachedActiveBorderStyles.delete(paneId);
+                }
+            }
+            for (const pane of panes) {
+                const paneThemeName = getPaneColorTheme(pane, sidebarProjects, sessionProjectRoot);
+                const prefixValue = getPaneTitlePrefixValue(pane, sidebarProjects, sessionProjectRoot, paneTitleSpinnerFrameRef.current);
+                const labelValue = getPaneTmuxDisplayTitle(pane, sessionProjectRoot, projectName);
+                const activeBorderStyle = `fg=colour${getDmuxThemePalette(paneThemeName).activeBorder}`;
+                if (cachedPrefixes.get(pane.paneId) !== prefixValue) {
+                    tmuxService.setPaneOptionSync(pane.paneId, '@dmux_title_prefix', prefixValue);
+                    cachedPrefixes.set(pane.paneId, prefixValue);
+                }
+                if (cachedLabels.get(pane.paneId) !== labelValue) {
+                    tmuxService.setPaneOptionSync(pane.paneId, '@dmux_title_label', labelValue);
+                    cachedLabels.set(pane.paneId, labelValue);
+                }
+                if (cachedActiveBorderStyles.get(pane.paneId) !== activeBorderStyle) {
+                    tmuxService.setPaneOptionSync(pane.paneId, '@dmux_active_border_style', activeBorderStyle);
+                    cachedActiveBorderStyles.set(pane.paneId, activeBorderStyle);
+                }
+                if (pane.paneId === activeBorderPaneId) {
+                    tmuxService.setSessionOptionSync(sessionName, 'pane-active-border-style', activeBorderStyle);
+                }
+            }
+            if (controlPaneId && cachedActiveBorderStyles.get(controlPaneId) !== controlPaneActiveBorderStyle) {
+                tmuxService.setPaneOptionSync(controlPaneId, '@dmux_active_border_style', controlPaneActiveBorderStyle);
+                cachedActiveBorderStyles.set(controlPaneId, controlPaneActiveBorderStyle);
+            }
+            if (!focusedPane) {
+                tmuxService.setSessionOptionSync(sessionName, 'pane-active-border-style', controlPaneActiveBorderStyle);
+            }
+        };
+        const hasAnimatedPrefix = panes.some(paneNeedsAnimatedTitlePrefix);
+        if (!hasAnimatedPrefix) {
+            paneTitleSpinnerFrameRef.current = 0;
+        }
+        syncPaneTitlePrefixes();
+        if (!hasAnimatedPrefix) {
+            return;
+        }
+        const interval = setInterval(() => {
+            paneTitleSpinnerFrameRef.current = (paneTitleSpinnerFrameRef.current + 1) % PANE_TITLE_BUSY_FRAMES.length;
+            syncPaneTitlePrefixes();
+        }, 90);
+        return () => {
+            clearInterval(interval);
+        };
+    }, [
+        panes,
+        sidebarProjects,
+        sessionProjectRoot,
+        projectName,
+        activeBorderPaneId,
+        sessionName,
+        controlPaneId,
+        controlPaneActiveBorderStyle,
+        focusedPane,
+    ]);
     useEffect(() => {
         const maxIndex = Math.max(0, projectActionLayout.totalItems - 1);
         if (selectedIndex > maxIndex) {
@@ -367,14 +529,59 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     // Navigation logic moved to hook
     const { getCardGridPosition, findCardInDirection } = useNavigation(navigationRows, groupStartRows);
     // findCardInDirection provided by useNavigation
+    const syncSelectedIndexToFocusedPane = React.useCallback(async (activePaneId) => {
+        try {
+            const focusedPaneId = activePaneId ?? await TmuxService.getInstance().getActivePaneId();
+            if (!focusedPaneId || focusedPaneId === controlPaneId) {
+                setFocusedPaneId(null);
+                return;
+            }
+            setFocusedPaneId((currentPaneId) => currentPaneId === focusedPaneId ? currentPaneId : focusedPaneId);
+            const focusedIndex = panes.findIndex((pane) => pane.paneId === focusedPaneId);
+            if (focusedIndex === -1) {
+                return;
+            }
+            setSelectedIndex((currentIndex) => currentIndex === focusedIndex ? currentIndex : focusedIndex);
+        }
+        catch {
+            // Focus sync is best-effort; pane lifecycle handling will correct stale IDs.
+        }
+    }, [controlPaneId, panes]);
+    useEffect(() => {
+        const paneEventService = PaneEventService.getInstance();
+        return paneEventService.onPaneFocusChanged((event) => {
+            void syncSelectedIndexToFocusedPane(event.activePaneId);
+        });
+    }, [syncSelectedIndexToFocusedPane]);
+    useEffect(() => {
+        if (!process.env.TMUX || panes.length === 0) {
+            return;
+        }
+        let syncInFlight = false;
+        const syncActivePane = () => {
+            if (syncInFlight) {
+                return;
+            }
+            syncInFlight = true;
+            void syncSelectedIndexToFocusedPane().finally(() => {
+                syncInFlight = false;
+            });
+        };
+        syncActivePane();
+        const interval = setInterval(syncActivePane, ACTIVE_PANE_SYNC_INTERVAL_MS);
+        return () => {
+            clearInterval(interval);
+        };
+    }, [eventMode, panes.length, syncSelectedIndexToFocusedPane]);
     // savePanes moved to usePanes
     // applySmartLayout moved to utils/tmux
     // Helper function to handle agent choice and pane creation
     const selectAgentsForPaneCreation = async (targetProjectRoot) => {
-        if (availableAgents.length === 0) {
+        const targetRoot = targetProjectRoot || selectedProjectRoot;
+        if (getAvailableAgentsForProject(targetRoot).length === 0) {
             return [];
         }
-        const selectedAgents = await popupManager.launchAgentChoicePopup(targetProjectRoot || selectedProjectRoot);
+        const selectedAgents = await popupManager.launchAgentChoicePopup(targetRoot);
         if (selectedAgents === null) {
             return null;
         }
@@ -433,12 +640,12 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
             if (createdCount > 0) {
                 return {
                     type: "success",
-                    message: `Created ${createdCount} sub-worktree${createdCount === 1 ? "" : "s"} from ${parentPane.slug}`,
+                    message: `Created ${createdCount} sub-worktree${createdCount === 1 ? "" : "s"} from ${getPaneDisplayName(parentPane)}`,
                 };
             }
             return {
                 type: "error",
-                message: `Failed to create a sub-worktree from ${parentPane.slug}`,
+                message: `Failed to create a sub-worktree from ${getPaneDisplayName(parentPane)}`,
                 dismissable: true,
             };
         };
@@ -453,7 +660,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         const branchFromDirtyResult = {
             type: "choice",
             title: "Parent Worktree Has Uncommitted Changes",
-            message: `"${parentPane.slug}" has uncommitted changes. Commit them before creating a sub-worktree.`,
+            message: `"${getPaneDisplayName(parentPane)}" has uncommitted changes. Commit them before creating a sub-worktree.`,
             options: [
                 {
                     id: "commit_automatic",
@@ -513,7 +720,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         const reopenProjectRoot = targetProjectRoot || projectRoot || process.cwd();
         let selectedAgent;
         if (!candidate.path) {
-            if (availableAgents.length === 0) {
+            if (getAvailableAgentsForProject(reopenProjectRoot).length === 0) {
                 setStatusMessage("No enabled agents available for opening this branch");
                 setTimeout(() => setStatusMessage(""), STATUS_MESSAGE_DURATION_SHORT);
                 return;
@@ -549,7 +756,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
             const updatedPanes = [...panes, result.pane];
             await savePanes(updatedPanes);
             await loadPanes();
-            setStatusMessage(`${candidate.path ? "Reopened" : "Opened"} ${label}`);
+            setStatusMessage(`${candidate.path ? "Reopened" : "Opened"} ${getPaneDisplayName(result.pane)}`);
             setTimeout(() => setStatusMessage(""), STATUS_MESSAGE_DURATION_SHORT);
         }
         catch (error) {
@@ -590,7 +797,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
             await trackProjectActivity(() => restartDevSessionAtSource(nextSource.nextSourcePath), sessionProjectRoot);
             return;
         }
-        setStatusMessage(`Switching source to "${pane.slug}"...`);
+        setStatusMessage(`Switching source to "${getPaneDisplayName(pane)}"...`);
         await trackProjectActivity(() => restartDevSessionAtSource(nextSource.nextSourcePath), paneProjectRoot);
     };
     // Helper function to handle action results recursively
@@ -631,7 +838,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         else if (result.type === "input") {
             if (!result.onSubmit)
                 return;
-            const inputValue = await popupManager.launchInputPopup(result.title || "Input", result.message, result.placeholder, result.defaultValue, selectedProjectRoot);
+            const inputValue = await popupManager.launchInputPopup(result.title || "Input", result.message, result.placeholder, result.defaultValue, selectedProjectRoot, result.inputMaxVisibleLines);
             if (inputValue !== null) {
                 const nextResult = await trackProjectActivity(() => result.onSubmit(inputValue), selectedProjectRoot);
                 // Recursively handle nested results
@@ -640,6 +847,26 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
                 }
             }
         }
+        else if (result.type === "pr_review") {
+            if (!result.onSubmit || !result.reviewData)
+                return;
+            const inputValue = await popupManager.launchPRReviewPopup({
+                title: result.title || "Pull Request",
+                message: result.message || "",
+                defaultValue: result.defaultValue || "",
+                repoPath: result.reviewData.repoPath,
+                sourceBranch: result.reviewData.sourceBranch,
+                targetBranch: result.reviewData.targetBranch,
+                files: result.reviewData.files,
+                aiFailed: result.reviewData.aiFailed,
+            }, selectedProjectRoot);
+            if (inputValue !== null) {
+                const nextResult = await trackProjectActivity(() => result.onSubmit(inputValue), selectedProjectRoot);
+                if (nextResult) {
+                    await handleActionResult(nextResult);
+                }
+            }
+        }
         else if (result.type === "navigation") {
             // Navigate to target pane if specified
             if (result.targetPaneId) {
@@ -672,25 +899,25 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         projectName,
         defaultProjectRoot: sessionProjectRoot,
         onPaneRemove: async (paneId) => {
-            // Mark pane as closing to prevent race condition with worker
-            await lifecycleManager.beginClose(paneId, 'user requested');
-            // Adjust selectedIndex before removing from list
-            const removedIndex = panes.findIndex((p) => p.paneId === paneId);
-            if (removedIndex >= 0 && selectedIndex >= panes.length - 1) {
-                setSelectedIndex(Math.max(0, panes.length - 2));
-            }
-            // Remove from panes list
-            const updatedPanes = panes.filter((p) => p.paneId !== paneId);
-            savePanes(updatedPanes);
-            // Mark close as completed (no more lock needed)
-            await lifecycleManager.completeClose(paneId);
-            // Return focus to control pane
-            if (controlPaneId) {
+            const nextSelection = resolveSelectionAfterPaneClose(panes, paneId, sidebarProjects, sessionProjectRoot, projectName);
+            if (nextSelection) {
+                setSelectedIndex(nextSelection.selectedIndex);
+            }
+            else {
+                const maxIndex = Math.max(0, projectActionLayout.totalItems - 2);
+                if (selectedIndex > maxIndex) {
+                    setSelectedIndex(maxIndex);
+                }
+            }
+            const targetPaneId = nextSelection?.pane && !nextSelection.pane.hidden
+                ? nextSelection.pane.paneId
+                : controlPaneId;
+            if (targetPaneId) {
                 try {
-                    await TmuxService.getInstance().selectPane(controlPaneId);
+                    await TmuxService.getInstance().selectPane(targetPaneId);
                 }
                 catch {
-                    // Ignore - control pane might not exist
+                    // Ignore - the target pane might have closed during cleanup
                 }
             }
         },
@@ -701,6 +928,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
                 launchConfirmPopup: popupManager.launchConfirmPopup.bind(popupManager),
                 launchChoicePopup: popupManager.launchChoicePopup.bind(popupManager),
                 launchInputPopup: popupManager.launchInputPopup.bind(popupManager),
+                launchPRReviewPopup: popupManager.launchPRReviewPopup.bind(popupManager),
                 launchProgressPopup: popupManager.launchProgressPopup.bind(popupManager),
             }
             : undefined,
@@ -815,12 +1043,14 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
             setShowHooksPrompt(false);
             setUseHooks(true);
             settingsManager.updateSetting('useTmuxHooks', true, 'global');
+            refreshDmuxSettings();
         }
         else if (input === 'n') {
             // No - use polling
             setShowHooksPrompt(false);
             setUseHooks(false);
             settingsManager.updateSetting('useTmuxHooks', false, 'global');
+            refreshDmuxSettings();
         }
         else if (key.return) {
             // Select current option
@@ -828,6 +1058,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
             const selected = hooksPromptIndex === 0;
             setUseHooks(selected);
             settingsManager.updateSetting('useTmuxHooks', selected, 'global');
+            refreshDmuxSettings();
         }
     }, { isActive: showHooksPrompt });
     // Input handling - extracted to dedicated hook
@@ -855,6 +1086,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         projectSettings,
         saveSettings,
         settingsManager,
+        refreshDmuxSettings,
         popupManager,
         actionSystem,
         controlPaneId,
@@ -871,7 +1103,7 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         saveSidebarProjects,
         loadPanes,
         cleanExit,
-        availableAgents,
+        getAvailableAgentsForProject,
         panesFile,
         projectRoot: sessionProjectRoot,
         projectActionItems: projectActionLayout.actionItems,
@@ -883,7 +1115,8 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     // - Normal mode calculation:
     //   - Base footer: 4 lines (marginTop + logs divider + logs line + keyboard shortcuts)
     //   - Footer tip: +1 line when footer tips are enabled
-    //   - Toast: +2 lines (toast message + marginBottom) if currentToast exists
+    //   - Toast (active): wrapped lines + header + marginBottom
+    //   - Toast (queued, transitioning): header + marginBottom (2 lines)
     //   - Debug info: +1 line if DEBUG_DMUX
     //   - Status line: +1 line if updateAvailable/currentBranch/debugMessage
     //   - Status messages: +1 line per active message
@@ -895,20 +1128,26 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
     else {
         footerLines = 0;
         if (showFooterHelp) {
-            footerLines = 4; // marginTop + logs divider + logs + shortcuts
+            footerLines = 3; // logs divider + logs + shortcuts
             if (currentFooterTip) {
                 footerLines += 1;
             }
             // Add toast notification (calculate wrapped lines + header)
             if (currentToast) {
                 // Toast format: "✓ message" - icon (1) + space (1) + message
-                const iconAndSpaceLength = 2;
-                const toastTextLength = iconAndSpaceLength + currentToast.message.length;
+                // Use stringWidth for CJK-aware display width calculation
+                const iconAndSpaceWidth = 2;
+                const toastDisplayWidth = iconAndSpaceWidth + stringWidth(currentToast.message);
                 // Available width is sidebar width (40) minus padding/margins (~2)
                 const availableWidth = SIDEBAR_WIDTH - 2;
-                const wrappedLines = Math.ceil(toastTextLength / availableWidth);
+                const wrappedLines = Math.ceil(toastDisplayWidth / availableWidth);
                 footerLines += wrappedLines + 1 + 1; // wrapped lines + header line + marginBottom
             }
+            else if (toastQueueLength > 0) {
+                // When there are queued toasts but no current toast (transition state),
+                // FooterHelp still renders the notification header + marginBottom
+                footerLines += 1 + 1; // header line + marginBottom
+            }
             // Add debug info
             if (process.env.DEBUG_DMUX) {
                 footerLines += 1;
@@ -927,9 +1166,9 @@ const DmuxApp = ({ panesFile, projectName, sessionName, settingsFile, projectRoo
         }
     }
     const contentHeight = Math.max(terminalHeight - footerLines, 10);
-    return (React.createElement(Box, { flexDirection: "column", height: terminalHeight },
+    return (React.createElement(Box, { key: `theme-${selectedThemeName}-${themeRefreshNonce}`, flexDirection: "column", height: terminalHeight },
         React.createElement(Box, { flexDirection: "column", height: contentHeight, overflow: "hidden" },
-            React.createElement(PanesGrid, { panes: panes, selectedIndex: selectedIndex, isLoading: isLoading, agentStatuses: agentStatuses, activeDevSourcePath: activeDevSourcePath, sidebarProjects: sidebarProjects, fallbackProjectRoot: projectRoot || process.cwd(), fallbackProjectName: projectName, isProjectBusy: isProjectHeaderBusy }),
+            React.createElement(PanesGrid, { panes: panes, selectedIndex: selectedIndex, activeProjectRoot: activeProjectRoot, isLoading: isLoading, themeName: selectedThemeName, projectThemeByRoot: projectThemeByRoot, agentStatuses: agentStatuses, activeDevSourcePath: activeDevSourcePath, sidebarProjects: sidebarProjects, fallbackProjectRoot: projectRoot || process.cwd(), fallbackProjectName: projectName, isProjectBusy: isProjectHeaderBusy }),
             showCommandPrompt && (React.createElement(CommandPromptDialog, { type: showCommandPrompt, value: commandInput, onChange: setCommandInput })),
             showFileCopyPrompt && React.createElement(FileCopyPrompt, null),
             showHooksPrompt && (React.createElement(TmuxHooksPromptDialog, { selectedIndex: hooksPromptIndex }))),