diff --git a/packages/cli/src/ui/components/ContextUsageDisplay.tsx b/packages/cli/src/ui/components/ContextUsageDisplay.tsx
new file mode 100644
index 00000000..037be333
--- /dev/null
+++ b/packages/cli/src/ui/components/ContextUsageDisplay.tsx
@@ -0,0 +1,25 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { Text } from 'ink';
+import { Colors } from '../colors.js';
+import { tokenLimit } from '@google/gemini-cli-core';
+
+export const ContextUsageDisplay = ({
+ promptTokenCount,
+ model,
+}: {
+ promptTokenCount: number;
+ model: string;
+}) => {
+ const percentage = promptTokenCount / tokenLimit(model);
+
+ return (
+
+ ({((1 - percentage) * 100).toFixed(0)}% context left)
+
+ );
+};
diff --git a/packages/cli/src/ui/components/Footer.tsx b/packages/cli/src/ui/components/Footer.tsx
index acc55870..14cda5f3 100644
--- a/packages/cli/src/ui/components/Footer.tsx
+++ b/packages/cli/src/ui/components/Footer.tsx
@@ -7,12 +7,12 @@
import React from 'react';
import { Box, Text } from 'ink';
import { Colors } from '../colors.js';
-import { shortenPath, tildeifyPath, tokenLimit } from '@google/gemini-cli-core';
+import { shortenPath, tildeifyPath } 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';
-
+import { ContextUsageDisplay } from './ContextUsageDisplay.js';
import { DebugProfiler } from './DebugProfiler.js';
interface FooterProps {
@@ -43,85 +43,81 @@ export const Footer: React.FC = ({
promptTokenCount,
nightly,
vimMode,
-}) => {
- const limit = tokenLimit(model);
- const percentage = promptTokenCount / limit;
-
- return (
-
-
- {debugMode && }
- {vimMode && [{vimMode}] }
- {nightly ? (
-
-
- {shortenPath(tildeifyPath(targetDir), 70)}
- {branchName && ({branchName}*)}
-
-
- ) : (
-
- {shortenPath(tildeifyPath(targetDir), 70)}
- {branchName && ({branchName}*)}
-
- )}
- {debugMode && (
-
- {' ' + (debugMessage || '--debug')}
-
- )}
-
-
- {/* Middle Section: Centered Sandbox Info */}
-
- {process.env.SANDBOX && process.env.SANDBOX !== 'sandbox-exec' ? (
-
- {process.env.SANDBOX.replace(/^gemini-(?:cli-)?/, '')}
-
- ) : process.env.SANDBOX === 'sandbox-exec' ? (
-
- macOS Seatbelt{' '}
- ({process.env.SEATBELT_PROFILE})
-
- ) : (
-
- no sandbox (see /docs)
-
- )}
-
-
- {/* Right Section: Gemini Label and Console Summary */}
-
-
- {' '}
- {model}{' '}
-
- ({((1 - percentage) * 100).toFixed(0)}% context left)
-
-
- {corgiMode && (
+}) => (
+
+
+ {debugMode && }
+ {vimMode && [{vimMode}] }
+ {nightly ? (
+
- |
- ▼
- (´
- ᴥ
- `)
- ▼
+ {shortenPath(tildeifyPath(targetDir), 70)}
+ {branchName && ({branchName}*)}
- )}
- {!showErrorDetails && errorCount > 0 && (
-
- |
-
-
- )}
- {showMemoryUsage && }
-
+
+ ) : (
+
+ {shortenPath(tildeifyPath(targetDir), 70)}
+ {branchName && ({branchName}*)}
+
+ )}
+ {debugMode && (
+
+ {' ' + (debugMessage || '--debug')}
+
+ )}
- );
-};
+
+ {/* Middle Section: Centered Sandbox Info */}
+
+ {process.env.SANDBOX && process.env.SANDBOX !== 'sandbox-exec' ? (
+
+ {process.env.SANDBOX.replace(/^gemini-(?:cli-)?/, '')}
+
+ ) : process.env.SANDBOX === 'sandbox-exec' ? (
+
+ macOS Seatbelt{' '}
+ ({process.env.SEATBELT_PROFILE})
+
+ ) : (
+
+ no sandbox (see /docs)
+
+ )}
+
+
+ {/* Right Section: Gemini Label and Console Summary */}
+
+
+ {' '}
+ {model}{' '}
+
+
+ {corgiMode && (
+
+ |
+ ▼
+ (´
+ ᴥ
+ `)
+ ▼
+
+ )}
+ {!showErrorDetails && errorCount > 0 && (
+
+ |
+
+
+ )}
+ {showMemoryUsage && }
+
+
+);