mirror of
https://github.com/google-gemini/gemini-cli.git
synced 2026-08-10 00:47:16 -07:00
jacob314
44259a00e2
Checkpoint optimizing virtualized list Fixes for fallback rendering where terminalBuffer=false Change terminalBuffer false back to the default while we fix performance with very large chats. Checkpoint changes to virtualized list. Fix virtualized list NO commit Update ink version. Fix UI snapshot mismatch in MainContent tests and VirtualizedList computation Checkpoint. Optimize scrolling checkpoint Fix tests and resolve remaining issues after rebase - Fixed ToolStickyHeaderRegression scrolling logic. - Added MouseProvider to VirtualizedList test. - Updated snapshots to reflect layout changes in optimized virtual list. Fix flaky plan-mode test by removing model request assertions Fix unit tests by updating expected decisions for tool permissions after rebase use onStaticRender in VirtualizedList Checkpoint VirtualizedListClick Update version Bug fixes. Code review comment fixes. settings.json hack Update version and local tweaks.
33 lines
1.7 KiB
Markdown
33 lines
1.7 KiB
Markdown
## React & Ink (CLI UI)
|
|
|
|
- **Side Effects**: Use reducers for complex state transitions; avoid `setState`
|
|
triggers in callbacks.
|
|
- Always fix react-hooks/exhaustive-deps lint errors by adding the missing
|
|
dependencies.
|
|
- **Shortcuts**: only define keyboard shortcuts in
|
|
`packages/cli/src/ui/key/keyBindings.ts`
|
|
- Do not implement any logic performing custom string measurement or string
|
|
truncation. Use Ink layout instead leveraging ResizeObserver as needed. When
|
|
using `ResizeObserver`, prefer the `useCallback` ref pattern (as seen in
|
|
`MaxSizedBox.tsx`) to ensure size measurements are captured as soon as the
|
|
element is available, avoiding potential rendering timing issues.
|
|
- Avoid prop drilling when at all possible.
|
|
- **StaticRender**: Unlike Ink's native `<Static>` (which is printed above the
|
|
application layout and takes no space in the flex container), the custom
|
|
`<StaticRender>` component preserves its layout and _does_ take up its
|
|
measured height in the active flex container.
|
|
|
|
## Testing
|
|
|
|
- **Utilities**: Use `renderWithProviders` and `waitFor` from
|
|
`packages/cli/src/test-utils/`.
|
|
- **Snapshots**: Use `toMatchSnapshot()` to verify Ink output.
|
|
- **SVG Snapshots**: Use `await expect(renderResult).toMatchSvgSnapshot()` for
|
|
UI components whenever colors or detailed visual layout matter. SVG snapshots
|
|
capture styling accurately. Make sure to await the `waitUntilReady()` of the
|
|
render result before asserting. After updating SVG snapshots, always examine
|
|
the resulting `.svg` files (e.g. by reading their content or visually
|
|
inspecting them) to ensure the render and colors actually look as expected and
|
|
don't just contain an error message.
|
|
- **Mocks**: Use mocks as sparingly as possible.
|