diff --git a/packages/cli/src/ui/components/messages/ThinkingMessage.tsx b/packages/cli/src/ui/components/messages/ThinkingMessage.tsx index 8541f27110..d08a9c90e5 100644 --- a/packages/cli/src/ui/components/messages/ThinkingMessage.tsx +++ b/packages/cli/src/ui/components/messages/ThinkingMessage.tsx @@ -6,9 +6,9 @@ import type React from 'react'; import { Box, Text } from 'ink'; -import process from 'node:process'; import type { ThoughtSummary } from '@google/gemini-cli-core'; import { MaxSizedBox, MINIMUM_MAX_HEIGHT } from '../shared/MaxSizedBox.js'; +import { IconText } from '../shared/IconText.js'; interface ThinkingMessageProps { thought: ThoughtSummary; @@ -29,8 +29,6 @@ export const ThinkingMessage: React.FC = ({ availableTerminalHeight !== undefined ? Math.max(availableTerminalHeight - 4, MINIMUM_MAX_HEIGHT) : undefined; - const bubbleIcon = shouldUseEmojiBubble() ? '💬' : '◆'; - return ( = ({ > {headerText && ( - - {bubbleIcon} {headerText} - + {bodyText && {bodyText}} )} @@ -57,22 +59,3 @@ export const ThinkingMessage: React.FC = ({ ); }; - -function shouldUseEmojiBubble(): boolean { - const locale = ( - process.env['LC_ALL'] || - process.env['LC_CTYPE'] || - process.env['LANG'] || - '' - ).toLowerCase(); - const supportsUtf8 = locale.includes('utf-8') || locale.includes('utf8'); - if (!supportsUtf8) { - return false; - } - - if (process.env['TERM'] === 'linux') { - return false; - } - - return true; -} diff --git a/packages/cli/src/ui/components/shared/IconText.tsx b/packages/cli/src/ui/components/shared/IconText.tsx new file mode 100644 index 0000000000..f23bb6a72d --- /dev/null +++ b/packages/cli/src/ui/components/shared/IconText.tsx @@ -0,0 +1,51 @@ +/** + * @license + * Copyright 2026 Google LLC + * SPDX-License-Identifier: Apache-2.0 + */ + +import type React from 'react'; +import { Text } from 'ink'; +import process from 'node:process'; + +interface IconTextProps { + icon: string; + fallbackIcon?: string; + text: string; + color?: string; + bold?: boolean; +} + +export const IconText: React.FC = ({ + icon, + fallbackIcon, + text, + color, + bold, +}) => { + const resolvedIcon = shouldUseEmoji() ? icon : (fallbackIcon ?? icon); + return ( + + {resolvedIcon} {text} + + ); +}; + +function shouldUseEmoji(): boolean { + const locale = ( + process.env['LC_ALL'] || + process.env['LC_CTYPE'] || + process.env['LANG'] || + '' + ).toLowerCase(); + const supportsUtf8 = locale.includes('utf-8') || locale.includes('utf8'); + if (!supportsUtf8) { + return false; + } + + if (process.env['TERM'] === 'linux') { + return false; + } + + return true; +}