Add an English/Czech interface language switch
English stays the default; Czech is a full translation. Only the app chrome is translated - notes and generated decks keep their own language, which is a core feature, not a setting. i18n - lib/i18n-dict.ts: flat en/cs dictionaries (441 keys each), translate() and translatePlural() with real Czech plural rules (1 sada / 2-4 sady / 5+ sad). English is the default and the fallback for a missing key. - lib/i18n.ts: browser store (freezmo.locale.v1), useI18n() hook, and the x-freezmo-locale header. The hook's t/plural are bound to the locale React is rendering with, so the first client render matches the server HTML and then re-renders in the stored language; module-level t is only for event handlers and non-React helpers. - <html lang> follows the choice (inline script + setLocale). UI - Settings -> Language segmented control (English / Cestina), plus an EN/CS button on the key gate for first run. - Every screen translated: sidebar, header, tab bar, library, deck cards, folder bar, create flow, all seven activities, study chrome, results, settings + health panel, API-key gate and help, install sheet, offline and the deck-not-found page. - Plural-aware counts everywhere (decks, folders, activities, runs, photos, documents, pages, words, wrong attempts). Server - API routes and guards (generate, grade, health, http-guard, rate-limit, ollama error mapping) answer in the request's language, so error cards and the health panel never fall back to English mid-sentence. Fixes - A hydration mismatch when a non-default locale was stored silently dropped the .dark class after hydration; render-time t() is now bound to the hook's locale (UploadScreen.describeExtraction, ResultsScreen.answerFor, DeckCard's folder fallback). - Bumped the service worker cache to freezmo-v4 for this deploy. Tests: i18n 27/27 (gate toggle, persistence, html lang, Czech plurals, settings switch) and a rebuilt regression suite 72/72 (English default, library, create, all 7 activity types, results, settings, install sheet, offline, PWA, security, Czech smoke).
This commit is contained in:
parent
4c2834edac
commit
618ad5fb9c
42 changed files with 1892 additions and 509 deletions
|
|
@ -1,5 +1,6 @@
|
|||
"use client";
|
||||
|
||||
import { localeHeader, t } from "./i18n";
|
||||
import type { Activity, Difficulty } from "./schemas";
|
||||
import { API_KEY_HEADER, authHeaders } from "./settings";
|
||||
|
||||
|
|
@ -55,23 +56,23 @@ export async function generateDeck(
|
|||
try {
|
||||
response = await fetch("/api/generate", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json", ...authHeaders() },
|
||||
headers: { "Content-Type": "application/json", ...authHeaders(), ...localeHeader() },
|
||||
body: JSON.stringify(input),
|
||||
signal: options.signal,
|
||||
});
|
||||
} catch (error) {
|
||||
if (error instanceof Error && error.name === "AbortError") {
|
||||
throw new ApiError("Generation was cancelled.", "aborted");
|
||||
throw new ApiError(t("api.cancelled"), "aborted");
|
||||
}
|
||||
throw new ApiError("Could not reach the Freezmo server. Is it still running?", "network");
|
||||
throw new ApiError(t("api.unreachable"), "network");
|
||||
}
|
||||
|
||||
if (!response.ok) {
|
||||
const body = (await response.json().catch(() => null)) as { error?: string; kind?: string } | null;
|
||||
throw new ApiError(body?.error ?? `The server returned HTTP ${response.status}.`, body?.kind);
|
||||
throw new ApiError(body?.error ?? t("api.httpError", { status: response.status }), body?.kind);
|
||||
}
|
||||
if (!response.body) {
|
||||
throw new ApiError("The server sent an empty response.", "bad_response");
|
||||
throw new ApiError(t("api.empty"), "bad_response");
|
||||
}
|
||||
|
||||
const reader = response.body.getReader();
|
||||
|
|
@ -96,7 +97,7 @@ export async function generateDeck(
|
|||
deck = event.deck;
|
||||
meta = event.meta ?? {};
|
||||
sawActivity = true;
|
||||
options.onProgress?.({ stage: "done", message: "Almost there…" });
|
||||
options.onProgress?.({ stage: "done", message: t("api.almost") });
|
||||
} else if (event.type === "error") {
|
||||
streamError = new ApiError(event.error, event.kind);
|
||||
}
|
||||
|
|
@ -119,8 +120,8 @@ export async function generateDeck(
|
|||
if (!deck) {
|
||||
throw new ApiError(
|
||||
sawActivity
|
||||
? "The server finished without sending a deck."
|
||||
: "No deck came back from the server. Check your Ollama settings and try again.",
|
||||
? t("api.incomplete")
|
||||
: t("api.noDeck"),
|
||||
"bad_response",
|
||||
);
|
||||
}
|
||||
|
|
@ -129,7 +130,7 @@ export async function generateDeck(
|
|||
(activity) => activity && typeof activity.type === "string" && typeof activity.id === "string",
|
||||
);
|
||||
if (!valid || valid.length === 0) {
|
||||
throw new ApiError("The generated deck had no usable activities. Try again.", "bad_response");
|
||||
throw new ApiError(t("api.noActivities"), "bad_response");
|
||||
}
|
||||
|
||||
return { deck: { ...(deck as StreamedDeck), activities: valid }, meta };
|
||||
|
|
@ -147,15 +148,15 @@ export async function gradeAnswer(input: {
|
|||
try {
|
||||
response = await fetch("/api/grade", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json", ...authHeaders() },
|
||||
headers: { "Content-Type": "application/json", ...authHeaders(), ...localeHeader() },
|
||||
body: JSON.stringify(input),
|
||||
signal: input.signal,
|
||||
});
|
||||
} catch (error) {
|
||||
if (error instanceof Error && error.name === "AbortError") {
|
||||
throw new ApiError("Grading was cancelled.", "aborted");
|
||||
throw new ApiError(t("api.gradingCancelled"), "aborted");
|
||||
}
|
||||
throw new ApiError("Could not reach the Freezmo server.", "network");
|
||||
throw new ApiError(t("api.unreachableShort"), "network");
|
||||
}
|
||||
|
||||
const body = (await response.json().catch(() => null)) as
|
||||
|
|
@ -163,7 +164,7 @@ export async function gradeAnswer(input: {
|
|||
| null;
|
||||
|
||||
if (!response.ok || !body || body.error) {
|
||||
throw new ApiError(body?.error ?? `Grading failed with HTTP ${response.status}.`, body?.kind);
|
||||
throw new ApiError(body?.error ?? t("api.gradingFailed", { status: response.status }), body?.kind);
|
||||
}
|
||||
|
||||
return {
|
||||
|
|
@ -202,21 +203,21 @@ export type Health = {
|
|||
export async function fetchHealth(): Promise<Health> {
|
||||
let response: Response;
|
||||
try {
|
||||
response = await fetch("/api/health", { cache: "no-store", headers: authHeaders() });
|
||||
response = await fetch("/api/health", { cache: "no-store", headers: { ...authHeaders(), ...localeHeader() } });
|
||||
} catch {
|
||||
throw new ApiError("Could not reach the Freezmo server.", "network");
|
||||
throw new ApiError(t("api.unreachableShort"), "network");
|
||||
}
|
||||
const body = (await response.json().catch(() => null)) as (Partial<Health> & { error?: string; kind?: string }) | null;
|
||||
if (!response.ok) {
|
||||
throw new ApiError(
|
||||
body?.error ?? `The health check failed with HTTP ${response.status}.`,
|
||||
body?.error ?? t("api.healthFailed", { status: response.status }),
|
||||
body?.kind ?? "http",
|
||||
);
|
||||
}
|
||||
// Guard against anything that isn't a health payload (e.g. a proxy error
|
||||
// page) so consumers can rely on the shape.
|
||||
if (!body || typeof body !== "object" || !body.vision || !body.text) {
|
||||
throw new ApiError("The Freezmo server sent an unexpected health response.", "bad_response");
|
||||
throw new ApiError(t("api.healthUnexpected"), "bad_response");
|
||||
}
|
||||
return body as Health;
|
||||
}
|
||||
|
|
@ -237,12 +238,12 @@ export async function verifyOllamaKey(apiKey: string): Promise<KeyCheck> {
|
|||
try {
|
||||
response = await fetch("/api/health", {
|
||||
cache: "no-store",
|
||||
headers: { [API_KEY_HEADER]: apiKey },
|
||||
headers: { [API_KEY_HEADER]: apiKey, ...localeHeader() },
|
||||
});
|
||||
} catch {
|
||||
return {
|
||||
result: "offline",
|
||||
message: "Could not reach the Freezmo server. Is it still running?",
|
||||
message: t("api.unreachable"),
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -250,7 +251,7 @@ export async function verifyOllamaKey(apiKey: string): Promise<KeyCheck> {
|
|||
if (!response.ok || !body) {
|
||||
return {
|
||||
result: "offline",
|
||||
message: "The Freezmo server answered unexpectedly. Try again in a moment.",
|
||||
message: t("api.serverUnexpected"),
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -258,8 +259,7 @@ export async function verifyOllamaKey(apiKey: string): Promise<KeyCheck> {
|
|||
return {
|
||||
result: "invalid",
|
||||
message:
|
||||
body.error ??
|
||||
"Ollama rejected this key. Check for typos, or create a new one at ollama.com/settings/keys.",
|
||||
body.error ?? t("api.keyRejected"),
|
||||
};
|
||||
}
|
||||
if (body.keyAccepted === true) return { result: "valid" };
|
||||
|
|
@ -268,7 +268,7 @@ export async function verifyOllamaKey(apiKey: string): Promise<KeyCheck> {
|
|||
return {
|
||||
result: "offline",
|
||||
message:
|
||||
body.error ?? "Couldn't reach Ollama just now. Check your connection and try again.",
|
||||
body.error ?? t("api.ollamaUnreachable"),
|
||||
};
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue