Code review fixes for show question mark pr.

[jacob314]

Summary

This is cleanup for
#18035

Fixes #18479

[gemini-code-assist]

Summary of Changes

Hello @jacob314, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request refines the user interface and interaction within the CLI application by implementing conditional visibility for shortcut hints, ensuring the shortcuts help closes automatically during paste operations, and modernizing the rendering of key UI elements like shortcut displays and horizontal separators. These changes enhance the user experience by making the UI more context-aware and robust.

Highlights

• Conditional Shortcuts Hint Display: The ShortcutsHint component in the Composer UI is now conditionally rendered, appearing only when no action is required from the user (e.g., no dialog is open).
• Shortcuts Help Auto-Close on Paste: The ShortcutsHelp overlay will now automatically close when a paste event occurs, whether it's a terminal paste, Ctrl+V, or a mouse right-click paste.
• Refactored UI Component Rendering: The ShortcutsHelp and HorizontalLine components have been refactored to leverage Ink's Box and Text components more effectively for layout and styling, removing manual string manipulation for responsive rendering.
• Improved Test Coverage: New comprehensive test suites have been added for ShortcutsHelp and SectionHeader components, ensuring their correct rendering and behavior across different terminal widths and scenarios.

Changelog

• packages/cli/src/ui/components/Composer.test.tsx
  • Added new test cases to verify the visibility of the 'Shortcuts Hint' based on whether a custom dialog is active.
  • Imported Box component from 'ink'.
• packages/cli/src/ui/components/Composer.tsx
  • Modified ShortcutsHint to be conditionally rendered based on the hasPendingActionRequired state.
  • Removed the width prop from the HorizontalLine component, allowing it to manage its width internally.
• packages/cli/src/ui/components/InputPrompt.test.tsx
  • Introduced a new test suite to confirm that the shortcuts help closes correctly when various paste events (terminal paste, Ctrl+V, mouse right-click paste) are triggered.
• packages/cli/src/ui/components/InputPrompt.tsx
  • Added logic within handleClipboardPaste and the key event handler for 'paste' to set shortcutsHelpVisible to false if it's currently true.
  • Updated the dependency array for the handleClipboardPaste useCallback hook to include shortcutsHelpVisible and setShortcutsHelpVisible.
• packages/cli/src/ui/components/ShortcutsHelp.test.tsx
  • New file added to provide test coverage for the ShortcutsHelp component, including snapshot tests for wide and narrow terminal modes.
• packages/cli/src/ui/components/ShortcutsHelp.tsx
  • Refactored the buildShortcutRows function into buildShortcutItems to return a flat array of shortcut objects.
  • Removed dependencies on stringWidth and manual text wrapping utilities.
  • Introduced a new Shortcut functional component for rendering individual shortcut items.
  • Updated the main ShortcutsHelp component to use Ink's Box with flexWrap and width properties for responsive layout, replacing previous manual layout calculations.
  • Switched from useTerminalSize to useUIState to retrieve terminalWidth.
• packages/cli/src/ui/components/snapshots/ShortcutsHelp.test.tsx.snap
  • New snapshot file generated for ShortcutsHelp component tests.
• packages/cli/src/ui/components/shared/HorizontalLine.tsx
  • Refactored the component to use Ink's Box with borderStyle properties for rendering a horizontal line, eliminating the need for character repetition.
  • Removed the width prop, as the Box component now handles full width automatically.
• packages/cli/src/ui/components/shared/SectionHeader.test.tsx
  • New file added to include test cases for the SectionHeader component, verifying its rendering with different titles and terminal widths through snapshot tests.
• packages/cli/src/ui/components/shared/SectionHeader.tsx
  • Refactored the component to use Ink's Box and Text for rendering the header and the trailing line, utilizing flexGrow and borderStyle for a more robust and flexible layout.
  • Removed the buildHeaderLine utility and direct stringWidth usage.
• packages/cli/src/ui/components/shared/snapshots/SectionHeader.test.tsx.snap
  • New snapshot file generated for SectionHeader component tests.

Activity

• This pull request is a follow-up to a previous pull request (Add shortcuts hint and panel for discoverability #18035), indicating that it incorporates feedback or addresses issues identified during the review of the earlier changes.
• The PR also explicitly states that it 'Fixes Don't perform unneeded text measurement in ShortcutsHelp #18479', linking these changes to a specific reported issue or bug.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request introduces several high-quality refactorings and bug fixes. The ShortcutsHelp, HorizontalLine, and SectionHeader components have been significantly improved by replacing manual layout calculations with Ink's declarative flexbox-based layout, which greatly enhances code clarity and maintainability. The new logic to hide the shortcuts hint during pending actions and to dismiss the shortcuts help panel upon pasting is implemented correctly and is well-tested. The addition of comprehensive tests, including snapshot tests for the refactored components, ensures the stability of these changes. Overall, this is an excellent set of improvements with no outstanding issues.

[github-actions]

Size Change: -4.84 kB (-0.02%)

Total Size: 23.8 MB

Filename	Size	Change
./bundle/gemini.js	23.8 MB	-4.84 kB (-0.02%)

ℹ️ View Unchanged

Filename	Size
./bundle/sandbox-macos-permissive-closed.sb	1.03 kB
./bundle/sandbox-macos-permissive-open.sb	890 B
./bundle/sandbox-macos-permissive-proxied.sb	1.31 kB
./bundle/sandbox-macos-restrictive-closed.sb	3.29 kB
./bundle/sandbox-macos-restrictive-open.sb	3.36 kB
./bundle/sandbox-macos-restrictive-proxied.sb	3.56 kB

_{compressed-size-action}