phase 7+: i18n primitive + login language picker + autocomplete-off

Adds a minimal Svelte 5 i18n primitive (`src/lib/i18n/`) backing the
login form, the layout blocker page, and the lobby placeholder.
SUPPORTED_LOCALES drives both the picker and the runtime lookup;
adding a language is a two-step change inside `src/lib/i18n/`.

Login form gains a globe-icon language dropdown (English / Русский
in their native names), defaulting to navigator.languages with `en`
as the fallback. Switching the locale re-renders the form in place;
on submit, the locale rides in the JSON body of `send-email-code`
because Safari/WebKit silently drops JS-set Accept-Language. Gateway
gains a body `locale` field that takes priority over the request
header for preferred-language resolution.

Email and code inputs disable browser autofill / suggestions
(`autocomplete=off` + `autocorrect=off` + `autocapitalize=off` +
`spellcheck=false`) so Keychain / address-book pickers and
remembered-value dropdowns no longer fire on focus.

Cross-cuts:
- backend & gateway openapi: clarify that body `locale` is honored.
- docs/FUNCTIONAL{,_ru}.md §1.2: document body-vs-header priority.
- gateway tests: body `locale` overrides Accept-Language; blank
  body `locale` falls back to header.
- new ui/docs/i18n.md; cross-links from auth-flow.md and ui/README.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

ui/frontend/tests/auth-api.test.ts

@@ -55,6 +55,26 @@ describe("sendEmailCode", () => {
 		);
 	});
 
