UI improvements for suggestions & status (#373)
This commit is contained in:
parent
8d9e1118c6
commit
9862cf3204
|
@ -310,6 +310,7 @@ export const App = ({
|
|||
isLoading={completion.isLoadingSuggestions}
|
||||
width={suggestionsWidth}
|
||||
scrollOffset={completion.visibleStartIndex}
|
||||
userInput={query}
|
||||
/>
|
||||
</Box>
|
||||
)}
|
||||
|
|
|
@ -24,7 +24,7 @@ export const Footer: React.FC<FooterProps> = ({
|
|||
cliVersion,
|
||||
geminiMdFileCount,
|
||||
}) => (
|
||||
<Box>
|
||||
<Box marginTop={1}>
|
||||
<Box>
|
||||
{geminiMdFileCount > 0 && (
|
||||
<Text color={Colors.SubtleComment}>
|
||||
|
|
|
@ -17,6 +17,7 @@ interface SuggestionsDisplayProps {
|
|||
isLoading: boolean;
|
||||
width: number;
|
||||
scrollOffset: number;
|
||||
userInput: string;
|
||||
}
|
||||
|
||||
export const MAX_SUGGESTIONS_TO_SHOW = 8;
|
||||
|
@ -27,6 +28,7 @@ export function SuggestionsDisplay({
|
|||
isLoading,
|
||||
width,
|
||||
scrollOffset,
|
||||
userInput,
|
||||
}: SuggestionsDisplayProps) {
|
||||
if (isLoading) {
|
||||
return (
|
||||
|
@ -60,9 +62,15 @@ export function SuggestionsDisplay({
|
|||
return (
|
||||
<Box key={`${suggestion}-${originalIndex}`} width={width}>
|
||||
<Box flexDirection="row">
|
||||
<Box width={20} flexShrink={0}>
|
||||
{userInput.startsWith('/') ? (
|
||||
// only use box model for (/) command mode
|
||||
<Box width={20} flexShrink={0}>
|
||||
<Text color={textColor}>{suggestion.label}</Text>
|
||||
</Box>
|
||||
) : (
|
||||
// use regular text for other modes (@ context)
|
||||
<Text color={textColor}>{suggestion.label}</Text>
|
||||
</Box>
|
||||
)}
|
||||
{suggestion.description ? (
|
||||
<Box flexGrow={1}>
|
||||
<Text color={textColor} wrap="wrap">
|
||||
|
|
|
@ -102,7 +102,7 @@ export function ThemeDialog({
|
|||
return (
|
||||
<Box
|
||||
borderStyle="round"
|
||||
borderColor={Colors.AccentPurple}
|
||||
borderColor={Colors.SubtleComment}
|
||||
flexDirection="row"
|
||||
padding={1}
|
||||
width="100%"
|
||||
|
|
|
@ -24,7 +24,7 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
|
|||
const hasPending = !toolCalls.every(
|
||||
(t) => t.status === ToolCallStatus.Success,
|
||||
);
|
||||
const borderColor = hasPending ? Colors.AccentYellow : Colors.AccentPurple;
|
||||
const borderColor = hasPending ? Colors.AccentYellow : Colors.SubtleComment;
|
||||
|
||||
return (
|
||||
<Box
|
||||
|
|
Loading…
Reference in New Issue