mirror of
https://github.com/google-gemini/gemini-cli.git
synced 2026-03-20 11:00:40 -07:00
This commit addresses several code review comments primarily focused on improving the rendering and stability of the CLI UI. Key changes include: - Passing `isPending` and `availableTerminalHeight` props to `MarkdownDisplay` to enable more intelligent rendering of content, especially for pending messages and code blocks. - Adjusting height calculations in `ToolGroupMessage` and `ToolMessage` to more accurately reflect available space. - Refining the logic in `App.tsx` for measuring and utilizing terminal height, including renaming `footerRef` to `mainControlsRef` for clarity. - Ensuring consistent prop drilling for `isPending` and `availableTerminalHeight` through `HistoryItemDisplay`, `GeminiMessage`, and `GeminiMessageContent`. - In `MarkdownDisplay`, when `isPending` is true and content exceeds `availableTerminalHeight`, the code block will now be truncated with a "... generating more ..." message. If there's insufficient space even for the message, a simpler "... code is being written ..." will be shown.
109 lines
3.7 KiB
TypeScript
109 lines
3.7 KiB
TypeScript
/**
|
|
* @license
|
|
* Copyright 2025 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
|
|
import React from 'react';
|
|
import { Box, Text } from 'ink';
|
|
import Spinner from 'ink-spinner';
|
|
import { IndividualToolCallDisplay, ToolCallStatus } from '../../types.js';
|
|
import { DiffRenderer } from './DiffRenderer.js';
|
|
import { Colors } from '../../colors.js';
|
|
import { MarkdownDisplay } from '../../utils/MarkdownDisplay.js';
|
|
|
|
export interface ToolMessageProps extends IndividualToolCallDisplay {
|
|
availableTerminalHeight: number;
|
|
}
|
|
|
|
export const ToolMessage: React.FC<ToolMessageProps> = ({
|
|
name,
|
|
description,
|
|
resultDisplay,
|
|
status,
|
|
availableTerminalHeight,
|
|
}) => {
|
|
const statusIndicatorWidth = 3;
|
|
const hasResult = resultDisplay && resultDisplay.toString().trim().length > 0;
|
|
const staticHeight = /* Header */ 1;
|
|
|
|
let displayableResult = resultDisplay;
|
|
let hiddenLines = 0;
|
|
|
|
// Truncate the overall string content if it's too long.
|
|
// MarkdownRenderer will handle specific truncation for code blocks within this content.
|
|
if (typeof resultDisplay === 'string' && resultDisplay.length > 0) {
|
|
const lines = resultDisplay.split('\n');
|
|
// Estimate available height for this specific tool message content area
|
|
// This is a rough estimate; ideally, we'd have a more precise measurement.
|
|
const contentHeightEstimate = availableTerminalHeight - staticHeight - 5; // Subtracting lines for tool name, status, padding etc.
|
|
if (lines.length > contentHeightEstimate && contentHeightEstimate > 0) {
|
|
displayableResult = lines.slice(0, contentHeightEstimate).join('\n');
|
|
hiddenLines = lines.length - contentHeightEstimate;
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Box paddingX={1} paddingY={0} flexDirection="column">
|
|
<Box minHeight={1}>
|
|
{/* Status Indicator */}
|
|
<Box minWidth={statusIndicatorWidth}>
|
|
{(status === ToolCallStatus.Pending ||
|
|
status === ToolCallStatus.Executing) && <Spinner type="dots" />}
|
|
{status === ToolCallStatus.Success && (
|
|
<Text color={Colors.AccentGreen}>✔</Text>
|
|
)}
|
|
{status === ToolCallStatus.Confirming && (
|
|
<Text color={Colors.AccentYellow}>?</Text>
|
|
)}
|
|
{status === ToolCallStatus.Canceled && (
|
|
<Text color={Colors.AccentYellow} bold>
|
|
-
|
|
</Text>
|
|
)}
|
|
{status === ToolCallStatus.Error && (
|
|
<Text color={Colors.AccentRed} bold>
|
|
x
|
|
</Text>
|
|
)}
|
|
</Box>
|
|
<Box>
|
|
<Text
|
|
wrap="truncate-end"
|
|
strikethrough={status === ToolCallStatus.Canceled}
|
|
>
|
|
<Text bold>{name}</Text>{' '}
|
|
<Text color={Colors.SubtleComment}>{description}</Text>
|
|
</Text>
|
|
</Box>
|
|
</Box>
|
|
{hasResult && (
|
|
<Box paddingLeft={statusIndicatorWidth} width="100%">
|
|
<Box flexDirection="column">
|
|
{typeof displayableResult === 'string' && (
|
|
<Box flexDirection="column">
|
|
<MarkdownDisplay
|
|
text={displayableResult}
|
|
isPending={false}
|
|
availableTerminalHeight={availableTerminalHeight}
|
|
/>
|
|
</Box>
|
|
)}
|
|
{typeof displayableResult === 'object' && (
|
|
<DiffRenderer diffContent={displayableResult.fileDiff} />
|
|
)}
|
|
{hiddenLines > 0 && (
|
|
<Box>
|
|
<Text color={Colors.SubtleComment}>
|
|
... {hiddenLines} more line{hiddenLines === 1 ? '' : 's'}{' '}
|
|
hidden ...
|
|
</Text>
|
|
</Box>
|
|
)}
|
|
</Box>
|
|
</Box>
|
|
)}
|
|
</Box>
|
|
);
|
|
};
|