+	test("forwards the locale option in the JSON body", async () => {
+		fetchSpy.mockResolvedValueOnce(jsonResponse(200, { challenge_id: "ch-1" }));
+		await sendEmailCode(BASE_URL, "pilot@example.com", { locale: "ru" });
+		const [, init] = fetchSpy.mock.calls[0]!;
+		expect(init?.headers).toEqual({ "content-type": "application/json" });
+		expect(JSON.parse(init?.body as string)).toEqual({
+			email: "pilot@example.com",
+			locale: "ru",
+		});
+	});
+
+	test("omits the locale field when no locale is provided", async () => {
+		fetchSpy.mockResolvedValueOnce(jsonResponse(200, { challenge_id: "ch-1" }));
+		await sendEmailCode(BASE_URL, "pilot@example.com");
+		const [, init] = fetchSpy.mock.calls[0]!;
+		expect(JSON.parse(init?.body as string)).toEqual({
+			email: "pilot@example.com",
+		});
+	});
+
 	test("throws AuthError carrying gateway code and message on 400", async () => {
 		fetchSpy.mockResolvedValueOnce(
 			jsonResponse(400, {

ui/frontend/tests/e2e/auth-flow.spec.ts

@@ -143,7 +143,7 @@ test.describe("Phase 7 — auth flow", () => {
 		await expect(page.getByTestId("device-session-id")).toHaveText(
 			"dev-test-1",
 		);
-		await expect(page.getByTestId("account-display-name")).toHaveText("Pilot");
+		await expect(page.getByTestId("account-greeting")).toContainText("Pilot");
 
 		mocks.pendingSubscribes.forEach((resolve) => resolve());
 	});
@@ -153,7 +153,7 @@ test.describe("Phase 7 — auth flow", () => {
 	}) => {
 		const mocks = await mockGatewayHappyPath(page, "Pilot");
 		await completeLogin(page);
-		await expect(page.getByTestId("account-display-name")).toBeVisible();
+		await expect(page.getByTestId("account-greeting")).toBeVisible();
 
 		await page.reload();
 		await expect(page).toHaveURL(/\/lobby$/);
@@ -169,7 +169,7 @@ test.describe("Phase 7 — auth flow", () => {
 	}) => {
 		const mocks = await mockGatewayHappyPath(page, "Pilot");
 		await completeLogin(page);
-		await expect(page.getByTestId("account-display-name")).toBeVisible();
+		await expect(page.getByTestId("account-greeting")).toBeVisible();
 
 		// Fire all pending SubscribeEvents requests with an empty 200
 		// response. Connect-Web's server-streaming reader sees no frames
@@ -182,6 +182,48 @@ test.describe("Phase 7 — auth flow", () => {
 		expect(Date.now() - releaseAt).toBeLessThan(1500);
 	});
 
+	test("language picker switches the form text and forwards the locale", async ({
+		page,
+	}) => {
+		const sendRequests: Array<{ body: Record<string, unknown> }> = [];
+		await page.route(
+			"**/api/v1/public/auth/send-email-code",
+			async (route) => {
+				const raw = route.request().postData() ?? "";
+				sendRequests.push({
+					body: JSON.parse(raw) as Record<string, unknown>,
+				});
+				await route.fulfill({
+					status: 200,
+					contentType: "application/json",
+					body: JSON.stringify({ challenge_id: "ch-test-2" }),
+				});
+			},
+		);
+
+		await page.goto("/login");
+		await expect(page.getByTestId("login-email-submit")).toHaveText(
+			"send code",
+		);
+
+		await page
+			.getByTestId("login-language-select")
+			.selectOption("ru");
+		await expect(page.getByTestId("login-email-submit")).toHaveText(
+			"отправить код",
+		);
+
+		await page.getByTestId("login-email-input").fill("pilot@example.com");
+		await page.getByTestId("login-email-submit").click();
+		await expect(page.getByTestId("login-code-input")).toBeVisible();
+
+		expect(sendRequests).toHaveLength(1);
+		expect(sendRequests[0]!.body).toEqual({
+			email: "pilot@example.com",
+			locale: "ru",
+		});
+	});
+
 	test("browser without WebCrypto Ed25519 shows the not-supported blocker", async ({
 		page,
 	}) => {

ui/frontend/tests/i18n.test.ts

@@ -0,0 +1,107 @@
+// Unit tests for the lightweight i18n primitive in
+// `src/lib/i18n/index.svelte.ts`. The locale singleton is reset
+// between cases through `resetForTests`; the default constructor
+// derives the locale from JSDOM's `navigator.language`, so the
+// reset takes an explicit value when a case needs a deterministic
+// starting state.
+
+import { afterEach, beforeEach, describe, expect, test } from "vitest";
+import {
+	DEFAULT_LOCALE,
+	SUPPORTED_LOCALES,
+	detectInitialLocale,
+	i18n,
+	type Locale,
+} from "../src/lib/i18n/index.svelte";
+
+beforeEach(() => {
+	i18n.resetForTests("en");
+});
+
+afterEach(() => {
+	i18n.resetForTests("en");
+});
+
+describe("detectInitialLocale", () => {
+	test("matches the first supported primary subtag", () => {
+		expect(detectInitialLocale(["ru-RU", "en-US"])).toBe("ru");
+		expect(detectInitialLocale(["en-GB", "ru"])).toBe("en");
+		expect(detectInitialLocale(["RU"])).toBe("ru");
+	});
+
+	test("skips unsupported tags and falls back to the default locale", () => {
+		expect(detectInitialLocale(["fr-FR", "de-DE", "ja"])).toBe(DEFAULT_LOCALE);
+		expect(detectInitialLocale([])).toBe(DEFAULT_LOCALE);
+	});
+
+	test("ignores whitespace and casing", () => {
+		expect(detectInitialLocale(["  En-us  "])).toBe("en");
+		expect(detectInitialLocale(["RU_ru"])).toBe("ru");
+	});
+});
+
+describe("SUPPORTED_LOCALES", () => {
+	test("each entry exposes a code, native name and translation table", () => {
+		for (const entry of SUPPORTED_LOCALES) {
+			expect(entry.code).toMatch(/^[a-z]{2}$/);
+			expect(entry.nativeName.length).toBeGreaterThan(0);
+			expect(entry.translations["login.title"].length).toBeGreaterThan(0);
+		}
+	});
+
+	test("native names cover the two phase-7 locales", () => {
+		const codes = SUPPORTED_LOCALES.map((l) => l.code);
+		const names = SUPPORTED_LOCALES.map((l) => l.nativeName);
+		expect(codes).toEqual(["en", "ru"]);
+		expect(names).toEqual(["English", "Русский"]);
+	});
+});
+
+describe("i18n.t", () => {
+	test("returns the active locale's translation", () => {
+		i18n.setLocale("en");
+		expect(i18n.t("login.title")).toBe("sign in to Galaxy");
+		i18n.setLocale("ru");
+		expect(i18n.t("login.title")).toBe("вход в Galaxy");
+	});
+
+	test("returns the key itself for an unknown identifier", () => {
+		// `t` is typed `TranslationKey`, but bracket access at runtime
+		// gracefully handles unknown keys — the fallback chain tries
+		// the active locale, then the default locale, then the literal
+		// key. This is the safety net for a future locale that adds
+		// keys before another locale catches up.
+		i18n.setLocale("en");
+		expect(
+			i18n.t("does.not.exist" as unknown as Parameters<typeof i18n.t>[0]),
+		).toBe("does.not.exist");
+	});
+
+	test("interpolates {placeholder} parameters", () => {
+		i18n.setLocale("en");
+		expect(i18n.t("login.code_sent_to", { email: "x@y.z" })).toBe(
+			"code sent to x@y.z",
+		);
+		i18n.setLocale("ru");
+		expect(i18n.t("login.code_sent_to", { email: "x@y.z" })).toBe(
+			"код отправлен на x@y.z",
+		);
+	});
+
+	test("leaves unresolved placeholders intact", () => {
+		i18n.setLocale("en");
+		expect(i18n.t("login.code_sent_to")).toContain("{email}");
+		expect(i18n.t("login.code_sent_to", { other: "x" })).toContain(
+			"{email}",
+		);
+	});
+});
+
+describe("i18n.setLocale", () => {
+	test("setLocale updates the reactive state", () => {
+		i18n.setLocale("en");
+		expect(i18n.locale).toBe<Locale>("en");
+		i18n.setLocale("ru");
+		expect(i18n.locale).toBe<Locale>("ru");
+	});
+});

ui/frontend/tests/login-page.test.ts

@@ -18,6 +18,7 @@ import {
 import type { IDBPDatabase } from "idb";
 
 import { AuthError } from "../src/api/auth";
+import { i18n } from "../src/lib/i18n/index.svelte";
 import { session } from "../src/lib/session-store.svelte";
 import { type GalaxyDB, openGalaxyDB } from "../src/platform/store/idb";
 import { IDBCache } from "../src/platform/store/idb-cache";
@@ -54,6 +55,7 @@ beforeEach(async () => {
 	session.resetForTests();
 	session.setStoreLoaderForTests(async () => store);
 	await session.init();
+	i18n.resetForTests("en");
 	sendEmailCodeSpy.mockReset();
 	confirmEmailCodeSpy.mockReset();
 });
@@ -62,6 +64,7 @@ afterEach(async () => {
 	sendEmailCodeSpy.mockReset();
 	confirmEmailCodeSpy.mockReset();
 	session.resetForTests();
+	i18n.resetForTests("en");
 	db.close();
 	await new Promise<void>((resolve) => {
 		const req = indexedDB.deleteDatabase(dbName);
@@ -91,6 +94,7 @@ describe("login page", () => {
 			expect(sendEmailCodeSpy).toHaveBeenCalledWith(
 				expect.any(String),
 				"pilot@example.com",
+				{ locale: "en" },
 			);
 			expect(ui.getByTestId("login-code-input")).toBeInTheDocument();
 		});
@@ -222,4 +226,65 @@ describe("login page", () => {
 			expect(ui.getByTestId("login-email-input")).toBeInTheDocument();
 		});
 	});
+
+	test("renders the language picker with native names", async () => {
+		const Page = (await importLoginPage()).default;
+		const ui = render(Page);
+
+		const select = ui.getByTestId(
+			"login-language-select",
+		) as HTMLSelectElement;
+		const options = Array.from(select.options).map((o) => ({
+			value: o.value,
+			text: o.textContent?.trim() ?? "",
+		}));
+		expect(options).toEqual([
+			{ value: "en", text: "English" },
+			{ value: "ru", text: "Русский" },
+		]);
+		expect(select.value).toBe("en");
+	});
+
+	test("switching the language re-renders the form text in place", async () => {
+		const Page = (await importLoginPage()).default;
+		const ui = render(Page);
+
+		expect(ui.getByTestId("login-email-submit")).toHaveTextContent(
+			"send code",
+		);
+		const select = ui.getByTestId(
+			"login-language-select",
+		) as HTMLSelectElement;
+		await fireEvent.change(select, { target: { value: "ru" } });
+
+		await waitFor(() => {
+			expect(ui.getByTestId("login-email-submit")).toHaveTextContent(
+				"отправить код",
+			);
+		});
+		expect(i18n.locale).toBe("ru");
+	});
+
+	test("sendEmailCode receives the active locale", async () => {
+		sendEmailCodeSpy.mockResolvedValueOnce({ challengeId: "ch-1" });
+		const Page = (await importLoginPage()).default;
+		const ui = render(Page);
+
+		const select = ui.getByTestId(
+			"login-language-select",
+		) as HTMLSelectElement;
+		await fireEvent.change(select, { target: { value: "ru" } });
+
+		await fireEvent.input(ui.getByTestId("login-email-input"), {
+			target: { value: "pilot@example.com" },
+		});
+		await fireEvent.click(ui.getByTestId("login-email-submit"));
+
+		await waitFor(() => {
+			expect(sendEmailCodeSpy).toHaveBeenCalledTimes(1);
+		});
+		const args = sendEmailCodeSpy.mock.calls[0]!;
+		expect(args[1]).toBe("pilot@example.com");
+		expect(args[2]).toEqual({ locale: "ru" });
+	});
 });