diff --git a/packages/cli/src/ui/components/Composer.tsx b/packages/cli/src/ui/components/Composer.tsx index c487df0c4c..7c48473a9e 100644 --- a/packages/cli/src/ui/components/Composer.tsx +++ b/packages/cli/src/ui/components/Composer.tsx @@ -56,10 +56,10 @@ export const Composer: React.FC = ({ isFocused }) => { const uiActions = useUIActions(); const settings = useSettings(); const config = useConfig(); + const { vimEnabled, vimMode } = useVimMode(); const isScreenReaderEnabled = useIsScreenReaderEnabled(); const { columns: terminalWidth } = useTerminalSize(); const isNarrow = isNarrowWidth(terminalWidth); - const { vimEnabled, vimMode } = useVimMode(); const inlineThinkingMode = getInlineThinkingMode(settings); const debugConsoleMaxHeight = Math.floor(Math.max(terminalWidth * 0.2, 5)); const [suggestionsVisible, setSuggestionsVisible] = useState(false); @@ -211,11 +211,17 @@ export const Composer: React.FC = ({ isFocused }) => { settings.merged.ui.showShortcutsHint && !hideShortcutsHintForSuggestions && showShortcutsHintDebounced; + + const USER_HOOK_SOURCES = ['user', 'project', 'runtime']; + const userHooks = uiState.activeHooks.filter( + (h) => !h.source || USER_HOOK_SOURCES.includes(h.source), + ); + const hasUserHooks = + userHooks.length > 0 && settings.merged.hooksConfig.notifications; + const showMinimalModeBleedThrough = !hideUiDetailsForSuggestions && Boolean(minimalModeBleedThrough); const showMinimalInlineLoading = !showUiDetails && showLoadingIndicator; - const hasActiveHooks = - uiState.activeHooks.length > 0 && settings.merged.hooksConfig.notifications; const showMinimalBleedThroughRow = !showUiDetails && (showMinimalModeBleedThrough || @@ -226,17 +232,13 @@ export const Composer: React.FC = ({ isFocused }) => { (showMinimalInlineLoading || showMinimalBleedThroughRow || showShortcutsHint || - hasActiveHooks); + hasUserHooks); let estimatedStatusLength = 0; - if ( - isExperimentalLayout && - uiState.activeHooks.length > 0 && - settings.merged.hooksConfig.notifications - ) { + if (isExperimentalLayout && hasUserHooks) { const hookLabel = - uiState.activeHooks.length > 1 ? 'Executing Hooks' : 'Executing Hook'; - const hookNames = uiState.activeHooks + userHooks.length > 1 ? 'Executing Hooks' : 'Executing Hook'; + const hookNames = userHooks .map( (h) => h.name + @@ -336,31 +338,22 @@ export const Composer: React.FC = ({ isFocused }) => { const renderStatusNode = () => { // In experimental layout, hooks take priority - if ( - isExperimentalLayout && - uiState.activeHooks.length > 0 && - settings.merged.hooksConfig.notifications - ) { - const activeHook = uiState.activeHooks[0]; + if (isExperimentalLayout && hasUserHooks) { + const activeHook = userHooks[0]; const hookIcon = activeHook?.eventName?.startsWith('After') ? '↩' : '↪'; - const USER_HOOK_SOURCES = ['user', 'project', 'runtime']; - const hasUserHooks = uiState.activeHooks.some( - (h) => !h.source || USER_HOOK_SOURCES.includes(h.source), - ); - return ( - + - {!hasUserHooks && showWit && uiState.currentWittyPhrase && ( + {showWit && uiState.currentWittyPhrase && ( {uiState.currentWittyPhrase} :) @@ -375,22 +368,9 @@ export const Composer: React.FC = ({ isFocused }) => { return ( = ({ isFocused }) => { elapsedTime={uiState.elapsedTime} forceRealStatusOnly={isExperimentalLayout} showCancelAndTimer={!isExperimentalLayout} - showTips={showTips} - showWit={showWit} wittyPhrase={uiState.currentWittyPhrase} /> ); @@ -437,21 +415,19 @@ export const Composer: React.FC = ({ isFocused }) => { showCancelAndTimer={false} /> )} - {hasActiveHooks && ( + {hasUserHooks && ( - + )} {showMinimalBleedThroughRow && ( {showMinimalModeBleedThrough && minimalModeBleedThrough && ( @@ -463,7 +439,7 @@ export const Composer: React.FC = ({ isFocused }) => { marginLeft={ showMinimalInlineLoading || showMinimalModeBleedThrough || - hasActiveHooks + hasUserHooks ? 1 : 0 } @@ -477,7 +453,7 @@ export const Composer: React.FC = ({ isFocused }) => { showMinimalInlineLoading || showMinimalModeBleedThrough || hasMinimalStatusBleedThrough || - hasActiveHooks + hasUserHooks ? 1 : 0 } @@ -506,8 +482,8 @@ export const Composer: React.FC = ({ isFocused }) => { {hasToast ? ( @@ -682,13 +658,13 @@ export const Composer: React.FC = ({ isFocused }) => { showCancelAndTimer={false} /> )} - {hasActiveHooks && ( + {hasUserHooks && ( - + )} @@ -697,7 +673,7 @@ export const Composer: React.FC = ({ isFocused }) => { marginLeft={ showMinimalInlineLoading || showMinimalModeBleedThrough || - hasActiveHooks + hasUserHooks ? 1 : 0 } @@ -713,7 +689,7 @@ export const Composer: React.FC = ({ isFocused }) => { marginLeft={ showMinimalInlineLoading || showMinimalModeBleedThrough || - hasActiveHooks + hasUserHooks ? 1 : 0 } @@ -779,7 +755,7 @@ export const Composer: React.FC = ({ isFocused }) => { allowPlanMode={uiState.allowPlanMode} /> )} - {!showLoadingIndicator && !hasActiveHooks && ( + {!showLoadingIndicator && !hasUserHooks && ( <> {uiState.shellModeActive && ( @@ -794,7 +770,7 @@ export const Composer: React.FC = ({ isFocused }) => { )} - {!showLoadingIndicator && !hasActiveHooks && ( + {!showLoadingIndicator && !hasUserHooks && ( <> ·