Add keyboard zoom controls#17
Conversation
There was a problem hiding this comment.
Code Review
This pull request introduces keyboard shortcuts and command palette actions to zoom the editor font size and the overall application zoom, persisting these settings in the Tauri backend. The reviewer feedback highlights a critical performance issue where changing the font size destroys and re-creates the entire CodeMirror editor instance, losing state like undo history and scroll position. To resolve this, the reviewer suggests using a CSS custom property (--editor-font-size) on the root app shell to update the font size smoothly via CSS inheritance, keeping the CodeMirror theme static. Additionally, the reviewer points out a React anti-pattern of triggering side effects inside functional state updaters.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
There was a problem hiding this comment.
Pull request overview
Implements keyboard-driven zoom controls for both the code editor font size and the overall app UI, including persistence across restarts and updates to docs/tests to reflect the new shortcuts and settings.
Changes:
- Added persisted preferences for
editorFontSizeandappZoomPercent(frontend + Tauri backend) with sanitization/clamping. - Implemented new keyboard shortcuts + command palette entries to zoom editor font size and whole-app UI, and applied app zoom via a CSS custom property.
- Updated editor theme to support a configurable font size and extended tests/docs for the new shortcuts.
Reviewed changes
Copilot reviewed 9 out of 9 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| src/tauri.ts | Extends persisted UI snapshot schema with editorFontSize and appZoomPercent defaults. |
| src/tauri.test.ts | Updates hosted-mode default UI snapshot expectations to include new persisted zoom fields. |
| src/styles.css | Applies app-level zoom via zoom: var(--app-zoom, 1) on .app-shell. |
| src/editorTheme.ts | Adds font-size parameterization to the CodeMirror theme extension. |
| src/EditorPane.tsx | Threads editorFontSize into editor theme construction and triggers re-init on font-size changes. |
| src/App.tsx | Adds zoom state, persistence wiring, command palette commands, shortcut matching, and CSS var injection for app zoom. |
| src/App.test.tsx | Adds coverage for zoom shortcuts and persisted-state updates. |
| src-tauri/src/lib.rs | Adds persisted view settings fields + defaults + clamping for zoom settings on the backend. |
| docs/development.md | Documents the new zoom keyboard shortcuts. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: b9289ab663
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Co-authored-by: Codex <noreply@openai.com> Co-authored-by: GitButler <gitbutler@gitbutler.com>
Co-authored-by: Codex <noreply@openai.com> Co-authored-by: GitButler <gitbutler@gitbutler.com>
Co-authored-by: Codex <noreply@openai.com> Co-authored-by: GitButler <gitbutler@gitbutler.com>
Address reviewer comments: - Make zoom status updates pure React state changes - Drive editor font size through a shell CSS variable - Keep CodeMirror mounted when editor zoom changes Co-authored-by: Codex <noreply@openai.com> Co-authored-by: GitButler <gitbutler@gitbutler.com>
Address reviewer comments: - Expose the resize handle as a keyboard-focusable separator - Keep sidebar width value ARIA on the splitter role Co-authored-by: Codex <noreply@openai.com> Co-authored-by: GitButler <gitbutler@gitbutler.com>
Address reviewer comments: - Remove the stale editorFontSize prop from EditorPaneProps - Remove the unused editorFontSize destructuring from EditorPane Co-authored-by: Codex <noreply@openai.com>
6833696 to
dc86550
Compare
Summary
Test plan
npm testnpm run buildnpm run menu:checkcargo test --manifest-path src-tauri/Cargo.tomlCloses #16