Files
siftlode/frontend/src/components/plexCards.langSwitch.dom.test.tsx
T
peter aac79ffa53 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
2026-09-29 22:39:57 +02:00

36 lines
1.2 KiB
TypeScript

// @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();
});
});