fix(i18n): numbers, units, dates and order in the UI language, and after a switch (E30 S3)
Every locale formatter takes the language as an argument. Under the React
Compiler a formatter that read the i18n singleton was memoized on its other
arguments, so a card kept "2 hr 4 min" after a switch to Hungarian; plexLang()
had the same flaw and left Plex queries in the old language. Components now
take the language from useTranslation, and the signature makes forgetting it
a type error.
- ratings, file sizes, stream stats: the language's decimal mark ("8,3")
- view and subscriber counts compact in the language ("1,2 E")
- seconds as the language's unit ("6 mp") in the sliders and the stats
- a person's birth and death dates as dates, not ISO strings
- A-Z lists by the shown name in the language's alphabet (compareText),
the tag catalog re-sorted by its translated names
- lint local/locale-format (was date-format) also refuses Intl.NumberFormat
outside lib/format.ts, localeCompare, and a component reading the language
off the i18n singleton
This commit is contained in:
@@ -0,0 +1,35 @@
|
||||
// @vitest-environment jsdom
|
||||
//
|
||||
// E30 S3: a card's numbers follow a language switch. The formatters read the UI language, but the
|
||||
// React Compiler memoizes a call on its ARGUMENTS — `formatRuntime(card.duration_seconds)` stayed
|
||||
// "2 hr 4 min" after switching to Hungarian while the hero beside it said "2 ó 16 p". Real catalog.
|
||||
import { describe, it, expect, afterEach, vi } from "vitest";
|
||||
import { render, screen, cleanup, act } from "@testing-library/react";
|
||||
import { setLanguage } from "../i18n";
|
||||
import { PlexPosterCard } from "./plexCards";
|
||||
import type { PlexCard } from "../lib/api";
|
||||
|
||||
afterEach(() => {
|
||||
cleanup();
|
||||
setLanguage("en");
|
||||
});
|
||||
|
||||
const movie: PlexCard = {
|
||||
id: "m1",
|
||||
type: "movie",
|
||||
title: "Heat",
|
||||
thumb: "/api/plex/image/m1",
|
||||
duration_seconds: 2 * 3600 + 4 * 60,
|
||||
rating: 8.3,
|
||||
};
|
||||
|
||||
describe("a card after a language switch", () => {
|
||||
it("says its runtime and rating in the new language", () => {
|
||||
setLanguage("en");
|
||||
render(<PlexPosterCard card={movie} onOpen={vi.fn()} />);
|
||||
expect(screen.getByText("2 hr 4 min")).toBeTruthy();
|
||||
act(() => setLanguage("hu"));
|
||||
expect(screen.getByText("2 ó 4 p")).toBeTruthy();
|
||||
expect(screen.getByText("8,3")).toBeTruthy();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user