diff --git a/packages/cli/src/ui/components/SettingsDialog.tsx b/packages/cli/src/ui/components/SettingsDialog.tsx index f41d9cd2ed..e0a85d97ba 100644 --- a/packages/cli/src/ui/components/SettingsDialog.tsx +++ b/packages/cli/src/ui/components/SettingsDialog.tsx @@ -628,9 +628,9 @@ export function SettingsDialog({ const DIALOG_PADDING = 2; // Top and bottom borders const SETTINGS_TITLE_HEIGHT = 1; const SEARCH_BOX_HEIGHT = 3; - const SCROLL_ARROWS_HEIGHT = 2; - const SPACING_HEIGHT = 2; - const SCOPE_SELECTION_HEIGHT = 4; + const SCROLL_ARROWS_HEIGHT = 3; + const SPACING_HEIGHT = 5; + const SCOPE_SELECTION_HEIGHT = 7; const BOTTOM_HELP_TEXT_HEIGHT = 1; const RESTART_PROMPT_HEIGHT = showRestartPrompt ? 1 : 0; const ITEM_HEIGHT = 3; // Label + description + spacing diff --git a/packages/cli/src/ui/components/__snapshots__/SettingsDialog.test.tsx.snap b/packages/cli/src/ui/components/__snapshots__/SettingsDialog.test.tsx.snap index da745e2843..24b0938382 100644 --- a/packages/cli/src/ui/components/__snapshots__/SettingsDialog.test.tsx.snap +++ b/packages/cli/src/ui/components/__snapshots__/SettingsDialog.test.tsx.snap @@ -10,6 +10,7 @@ exports[`SettingsDialog > Initial Rendering > should render settings list with v │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ ● Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -38,9 +39,12 @@ exports[`SettingsDialog > Initial Rendering > should render settings list with v │ │ │ Apply To │ │ ● User Settings │ +│ │ │ Workspace Settings │ +│ │ │ System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" @@ -56,6 +60,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'accessibility settings │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ ● Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -84,9 +89,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'accessibility settings │ │ │ Apply To │ │ ● User Settings │ +│ │ │ Workspace Settings │ +│ │ │ System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" @@ -102,6 +110,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'all boolean settings d │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ ● Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -130,9 +139,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'all boolean settings d │ │ │ Apply To │ │ ● User Settings │ +│ │ │ Workspace Settings │ +│ │ │ System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" @@ -148,6 +160,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'default state' correct │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ ● Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -176,9 +189,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'default state' correct │ │ │ Apply To │ │ ● User Settings │ +│ │ │ Workspace Settings │ +│ │ │ System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" @@ -194,6 +210,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'file filtering setting │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ ● Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -222,9 +239,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'file filtering setting │ │ │ Apply To │ │ ● User Settings │ +│ │ │ Workspace Settings │ +│ │ │ System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" @@ -240,6 +260,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'focused on scope selec │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -268,9 +289,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'focused on scope selec │ │ │ > Apply To │ │ ● 1. User Settings │ +│ │ │ 2. Workspace Settings │ +│ │ │ 3. System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" @@ -286,6 +310,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'mixed boolean and numb │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ ● Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -314,9 +339,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'mixed boolean and numb │ │ │ Apply To │ │ ● User Settings │ +│ │ │ Workspace Settings │ +│ │ │ System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" @@ -332,6 +360,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'tools and security set │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ ● Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -360,9 +389,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'tools and security set │ │ │ Apply To │ │ ● User Settings │ +│ │ │ Workspace Settings │ +│ │ │ System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" @@ -378,6 +410,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'various boolean settin │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │ │ │ │ ▲ │ +│ │ │ ● Preview Features (e.g., models) false │ │ Enable preview features (e.g., preview models). │ │ │ @@ -406,9 +439,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'various boolean settin │ │ │ Apply To │ │ ● User Settings │ +│ │ │ Workspace Settings │ +│ │ │ System Settings │ │ │ +│ │ │ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │ │ │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯" diff --git a/packages/cli/src/ui/components/shared/BaseSelectionList.tsx b/packages/cli/src/ui/components/shared/BaseSelectionList.tsx index dbe6d7b075..9a236cdbac 100644 --- a/packages/cli/src/ui/components/shared/BaseSelectionList.tsx +++ b/packages/cli/src/ui/components/shared/BaseSelectionList.tsx @@ -4,8 +4,7 @@ * SPDX-License-Identifier: Apache-2.0 */ -import type React from 'react'; -import { useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { Text, Box } from 'ink'; import { theme } from '../../semantic-colors.js'; import { useSelectionList } from '../../hooks/useSelectionList.js'; @@ -134,38 +133,41 @@ export function BaseSelectionList< )}.`; return ( - - {/* Radio button indicator */} - - - {isSelected ? '●' : ' '} - - - - {/* Item number */} - {showNumbers && !item.hideNumber && ( - - {itemNumberText} + + + {/* Radio button indicator */} + + + {isSelected ? '●' : ' '} + - )} - {/* Custom content via render prop */} - - {renderItem(item, { - isSelected, - titleColor, - numberColor, - })} + {/* Item number */} + {showNumbers && !item.hideNumber && ( + + {itemNumberText} + + )} + + {/* Custom content via render prop */} + + {renderItem(item, { + isSelected, + titleColor, + numberColor, + })} + - + + ); })} diff --git a/packages/cli/src/ui/components/shared/BaseSettingsDialog.tsx b/packages/cli/src/ui/components/shared/BaseSettingsDialog.tsx index 4492c56df2..066effca17 100644 --- a/packages/cli/src/ui/components/shared/BaseSettingsDialog.tsx +++ b/packages/cli/src/ui/components/shared/BaseSettingsDialog.tsx @@ -431,7 +431,7 @@ export function BaseSettingsDialog({ )} - + {/* Items list */} {visibleItems.length === 0 ? ( @@ -445,6 +445,7 @@ export function BaseSettingsDialog({ )} + {showScrollUp && } {visibleItems.map((item, idx) => { const globalIndex = idx + scrollOffset; const isActive = @@ -533,7 +534,7 @@ export function BaseSettingsDialog({ - + ); })} @@ -545,7 +546,7 @@ export function BaseSettingsDialog({ )} - + {/* Scope Selection */} {showScopeSelector && ( @@ -566,7 +567,7 @@ export function BaseSettingsDialog({ )} - + {/* Help text */}