gemini-cli/packages/cli/src/ui/components/Footer.tsx

125 lines
3.5 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/**
* @license
* Copyright 2025 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
import React from 'react';
import { Box, Text } from 'ink';
import { Colors } from '../colors.js';
import { shortenPath, tildeifyPath, tokenLimit } from '@google/gemini-cli-core';
import { ConsoleSummaryDisplay } from './ConsoleSummaryDisplay.js';
import process from 'node:process';
import Gradient from 'ink-gradient';
import { MemoryUsageDisplay } from './MemoryUsageDisplay.js';
interface FooterProps {
model: string;
targetDir: string;
branchName?: string;
debugMode: boolean;
debugMessage: string;
corgiMode: boolean;
errorCount: number;
showErrorDetails: boolean;
showMemoryUsage?: boolean;
promptTokenCount: number;
nightly: boolean;
vimMode?: string;
}
export const Footer: React.FC<FooterProps> = ({
model,
targetDir,
branchName,
debugMode,
debugMessage,
corgiMode,
errorCount,
showErrorDetails,
showMemoryUsage,
promptTokenCount,
nightly,
vimMode,
}) => {
const limit = tokenLimit(model);
const percentage = promptTokenCount / limit;
return (
<Box justifyContent="space-between" width="100%">
<Box>
{vimMode && <Text color={Colors.Gray}>[{vimMode}] </Text>}
{nightly ? (
<Gradient colors={Colors.GradientColors}>
<Text>
{shortenPath(tildeifyPath(targetDir), 70)}
{branchName && <Text> ({branchName}*)</Text>}
</Text>
</Gradient>
) : (
<Text color={Colors.LightBlue}>
{shortenPath(tildeifyPath(targetDir), 70)}
{branchName && <Text color={Colors.Gray}> ({branchName}*)</Text>}
</Text>
)}
{debugMode && (
<Text color={Colors.AccentRed}>
{' ' + (debugMessage || '--debug')}
</Text>
)}
</Box>
{/* Middle Section: Centered Sandbox Info */}
<Box
flexGrow={1}
alignItems="center"
justifyContent="center"
display="flex"
>
{process.env.SANDBOX && process.env.SANDBOX !== 'sandbox-exec' ? (
<Text color="green">
{process.env.SANDBOX.replace(/^gemini-(?:cli-)?/, '')}
</Text>
) : process.env.SANDBOX === 'sandbox-exec' ? (
<Text color={Colors.AccentYellow}>
macOS Seatbelt{' '}
<Text color={Colors.Gray}>({process.env.SEATBELT_PROFILE})</Text>
</Text>
) : (
<Text color={Colors.AccentRed}>
no sandbox <Text color={Colors.Gray}>(see /docs)</Text>
</Text>
)}
</Box>
{/* Right Section: Gemini Label and Console Summary */}
<Box alignItems="center">
<Text color={Colors.AccentBlue}>
{' '}
{model}{' '}
<Text color={Colors.Gray}>
({((1 - percentage) * 100).toFixed(0)}% context left)
</Text>
</Text>
{corgiMode && (
<Text>
<Text color={Colors.Gray}>| </Text>
<Text color={Colors.AccentRed}></Text>
<Text color={Colors.Foreground}>(´</Text>
<Text color={Colors.AccentRed}></Text>
<Text color={Colors.Foreground}>`)</Text>
<Text color={Colors.AccentRed}>▼ </Text>
</Text>
)}
{!showErrorDetails && errorCount > 0 && (
<Box>
<Text color={Colors.Gray}>| </Text>
<ConsoleSummaryDisplay errorCount={errorCount} />
</Box>
)}
{showMemoryUsage && <MemoryUsageDisplay />}
</Box>
</Box>
);
};