fix(i18n): localize all user-facing Life OS text

worker/index.js

@@ -1,4 +1,4 @@
-import { addonsJs, bootGuardJs, i18nJs, tasksJs, calendarJs, i18nRenderersJs, indexHtml, manifest, serviceWorker, icon } from "./assets.js";
+import { addonsJs, bootGuardJs, i18nJs, localeEn, localeZh, localeEnJs, localeZhJs, tasksJs, calendarJs, i18nRenderersJs, indexHtml, manifest, serviceWorker, icon } from "./assets.js";
 
 const BING_ARCHIVE = "https://www.bing.com/HPImageArchive.aspx?format=js&idx=0&n=1&mkt=en-US";
 const STATE_FIELDS = ["profile", "memories", "museum", "settings", "system"];
@@ -14,8 +14,11 @@ async function bingMetadata() {
 function headers(type, cache = "public, max-age=3600") { return { "content-type": type, "cache-control": cache }; }
 function userId(request) { return request.headers.get("oai-authenticated-user-id"); }
 
-function loginPage() {
-  return `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Life OS</title><style>html,body{margin:0;min-height:100%;font-family:ui-sans-serif,system-ui,sans-serif;background:#121513;color:#f4f6f1}body{display:grid;place-items:center;padding:24px;box-sizing:border-box}.panel{width:min(430px,100%);border:1px solid #414942;border-radius:22px;padding:34px;background:#1a201b;box-shadow:0 28px 70px #0008}.mark{font:600 11px ui-monospace,monospace;letter-spacing:.2em;color:#b8ff3d}.title{font-size:36px;letter-spacing:-.06em;margin:18px 0 10px}.copy{color:#afb9b1;line-height:1.65;margin:0 0 26px}.sign{display:flex;align-items:center;justify-content:center;text-decoration:none;background:#b8ff3d;color:#11170d;padding:14px 18px;border-radius:12px;font-size:14px;font-weight:700}.fine{margin:18px 0 0;color:#7e8a81;font:11px ui-monospace,monospace;letter-spacing:.04em;text-align:center}</style></head><body><main class="panel"><div class="mark">LIFE OS</div><h1 class="title">Your life,<br>in sync.</h1><p class="copy">Sign in with ChatGPT to open your personal Life OS and keep your memories safely synced across devices.</p><a class="sign" href="/signin-with-chatgpt?return_to=/" target="_top">CONTINUE WITH CHATGPT</a><p class="fine">PERSONAL SYSTEM · CLOUD SYNC</p></main></body></html>`;
+function loginPage(request) {
+  const language = request.headers.get("accept-language")?.toLowerCase().startsWith("zh") ? localeZh : localeEn;
+  const text = language.login;
+  const escape = (value) => String(value).replace(/[&<>"']/g, (char) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", "\"": "&quot;", "'": "&#39;" }[char]));
+  return `<!doctype html><html lang="${language === localeZh ? "zh-CN" : "en"}"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Life OS</title><style>html,body{margin:0;min-height:100%;font-family:ui-sans-serif,system-ui,sans-serif;background:#121513;color:#f4f6f1}body{display:grid;place-items:center;padding:24px;box-sizing:border-box}.panel{width:min(430px,100%);border:1px solid #414942;border-radius:22px;padding:34px;background:#1a201b;box-shadow:0 28px 70px #0008}.mark{font:600 11px ui-monospace,monospace;letter-spacing:.2em;color:#b8ff3d}.title{font-size:36px;letter-spacing:-.06em;margin:18px 0 10px}.copy{color:#afb9b1;line-height:1.65;margin:0 0 26px}.sign{display:flex;align-items:center;justify-content:center;text-decoration:none;background:#b8ff3d;color:#11170d;padding:14px 18px;border-radius:12px;font-size:14px;font-weight:700}.fine{margin:18px 0 0;color:#7e8a81;font:11px ui-monospace,monospace;letter-spacing:.04em;text-align:center}</style></head><body><main class="panel"><div class="mark">LIFE OS</div><h1 class="title">${text.title}</h1><p class="copy">${escape(text.description)}</p><a class="sign" href="/signin-with-chatgpt?return_to=/" target="_top">${escape(text.continue)}</a><p class="fine">${escape(text.footnote)}</p></main></body></html>`;
 }
 
 function validState(value) { return value && typeof value === "object" && !Array.isArray(value) && STATE_FIELDS.every((field) => Object.hasOwn(value, field)); }
@@ -67,11 +70,13 @@ export default {
     if (url.pathname === "/life-os-icon.svg") return new Response(icon, { headers: headers("image/svg+xml", "public, max-age=86400") });
     if (url.pathname === "/boot-guard.js") return new Response(bootGuardJs, { headers: headers("application/javascript; charset=utf-8", "no-cache") });
     if (url.pathname === "/i18n.js") return new Response(i18nJs, { headers: headers("application/javascript; charset=utf-8", "no-cache") });
+    if (url.pathname === "/locales/en.js") return new Response(localeEnJs, { headers: headers("application/javascript; charset=utf-8", "no-cache") });
+    if (url.pathname === "/locales/zh-CN.js") return new Response(localeZhJs, { headers: headers("application/javascript; charset=utf-8", "no-cache") });
     if (url.pathname === "/tasks.js") return new Response(tasksJs, { headers: headers("application/javascript; charset=utf-8", "no-cache") });
     if (url.pathname === "/calendar.js") return new Response(calendarJs, { headers: headers("application/javascript; charset=utf-8", "no-cache") });
     if (url.pathname === "/i18n-renderers.js") return new Response(i18nRenderersJs, { headers: headers("application/javascript; charset=utf-8", "no-cache") });
     if (url.pathname === "/" || url.pathname === "/index.html") {
-      if (!id) return new Response(loginPage(), { headers: headers("text/html; charset=utf-8", "no-cache") });
+      if (!id) return new Response(loginPage(request), { headers: headers("text/html; charset=utf-8", "no-cache") });
       return new Response(indexHtml, { headers: headers("text/html; charset=utf-8", "no-cache") });
     }
     return new Response("Not found", { status: 404 });