Split translations into per-language files, lazy-loaded

Only English is bundled in index.html now; the other 19 languages are
emitted as dist/locales/<code>.json and fetched on demand when a visitor
actually uses one (via auto-detect, the picker, or ?lang=xx). This drops
index.html from ~511KB to ~318KB; a non-English visitor fetches just
their one ~8-10KB locale, which the service worker then caches for
offline use. t() falls back to English until a locale resolves.

- i18n.js keeps only en + a loadLocale() fetcher; locale data moved to
  src/locales/*.json.
- build.js emits dist/locales/; dev.js serves /locales/<code>.json.
- Deploy hook publishes the locales/ subdir.

Co-Authored-By: Claude Opus 4.8 (1M context) <[email protected]>

1 files changed, 11 insertions, 6 deletions

diff --git a/src/app.js b/src/app.js
index 5fd5c1a..c43ec6f 100644
--- a/src/app.js
+++ b/src/app.js
@@ -9,7 +9,7 @@ import { qrSvg } from './qr.js';
 import { scanQr } from './scan.js';
 import { getSyncConfig, setSyncConfig } from './nostr.js';
 import { getExplorerConfig, setExplorerConfig, EXPLORER_PRESETS } from './api.js';
-import { t, LANGS, getLang, setLang, isRTL } from './i18n.js';
+import { t, LANGS, getLang, setLang, isRTL, loadLocale } from './i18n.js';
 import {
   fmtBtc,
   fmtSats,
@@ -773,8 +773,10 @@ function languagePicker() {
     'select',
     {
       value: getLang(),
-      onChange: (e) => {
-        setLang(e.target.value);
+      onChange: async (e) => {
+        const code = e.target.value;
+        setLang(code);
+        await loadLocale(code); // fetch the locale's strings before re-rendering
         applyDir();
         render();
       },
@@ -1524,10 +1526,13 @@ async function importSnapshotFile(e) {
 }
 
 // ================================================================ start
-// Apply the detected/saved language direction, then restore a wallet left open
-// in this tab; otherwise show the unlock screen.
+// Load the active language's strings (English is inline; others are fetched),
+// apply text direction, then restore a wallet left open in this tab — otherwise
+// show the unlock screen.
 applyDir();
-if (!restoreSession()) render();
+loadLocale(getLang()).finally(() => {
+  if (!restoreSession()) render();
+});