Code review fixes for show question mark pr. (google-gemini#18480)

Author: jacob314

packages/cli/src/ui/components/Composer.test.tsx

@@ -6,7 +6,7 @@
 
 import { describe, it, expect, vi } from 'vitest';
 import { render } from '../../test-utils/render.js';
-import { Text } from 'ink';
+import { Box, Text } from 'ink';
 import { Composer } from './Composer.js';
 import { UIStateContext, type UIState } from '../contexts/UIStateContext.js';
 import {
@@ -598,4 +598,29 @@ describe('Composer', () => {
       );
     });
   });
+
+  describe('Shortcuts Hint', () => {
+    it('hides shortcuts hint when a action is required (e.g. dialog is open)', () => {
+      const uiState = createMockUIState({
+        customDialog: (
+          <Box>
+            <Text>Test Dialog</Text>
+            <Text>Test Content</Text>
+          </Box>
+        ),
+      });
+
+      const { lastFrame } = renderComposer(uiState);
+
+      expect(lastFrame()).not.toContain('ShortcutsHint');
+    });
+
+    it('keeps shortcuts hint visible when no action is required', () => {
+      const uiState = createMockUIState();
+
+      const { lastFrame } = renderComposer(uiState);
+
+      expect(lastFrame()).toContain('ShortcutsHint');
+    });
+  });
 });

packages/cli/src/ui/components/Composer.tsx

@@ -136,11 +136,11 @@ export const Composer = ({ isFocused = true }: { isFocused?: boolean }) => {
             flexDirection="column"
             alignItems={isNarrow ? 'flex-start' : 'flex-end'}
           >
-            <ShortcutsHint />
+            {!hasPendingActionRequired && <ShortcutsHint />}
           </Box>
         </Box>
         {uiState.shortcutsHelpVisible && <ShortcutsHelp />}
-        <HorizontalLine width={uiState.terminalWidth} />
+        <HorizontalLine />
         <Box
           justifyContent={
             settings.merged.ui.hideContextSummary

packages/cli/src/ui/components/InputPrompt.test.tsx

@@ -4028,6 +4028,55 @@ describe('InputPrompt', () => {
       });
     });
   });
+
+  describe('shortcuts help visibility', () => {
+    it.each([
+      {
+        name: 'terminal paste event occurs',
+        input: '\x1b[200~pasted text\x1b[201~',
+      },
+      {
+        name: 'Ctrl+V (PASTE_CLIPBOARD) is pressed',
+        input: '\x16',
+        setupMocks: () => {
+          vi.mocked(clipboardUtils.clipboardHasImage).mockResolvedValue(false);
+          vi.mocked(clipboardy.read).mockResolvedValue('clipboard text');
+        },
+      },
+      {
+        name: 'mouse right-click paste occurs',
+        input: '\x1b[<2;1;1m',
+        mouseEventsEnabled: true,
+        setupMocks: () => {
+          vi.mocked(clipboardUtils.clipboardHasImage).mockResolvedValue(false);
+          vi.mocked(clipboardy.read).mockResolvedValue('clipboard text');
+        },
+      },
+    ])(
+      'should close shortcuts help when a $name',
+      async ({ input, setupMocks, mouseEventsEnabled }) => {
+        setupMocks?.();
+        const setShortcutsHelpVisible = vi.fn();
+        const { stdin, unmount } = renderWithProviders(
+          <InputPrompt {...props} />,
+          {
+            uiState: { shortcutsHelpVisible: true },
+            uiActions: { setShortcutsHelpVisible },
+            mouseEventsEnabled,
+          },
+        );
+
+        await act(async () => {
+          stdin.write(input);
+        });
+
+        await waitFor(() => {
+          expect(setShortcutsHelpVisible).toHaveBeenCalledWith(false);
+        });
+        unmount();
+      },
+    );
+  });
 });
 
 function clean(str: string | undefined): string {

packages/cli/src/ui/components/InputPrompt.tsx

@@ -359,6 +359,9 @@ export const InputPrompt: React.FC<InputPromptProps> = ({
 
   // Handle clipboard image pasting with Ctrl+V
   const handleClipboardPaste = useCallback(async () => {
+    if (shortcutsHelpVisible) {
+      setShortcutsHelpVisible(false);
+    }
     try {
       if (await clipboardHasImage()) {
         const imagePath = await saveClipboardImage(config.getTargetDir());
@@ -403,7 +406,14 @@ export const InputPrompt: React.FC<InputPromptProps> = ({
     } catch (error) {
       debugLogger.error('Error handling paste:', error);
     }
-  }, [buffer, config, stdout, settings]);
+  }, [
+    buffer,
+    config,
+    stdout,
+    settings,
+    shortcutsHelpVisible,
+    setShortcutsHelpVisible,
+  ]);
 
   useMouseClick(
     innerBoxRef,
@@ -553,6 +563,9 @@ export const InputPrompt: React.FC<InputPromptProps> = ({
       }
 
       if (key.name === 'paste') {
+        if (shortcutsHelpVisible) {
+          setShortcutsHelpVisible(false);
+        }
         // Record paste time to prevent accidental auto-submission
         if (!isTerminalPasteTrusted(kittyProtocol.enabled)) {
           setRecentUnsafePasteTime(Date.now());

packages/cli/src/ui/components/ShortcutsHelp.test.tsx

@@ -0,0 +1,49 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { describe, it, expect, afterEach, vi } from 'vitest';
+import { renderWithProviders } from '../../test-utils/render.js';
+import { ShortcutsHelp } from './ShortcutsHelp.js';
+
+describe('ShortcutsHelp', () => {
+  const originalPlatform = process.platform;
+
+  afterEach(() => {
+    Object.defineProperty(process, 'platform', {
+      value: originalPlatform,
+    });
+    vi.restoreAllMocks();
+  });
+
+  const testCases = [
+    { name: 'wide', width: 100 },
+    { name: 'narrow', width: 40 },
+  ];
+
+  const platforms = [
+    { name: 'mac', value: 'darwin' },
+    { name: 'linux', value: 'linux' },
+  ] as const;
+
+  it.each(
+    platforms.flatMap((platform) =>
+      testCases.map((testCase) => ({ ...testCase, platform })),
+    ),
+  )(
+    'renders correctly in $name mode on $platform.name',
+    ({ width, platform }) => {
+      Object.defineProperty(process, 'platform', {
+        value: platform.value,
+      });
+
+      const { lastFrame } = renderWithProviders(<ShortcutsHelp />, {
+        width,
+      });
+      expect(lastFrame()).toContain('shell mode');
+      expect(lastFrame()).toMatchSnapshot();
+    },
+  );
+});