feat(code): add Visual Studio Code style UI zoom#2515
Open
daniektj wants to merge 1 commit into
Open
Conversation
Add window-level zoom controllable via Ctrl/Cmd +, -, and 0, the View menu (Zoom In/Out/Reset), and a control in Settings -> Appearance with a live percentage. The level is owned by a main-process ZoomService, persists across restarts (alongside window state), and is re-applied after web-contents reloads. Key handling lives in a pure, unit-tested resolveZoomIntent helper. No OS-specific code, so it is portable to macOS and Linux. Generated-By: PostHog Code Task-Id: 99e347cb-9d2a-4225-8425-1fff9daab0ad
Contributor
Prompt To Fix All With AIFix the following 2 code review issues. Work through them one at a time, proposing concise fixes.
---
### Issue 1 of 2
packages/platform/src/main-window.ts:5-6
`getZoomLevel()` is never called by any consumer in this PR. `ZoomService` initialises its state from `persistence.getZoomLevel()` and tracks it in `currentLevel`, writing to the window via `setZoomLevel` only. The method is also mocked in the service tests but never asserted against. Under the "no superfluous parts" rule it (and its implementation in `ElectronMainWindow`) can be removed.
### Issue 2 of 2
apps/code/src/main/services/zoom/schemas.test.ts:9-51
The `clampZoomLevel` and `zoomLevelToPercent` tests bundle multiple related cases into single `it` blocks. The team rule is to prefer parameterised tests (`it.each`). Converting these to `it.each` tables would make it easier to add cases and immediately see which input caused a failure. The same pattern applies to `zoomKeybinding.test.ts` (e.g. the "maps zoom-in keys" and "ignores unrelated keys" blocks).
Reviews (1): Last reviewed commit: "feat(code): add VS Code-style UI zoom" | Re-trigger Greptile |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
Comment on lines
5
to
6
| restore(): void; | ||
| onFocus(handler: () => void): () => void; |
Contributor
There was a problem hiding this comment.
getZoomLevel() is never called by any consumer in this PR. ZoomService initialises its state from persistence.getZoomLevel() and tracks it in currentLevel, writing to the window via setZoomLevel only. The method is also mocked in the service tests but never asserted against. Under the "no superfluous parts" rule it (and its implementation in ElectronMainWindow) can be removed.
Prompt To Fix With AI
This is a comment left during a code review.
Path: packages/platform/src/main-window.ts
Line: 5-6
Comment:
`getZoomLevel()` is never called by any consumer in this PR. `ZoomService` initialises its state from `persistence.getZoomLevel()` and tracks it in `currentLevel`, writing to the window via `setZoomLevel` only. The method is also mocked in the service tests but never asserted against. Under the "no superfluous parts" rule it (and its implementation in `ElectronMainWindow`) can be removed.
How can I resolve this? If you propose a fix, please make it concise.Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
Comment on lines
+9
to
+51
| describe("clampZoomLevel", () => { | ||
| it("leaves in-range, on-step values untouched", () => { | ||
| expect(clampZoomLevel(0)).toBe(0); | ||
| expect(clampZoomLevel(0.5)).toBe(0.5); | ||
| expect(clampZoomLevel(-1.5)).toBe(-1.5); | ||
| }); | ||
|
|
||
| it("snaps to the nearest 0.5 step", () => { | ||
| expect(clampZoomLevel(1.3)).toBe(1.5); | ||
| expect(clampZoomLevel(1.2)).toBe(1.0); | ||
| expect(clampZoomLevel(-1.3)).toBe(-1.5); | ||
| expect(clampZoomLevel(0.24)).toBe(0); | ||
| }); | ||
|
|
||
| it("clamps above the maximum", () => { | ||
| expect(clampZoomLevel(10)).toBe(MAX_ZOOM_LEVEL); | ||
| expect(clampZoomLevel(MAX_ZOOM_LEVEL + 0.5)).toBe(MAX_ZOOM_LEVEL); | ||
| }); | ||
|
|
||
| it("clamps below the minimum", () => { | ||
| expect(clampZoomLevel(-10)).toBe(MIN_ZOOM_LEVEL); | ||
| expect(clampZoomLevel(MIN_ZOOM_LEVEL - 0.5)).toBe(MIN_ZOOM_LEVEL); | ||
| }); | ||
|
|
||
| it("handles boundary values exactly", () => { | ||
| expect(clampZoomLevel(MAX_ZOOM_LEVEL)).toBe(MAX_ZOOM_LEVEL); | ||
| expect(clampZoomLevel(MIN_ZOOM_LEVEL)).toBe(MIN_ZOOM_LEVEL); | ||
| }); | ||
| }); | ||
|
|
||
| describe("zoomLevelToPercent", () => { | ||
| it("returns 100% at level 0", () => { | ||
| expect(zoomLevelToPercent(0)).toBe(100); | ||
| }); | ||
|
|
||
| it("computes the 1.2^level factor as a rounded percentage", () => { | ||
| expect(zoomLevelToPercent(1)).toBe(120); | ||
| expect(zoomLevelToPercent(2)).toBe(144); | ||
| expect(zoomLevelToPercent(0.5)).toBe(110); | ||
| expect(zoomLevelToPercent(-1)).toBe(83); | ||
| expect(zoomLevelToPercent(MAX_ZOOM_LEVEL)).toBe(249); | ||
| expect(zoomLevelToPercent(MIN_ZOOM_LEVEL)).toBe(58); | ||
| }); |
Contributor
There was a problem hiding this comment.
clampZoomLevel and zoomLevelToPercent tests bundle multiple related cases into single it blocks. The team rule is to prefer parameterised tests (it.each). Converting these to it.each tables would make it easier to add cases and immediately see which input caused a failure. The same pattern applies to zoomKeybinding.test.ts (e.g. the "maps zoom-in keys" and "ignores unrelated keys" blocks).
Context Used: Do not attempt to comment on incorrect alphabetica... (source)
Prompt To Fix With AI
This is a comment left during a code review.
Path: apps/code/src/main/services/zoom/schemas.test.ts
Line: 9-51
Comment:
The `clampZoomLevel` and `zoomLevelToPercent` tests bundle multiple related cases into single `it` blocks. The team rule is to prefer parameterised tests (`it.each`). Converting these to `it.each` tables would make it easier to add cases and immediately see which input caused a failure. The same pattern applies to `zoomKeybinding.test.ts` (e.g. the "maps zoom-in keys" and "ignores unrelated keys" blocks).
**Context Used:** Do not attempt to comment on incorrect alphabetica... ([source](https://app.greptile.com/review/custom-context?memory=instruction-0))
How can I resolve this? If you propose a fix, please make it concise.Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
Member
|
hey @daniektj, I can already do Ctrl/⌘ +, -, and 0, the View menu (Zoom In/Out/Reset) from the native electron renderer? I'm confused on if this is solving a specific issue you were having? |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds window-level zoom like VS Code:
Ctrl/⌘ +,-, and0, the View menu (Zoom In/Out/Reset), and a control in Settings → Appearance with a live percentage.The zoom level is owned by a main-process
ZoomService, persists across restarts (stored alongside window state), and is re-applied after web-contents reloads (zoom resets on every load). Keyboard handling lives in a pure, unit-testedresolveZoomIntenthelper instead of react-hotkeys-hook, which mis-parses the=/-/0symbol keys.There is no OS-specific code, so the behavior is portable to macOS and Linux (the native window controls intentionally stay fixed, matching VS Code).
Testing
ZoomServicebehavior (zoom in/out/reset, clamping, persistence, restore)typecheckandbiomepass cleanCreated with PostHog Code