MediaMetz/gemini-cli
1
0
Fork 0
mirror of https://github.com/google-gemini/gemini-cli.git synced 2026-04-21 18:44:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

feat(cli): unify /chat and /resume command UX (#20256)

Browse Source
This commit is contained in:
Dmitry Lyalin
2026-03-08 18:50:51 -04:00
committed by GitHub
parent d012929a28
commit d41735d6a9
18 changed files with 619 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/cli/src/ui/components/SuggestionsDisplay.tsx
+48 -28
View File
@@ -14,9 +14,12 @@ import { sanitizeForDisplay } from '../utils/textUtils.js';
export interface Suggestion {
label: string;
value: string;
insertValue?: string;
description?: string;
matchedIndex?: number;
commandKind?: CommandKind;
sectionTitle?: string;
submitValue?: string;
}
interface SuggestionsDisplayProps {
suggestions: Suggestion[];
@@ -86,6 +89,12 @@ export function SuggestionsDisplay({
const isExpanded = originalIndex === expandedIndex;
const textColor = isActive ? theme.ui.focus : theme.text.secondary;
const isLong = suggestion.value.length >= MAX_WIDTH;
const previousSectionTitle =
suggestions[originalIndex - 1]?.sectionTitle;
const shouldRenderSectionHeader =
mode === 'slash' &&
!!suggestion.sectionTitle &&
suggestion.sectionTitle !== previousSectionTitle;
const labelElement = (
<ExpandableText
label={suggestion.value}
@@ -99,37 +108,48 @@ export function SuggestionsDisplay({
return (
<Box
key={`${suggestion.value}-${originalIndex}`}
flexDirection="row"
backgroundColor={isActive ? theme.background.focus : undefined}
flexDirection="column"
>
<Box
{...(mode === 'slash'
? { width: commandColumnWidth, flexShrink: 0 as const }
: { flexShrink: 1 as const })}
>
<Box>
{labelElement}
{suggestion.commandKind &&
COMMAND_KIND_SUFFIX[suggestion.commandKind] && (
<Text color={textColor}>
{COMMAND_KIND_SUFFIX[suggestion.commandKind]}
</Text>
)}
</Box>
</Box>
{shouldRenderSectionHeader && (
<Text color={theme.text.secondary}>
-- {suggestion.sectionTitle} --
</Text>
)}
{suggestion.description && (
<Box flexGrow={1} paddingLeft={3}>
<Text color={textColor} wrap="truncate">
{sanitizeForDisplay(suggestion.description, 100)}
</Text>
<Box
flexDirection="row"
backgroundColor={isActive ? theme.background.focus : undefined}
>
<Box
{...(mode === 'slash'
? { width: commandColumnWidth, flexShrink: 0 as const }
: { flexShrink: 1 as const })}
>
<Box>
{labelElement}
{suggestion.commandKind &&
COMMAND_KIND_SUFFIX[suggestion.commandKind] && (
<Text color={textColor}>
{COMMAND_KIND_SUFFIX[suggestion.commandKind]}
</Text>
)}
</Box>
</Box>
)}
{isActive && isLong && (
<Box width={3} flexShrink={0}>
<Text color={Colors.Gray}>{isExpanded ? ' ← ' : ' → '}</Text>
</Box>
)}
{suggestion.description && (
<Box flexGrow={1} paddingLeft={3}>
<Text color={textColor} wrap="truncate">
{sanitizeForDisplay(suggestion.description, 100)}
</Text>
</Box>
)}
{isActive && isLong && (
<Box width={3} flexShrink={0}>
<Text color={Colors.Gray}>{isExpanded ? ' ← ' : ' → '}</Text>
</Box>
)}
</Box>
</Box>
);
})}