feat(review): custom code font support#855
Open
backnotprop wants to merge 1 commit into
Open
Conversation
Adds a "Custom…" option to Settings → Display → Code Font that reveals a text input for any font installed on the user's machine. The rendering pipeline already accepted arbitrary family names; this exposes it in the UI. - fontDetect.ts: installed-font check via canvas width measurement against all three generic fallbacks — deterministic, no permissions, no document.fonts.check() (spec answers "needs load?", not "installed?") - Settings: progressive disclosure with found/not-found hint, debounced saves (flushed on unmount, cancelled when a built-in is re-picked) - pierreFontCss.ts: single home for the shadow-DOM font CSS block shared by usePierreTheme and DiffHunkPreview; escapes quotes/backslashes now that the family name is free text
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
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.
Closes #851
What
Adds custom font support to the code review diff viewer. Settings → Display → Code Font gains a Custom… option that reveals a text input — type the family name of any font installed on your machine (e.g. an Iosevka variant, Berkeley Mono) and the diff renders in it.
How it works
The rendering pipeline already accepted arbitrary family names (
diffOptions.fontFamilyis a free string end-to-end); the dropdown was the only gate. This PR is UI + hardening:packages/ui/utils/fontDetect.ts— "✓ Found on this machine / Not found" hint via canvas width measurement against all three generic fallbacks. Deterministic per machine, no permissions, works in every browser. Deliberately avoidsdocument.fonts.check(), whose spec answers "would this need a font load?" — browsers disagree on unregistered families.Settings.tsx— progressive disclosure: select → Custom… → input (rendered in the font as you type) + status hint. Saves debounced 400 ms (each save = cookie write +POST /api/config); pending saves are flushed on unmount and cancelled if a built-in is re-picked, so no lost or stale writes.packages/review-editor/utils/pierreFontCss.ts— the shadow-DOM font CSS block previously duplicated inusePierreThemeandDiffHunkPreviewnow lives in one place, and escapes quotes/backslashes since the family name is free text.Notes
diffOptionsalready round-trips opaquely through/api/config/config.json.Testing
packages/uitypecheck clean,apps/reviewbuild clean