feat(web): add i18n framework with react-i18next#23
Open
Cawlumm wants to merge 4 commits into
Open
Conversation
Introduce the standard self-hosted localization stack so the UI can be translated and is ready for community translations via Weblate: - react-i18next + i18next + browser language detector, configured in src/i18n.ts with a central SUPPORTED_LANGUAGES list - English base dictionary at src/locales/en.json (monolingual i18next JSON, the layout Weblate expects) - language preference detected from localStorage/navigator and persisted client-side; <html lang> kept in sync on change - language selector in Settings → Appearance - extract all hardcoded strings on Login, Register, and Settings into translation keys as the proven pattern; remaining pages to follow https://claude.ai/code/session_016WYyAzJvCGWDfDJGdvyRXr
Make translations contributable without touching code, so Weblate can open translation PRs that work on merge: - i18n.ts now auto-discovers every src/locales/<code>.json via import.meta.glob and labels each language by its autonym; adding a language is just committing one JSON file (no registration step) - region locales fall back to the base language (de-AT -> de) - .weblate CLI config at the repo root (server URL + default component; API token intentionally excluded) - TRANSLATING.md: contributor guide for the Weblate and manual-PR flows, key/placeholder/plural conventions, and maintainer setup - link the guide from CONTRIBUTING.md https://claude.ai/code/session_016WYyAzJvCGWDfDJGdvyRXr
- scripts/weblate-provision.sh: create the Lyftr project + component on a self-hosted Weblate via its REST API (one command, idempotent re-runs), using the GitHub pull-request backend - TRANSLATING.md: self-hosting section (official Docker stack + required env, then run the provisioning script) - point .weblate at a self-hosted URL placeholder https://claude.ai/code/session_016WYyAzJvCGWDfDJGdvyRXr
Lyftr is MIT + public, so it qualifies for Hosted Weblate's free libre plan — same as wger. Make that the default path, default .weblate back to hosted.weblate.org, and keep self-hosting as a documented alternative. https://claude.ai/code/session_016WYyAzJvCGWDfDJGdvyRXr
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.
Summary
Introduces the standard self-hosted localization stack (react-i18next + monolingual JSON, the layout Weblate expects) so the UI can be translated, plus a proof-of-concept slice covering the Login, Register, and Settings pages.
web/src/i18n.ts) — react-i18next + browser language detector, a centralSUPPORTED_LANGUAGESlist, and<html lang>kept in sync on language change.web/src/locales/en.json) — monolingual i18next JSON.localStorage/navigatorand persisted client-side (works on pre-login pages, no backend change).t()calls) as the proven pattern; remaining pages to follow.Adding a language later: drop a
<code>.jsonnext toen.json, import it, and add one line toSUPPORTED_LANGUAGES(or wire up Weblate to do it via PRs).Test plan
npm run type-checkpassesnpm run buildpasses (3195 modules transformed)t()keys resolve againsten.jsoncountverifiedhttps://claude.ai/code/session_016WYyAzJvCGWDfDJGdvyRXr
Generated by Claude Code