Use slash command instead of context drawer to display open files in editor to reduce flickering in the UI (#5858)

This commit is contained in:
Shreya Keshive
2025-08-08 17:26:11 -04:00
committed by GitHub
parent 60bde58f29
commit 344ee29f77
5 changed files with 90 additions and 160 deletions

View File

@@ -1,66 +0,0 @@
/**
* @license
* Copyright 2025 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
import { render } from 'ink-testing-library';
import { describe, it, expect } from 'vitest';
import { IDEContextDetailDisplay } from './IDEContextDetailDisplay.js';
import { type IdeContext } from '@google/gemini-cli-core';
describe('IDEContextDetailDisplay', () => {
it('renders an empty string when there are no open files', () => {
const ideContext: IdeContext = {
workspaceState: {
openFiles: [],
},
};
const { lastFrame } = render(
<IDEContextDetailDisplay
ideContext={ideContext}
detectedIdeDisplay="VS Code"
/>,
);
expect(lastFrame()).toBe('');
});
it('renders a list of open files with active status', () => {
const ideContext: IdeContext = {
workspaceState: {
openFiles: [
{ path: '/foo/bar.txt', isActive: true },
{ path: '/foo/baz.txt', isActive: false },
],
},
};
const { lastFrame } = render(
<IDEContextDetailDisplay
ideContext={ideContext}
detectedIdeDisplay="VS Code"
/>,
);
const output = lastFrame();
expect(output).toMatchSnapshot();
});
it('handles duplicate basenames by showing path hints', () => {
const ideContext: IdeContext = {
workspaceState: {
openFiles: [
{ path: '/foo/bar.txt', isActive: true },
{ path: '/qux/bar.txt', isActive: false },
{ path: '/foo/unique.txt', isActive: false },
],
},
};
const { lastFrame } = render(
<IDEContextDetailDisplay
ideContext={ideContext}
detectedIdeDisplay="VS Code"
/>,
);
const output = lastFrame();
expect(output).toMatchSnapshot();
});
});

View File

@@ -1,66 +0,0 @@
/**
* @license
* Copyright 2025 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
import { type File, type IdeContext } from '@google/gemini-cli-core';
import { Box, Text } from 'ink';
import path from 'node:path';
import { Colors } from '../colors.js';
interface IDEContextDetailDisplayProps {
ideContext: IdeContext | undefined;
detectedIdeDisplay: string | undefined;
}
export function IDEContextDetailDisplay({
ideContext,
detectedIdeDisplay,
}: IDEContextDetailDisplayProps) {
const openFiles = ideContext?.workspaceState?.openFiles;
if (!openFiles || openFiles.length === 0) {
return null;
}
const basenameCounts = new Map<string, number>();
for (const file of openFiles) {
const basename = path.basename(file.path);
basenameCounts.set(basename, (basenameCounts.get(basename) || 0) + 1);
}
return (
<Box
flexDirection="column"
marginTop={1}
borderStyle="round"
borderColor={Colors.AccentCyan}
paddingX={1}
>
<Text color={Colors.AccentCyan} bold>
{detectedIdeDisplay ? detectedIdeDisplay : 'IDE'} Context (ctrl+e to
toggle)
</Text>
{openFiles.length > 0 && (
<Box flexDirection="column" marginTop={1}>
<Text bold>Open files:</Text>
{openFiles.map((file: File) => {
const basename = path.basename(file.path);
const isDuplicate = (basenameCounts.get(basename) || 0) > 1;
const parentDir = path.basename(path.dirname(file.path));
const displayName = isDuplicate
? `${basename} (/${parentDir})`
: basename;
return (
<Text key={file.path}>
- {displayName}
{file.isActive ? ' (active)' : ''}
</Text>
);
})}
</Box>
)}
</Box>
);
}