feat(ui): make shell icon green when focused and fix DescriptiveRadioButtonSelect test mock

This commit is contained in:
Keith Guerin
2026-03-01 02:50:36 -08:00
parent 0a370ad1ce
commit 63b484a0bb
5 changed files with 35 additions and 77 deletions

View File

@@ -125,7 +125,11 @@ export const ShellToolMessage: React.FC<ShellToolMessageProps> = ({
borderDimColor={borderDimColor}
containerRef={headerRef}
>
<ToolStatusIndicator status={status} name={name} />
<ToolStatusIndicator
status={status}
name={name}
isFocused={isThisShellFocused}
/>
<ToolInfo
name={name}

View File

@@ -88,7 +88,11 @@ export const ToolMessage: React.FC<ToolMessageProps> = ({
borderColor={borderColor}
borderDimColor={borderDimColor}
>
<ToolStatusIndicator status={status} name={name} />
<ToolStatusIndicator
status={status}
name={name}
isFocused={isThisShellFocused}
/>
<ToolInfo
name={name}
status={status}

View File

@@ -137,15 +137,21 @@ export type TextEmphasis = 'high' | 'medium' | 'low';
type ToolStatusIndicatorProps = {
status: CoreToolCallStatus;
name: string;
isFocused?: boolean;
};
export const ToolStatusIndicator: React.FC<ToolStatusIndicatorProps> = ({
status: coreStatus,
name,
isFocused,
}) => {
const status = mapCoreStatusToDisplayStatus(coreStatus);
const isShell = isShellTool(name);
const statusColor = isShell ? theme.ui.active : theme.status.warning;
const statusColor = isFocused
? theme.ui.focus
: isShell
? theme.ui.active
: theme.status.warning;
return (
<Box minWidth={STATUS_INDICATOR_WIDTH}>

View File

@@ -29,6 +29,12 @@ vi.mock('../../semantic-colors.js', () => ({
primary: 'COLOR_PRIMARY',
secondary: 'COLOR_SECONDARY',
},
ui: {
focus: 'COLOR_FOCUS',
},
background: {
focus: 'COLOR_FOCUS_BG',
},
status: {
success: 'COLOR_SUCCESS',
},

View File

@@ -1,83 +1,21 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`DescriptiveRadioButtonSelect > should render correctly with custom props 1`] = `
"
ERROR Cannot read properties of undefined (reading 'focus')
src/ui/components/shared/BaseSelectionList.tsx:120:33
117: let numberColor = theme.text.primary;
118:
119: if (isSelected) {
120: titleColor = theme.ui.focus;
121: numberColor = theme.ui.focus;
122: } else if (item.disabled) {
123: titleColor = theme.text.secondary;
- (src/ui/components/shared/BaseSelectionList.tsx:120:33)
- at Array.map (<anonymous>)\\t
- BaseSelectionList (src/ui/components/shared/BaseSelectionList.tsx:111:21)
-Object.react-stack-bott
m-frame (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconci
ler/cjs/react-reconciler.development.js:15859:20)
-renderWithHoo
s (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/re
act-reconciler.development.js:3221:22)
-updateFunctionComp
nent (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/c
js/react-reconciler.development.js:6475:19)
-beginWor
(/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/react-r
econciler.development.js:8009:18)
-runWithFiberIn
EV (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/r
eact-reconciler.development.js:1738:13)
-performUnitOfW
rk (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/r
eact-reconciler.development.js:12834:22)
-workLoopSyn
(/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/reac
t-reconciler.development.js:12644:41)
" 1. Foo Title
This is Foo.
● 2. Bar Title
This is Bar.
3. Baz Title
This is Baz.
"
`;
exports[`DescriptiveRadioButtonSelect > should render correctly with default props 1`] = `
"
ERROR Cannot read properties of undefined (reading 'focus')
src/ui/components/shared/BaseSelectionList.tsx:120:33
117: let numberColor = theme.text.primary;
118:
119: if (isSelected) {
120: titleColor = theme.ui.focus;
121: numberColor = theme.ui.focus;
122: } else if (item.disabled) {
123: titleColor = theme.text.secondary;
- (src/ui/components/shared/BaseSelectionList.tsx:120:33)
- at Array.map (<anonymous>)\\t
- BaseSelectionList (src/ui/components/shared/BaseSelectionList.tsx:111:21)
-Object.react-stack-bott
m-frame (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconci
ler/cjs/react-reconciler.development.js:15859:20)
-renderWithHoo
s (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/re
act-reconciler.development.js:3221:22)
-updateFunctionComp
nent (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/c
js/react-reconciler.development.js:6475:19)
-beginWor
(/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/react-r
econciler.development.js:8009:18)
-runWithFiberIn
EV (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/r
eact-reconciler.development.js:1738:13)
-performUnitOfW
rk (/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/r
eact-reconciler.development.js:12834:22)
-workLoopSyn
(/Users/keithguerin/Documents/gemini-cli_colors/node_modules/react-reconciler/cjs/reac
t-reconciler.development.js:12644:41)
"● Foo Title
This is Foo.
Bar Title
This is Bar.
Baz Title
This is Baz.
"
`;