Skip to content

Add keyboard zoom controls#17

Merged
GordonBeeming merged 6 commits into
mainfrom
gb/keyboard-zoom-controls
Jun 22, 2026
Merged

Add keyboard zoom controls#17
GordonBeeming merged 6 commits into
mainfrom
gb/keyboard-zoom-controls

Conversation

@GordonBeeming

@GordonBeeming GordonBeeming commented Jun 21, 2026

Copy link
Copy Markdown
Owner

Summary

  • Add editor-only zoom shortcuts for code font size across all files.
  • Add whole-app zoom shortcuts, persist zoom preferences, and keep the shell filling the viewport when zoomed out.
  • Add a draggable, keyboard-accessible project tree/sidebar width with per-workspace persistence.
  • Update key binding docs, command palette entries, and focused tests.

Test plan

  • npm test
  • npm run build
  • npm run menu:check
  • cargo test --manifest-path src-tauri/Cargo.toml

Closes #16

@GordonBeeming GordonBeeming marked this pull request as ready for review June 21, 2026 12:52
Copilot AI review requested due to automatic review settings June 21, 2026 12:52

@gemini-code-assist gemini-code-assist Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

Comment thread src/App.tsx
Comment thread src/App.tsx
Comment thread src/editorTheme.ts Outdated
Comment thread src/EditorPane.tsx Outdated
Comment thread src/EditorPane.tsx Outdated

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 editorFontSize and appZoomPercent (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.

Comment thread src/EditorPane.tsx

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 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".

Comment thread src/EditorPane.tsx Outdated
Comment thread src/styles.css
Copilot AI review requested due to automatic review settings June 21, 2026 23:27

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 9 out of 9 changed files in this pull request and generated 2 comments.

Comment thread src/EditorPane.tsx
Comment thread src/App.tsx Outdated
Copilot AI review requested due to automatic review settings June 21, 2026 23:38

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 9 out of 9 changed files in this pull request and generated 2 comments.

Comment thread src/EditorPane.tsx Outdated
Comment thread src/EditorPane.tsx Outdated
GordonBeeming and others added 6 commits June 22, 2026 13:58
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>
@GordonBeeming GordonBeeming force-pushed the gb/keyboard-zoom-controls branch from 6833696 to dc86550 Compare June 22, 2026 04:07
@GordonBeeming GordonBeeming merged commit acd9ae8 into main Jun 22, 2026
3 of 5 checks passed
@GordonBeeming GordonBeeming deleted the gb/keyboard-zoom-controls branch June 22, 2026 05:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add keyboard zoom controls for editor and app UI

2 participants