Update setting search UX (#14451)

This commit is contained in:
Adib234
2025-12-03 22:43:11 -08:00
committed by GitHub
parent 9bc5a4d64f
commit d5e5f58737
3 changed files with 261 additions and 253 deletions
@@ -40,6 +40,12 @@ import {
const mockToggleVimEnabled = vi.fn();
const mockSetVimMode = vi.fn();
vi.mock('../contexts/UIStateContext.js', () => ({
useUIState: () => ({
mainAreaWidth: 100, // Fixed width for consistent snapshots
}),
}));
enum TerminalKeys {
ENTER = '\u000D',
TAB = '\t',
@@ -1107,7 +1113,7 @@ describe('SettingsDialog', () => {
});
describe('Search Functionality', () => {
it('should enter search mode when "/" is pressed', async () => {
it('should display text entered in search', async () => {
const settings = createMockSettings();
const onSelect = vi.fn();
@@ -1117,7 +1123,7 @@ describe('SettingsDialog', () => {
await waitFor(() => {
expect(lastFrame()).not.toContain('> Search:');
});
expect(lastFrame()).toContain('(press / to search)');
expect(lastFrame()).toContain('Search to filter');
// Press '/' to enter search mode
act(() => {
@@ -1125,8 +1131,8 @@ describe('SettingsDialog', () => {
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search:');
expect(lastFrame()).not.toContain('(press / to search)');
expect(lastFrame()).toContain('/');
expect(lastFrame()).not.toContain('Search to filter');
});
unmount();
@@ -1138,45 +1144,29 @@ describe('SettingsDialog', () => {
const { lastFrame, stdin, unmount } = renderDialog(settings, onSelect);
// Enter search mode
act(() => {
stdin.write('/');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search:');
});
// Type "vim"
act(() => {
stdin.write('yolo');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search: yolo');
expect(lastFrame()).toContain('Disable YOLO Mode'); // Should be filtered to show Vim Mode
expect(lastFrame()).toContain('yolo');
expect(lastFrame()).toContain('Disable YOLO Mode');
});
unmount();
});
it('should exit search mode when Escape is pressed', async () => {
it('should exit search settings when Escape is pressed', async () => {
const settings = createMockSettings();
const onSelect = vi.fn();
const { lastFrame, stdin, unmount } = renderDialog(settings, onSelect);
act(() => {
stdin.write('/');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search:');
});
act(() => {
stdin.write('vim');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search: vim');
expect(lastFrame()).toContain('vim');
});
// Press Escape
@@ -1185,10 +1175,9 @@ describe('SettingsDialog', () => {
});
await waitFor(() => {
expect(lastFrame()).not.toContain('> Search:');
expect(lastFrame()).toContain('(press / to search)');
expect(lastFrame()).toContain('Vim Mode'); // All settings should be visible again
expect(lastFrame()).toContain('Disable Auto Update'); // All settings should be visible again
// onSelect is called with (settingName, scope).
// undefined settingName means "close dialog"
expect(onSelect).toHaveBeenCalledWith(undefined, expect.anything());
});
unmount();
@@ -1200,18 +1189,11 @@ describe('SettingsDialog', () => {
const { lastFrame, stdin, unmount } = renderDialog(settings, onSelect);
act(() => {
stdin.write('/');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search:');
});
act(() => {
stdin.write('vimm');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search: vimm');
expect(lastFrame()).toContain('vimm');
});
// Press backspace
@@ -1220,7 +1202,7 @@ describe('SettingsDialog', () => {
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search: vim');
expect(lastFrame()).toContain('vim');
expect(lastFrame()).toContain('Vim Mode');
expect(lastFrame()).not.toContain(
'Codebase Investigator Max Num Turns',
@@ -1230,63 +1212,20 @@ describe('SettingsDialog', () => {
unmount();
});
it('should clear search query and show all settings when exiting search mode', async () => {
it('should display nothing when search yields no results', async () => {
const settings = createMockSettings();
const onSelect = vi.fn();
const { lastFrame, stdin, unmount } = renderDialog(settings, onSelect);
act(() => {
stdin.write('/');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search:');
});
act(() => {
stdin.write('test');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search: test');
});
// Press Escape
act(() => {
stdin.write(TerminalKeys.ESCAPE);
});
await waitFor(() => {
expect(lastFrame()).not.toContain('> Search:');
expect(lastFrame()).toContain('(press / to search)');
expect(lastFrame()).toContain('Vim Mode');
expect(lastFrame()).toContain('Disable Auto Update');
});
unmount();
});
it('should display "No matches found." when search yields no results', async () => {
const settings = createMockSettings();
const onSelect = vi.fn();
const { lastFrame, stdin, unmount } = renderDialog(settings, onSelect);
// Enter search mode
act(() => {
stdin.write('/');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search:');
});
// Type a search query that won't match any settings
act(() => {
stdin.write('nonexistentsetting');
});
await waitFor(() => {
expect(lastFrame()).toContain('> Search: nonexistentsetting');
expect(lastFrame()).toContain('No matches found.');
expect(lastFrame()).toContain('nonexistentsetting');
expect(lastFrame()).toContain('');
expect(lastFrame()).not.toContain('Vim Mode'); // Should not contain any settings
expect(lastFrame()).not.toContain('Disable Auto Update'); // Should not contain any settings
});