feat(preferences): add UI + code font selection via Google Fonts#5951
Open
yazilimalanlari wants to merge 2 commits into
Open
feat(preferences): add UI + code font selection via Google Fonts#5951yazilimalanlari wants to merge 2 commits into
yazilimalanlari wants to merge 2 commits into
Conversation
Add `ui_font` and `code_font` fields to user general settings so each user can pick a UI sans-serif and a monospaced code font independently. Fonts are loaded directly from Google Fonts' public CSS endpoint — no API key required. The Preferences > Appearance section gets two new rows: each offers a curated list of popular families (Inter, Bricolage Grotesque, JetBrains Mono, Cascadia Code, Recursive, …) plus a "Custom…" option that accepts any Google Fonts family name. Selections are applied immediately, persisted via `UpdateUserSetting`, and re-applied early on page load (localStorage cache) to avoid a flash of the wrong typeface. Custom family inputs are validated against an ASCII allowlist so they can't inject CSS or URL syntax into the generated <link>/<style> tags.
Contributor
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
📝 WalkthroughWalkthroughThis PR adds user-configurable font selection across the memos application. Proto schemas define ChangesFont Selection and Loading System
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Tip 💬 Introducing Slack Agent: The best way for teams to turn conversations into code.Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.
Built for teams:
One agent for your entire SDLC. Right inside Slack. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
🧹 Nitpick comments (1)
web/src/utils/font.ts (1)
64-64: 💤 Low valueConsider documenting the
+character in the regex comment.The regex pattern allows
+(e.g., for "M PLUS 1" font family), but line 62's comment only mentions "occasionally periods." While not incorrect, explicitly mentioning all special characters would improve clarity.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/utils/font.ts` at line 64, The comment describing the regular expression for FAMILY_PATTERN should explicitly mention the allowed special characters (including the plus sign '+', hyphen '-', space and period '.') so readers understand why characters like "M PLUS 1" are permitted; update the comment that precedes the const FAMILY_PATTERN = /^[A-Za-z0-9 .\-+]{1,64}$/ to list those characters and a brief rationale (e.g., common font names may include '+' as in "M PLUS 1").
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@web/src/utils/font.ts`:
- Line 64: The comment describing the regular expression for FAMILY_PATTERN
should explicitly mention the allowed special characters (including the plus
sign '+', hyphen '-', space and period '.') so readers understand why characters
like "M PLUS 1" are permitted; update the comment that precedes the const
FAMILY_PATTERN = /^[A-Za-z0-9 .\-+]{1,64}$/ to list those characters and a brief
rationale (e.g., common font names may include '+' as in "M PLUS 1").
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 5fb1c679-7c9f-4976-9ccc-6a3e241aa933
⛔ Files ignored due to path filters (3)
proto/gen/api/v1/user_service.pb.gois excluded by!**/*.pb.go,!**/gen/**proto/gen/openapi.yamlis excluded by!**/gen/**proto/gen/store/user_setting.pb.gois excluded by!**/*.pb.go,!**/gen/**
📒 Files selected for processing (11)
proto/api/v1/user_service.protoproto/store/user_setting.protoserver/router/api/v1/user_service.goweb/src/App.tsxweb/src/components/FontSelect.tsxweb/src/components/Settings/PreferencesSection.tsxweb/src/hooks/useUserFonts.tsweb/src/locales/en.jsonweb/src/main.tsxweb/src/types/proto/api/v1/user_service_pb.tsweb/src/utils/font.ts
Member
|
@codex review |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: ede639002f
ℹ️ 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".
… succession Track the applied UI and code font selections in local state and feed that into loadFonts() so a follow-up change doesn't read a stale setting snapshot before refetch completes. Also clarifies the FAMILY_PATTERN regex comment to mention plus signs.
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.
Add
ui_fontandcode_fontfields to user general settings so each user can pick a UI sans-serif and a monospaced code font independently. Fonts are loaded directly from Google Fonts' public CSS endpoint — no API key required.The Preferences > Appearance section gets two new rows: each offers a curated list of popular families (Inter, Bricolage Grotesque, JetBrains Mono, Cascadia Code, Recursive, …) plus a "Custom…" option that accepts any Google Fonts family name. Selections are applied immediately, persisted via
UpdateUserSetting, and re-applied early on page load (localStorage cache) to avoid a flash of the wrong typeface.Custom family inputs are validated against an ASCII allowlist so they can't inject CSS or URL syntax into the generated /<style> tags.
Screen.Recording.2026-05-13.at.23.28.11.mov