mirror of
https://github.com/element-hq/element-call.git
synced 2026-09-10 11:35:44 +00:00
Timo K.andClaude Fable 5.1
f994586eeb
The component bundled English alone: the standalone app fetches its locale files at runtime from URLs its own build emits, which a host serving the library from elsewhere could not resolve, so bundling one language was the self-contained option. Now every locale is a chunk of its own that the host's bundler loads the first time it is needed, with English still bundled in so that the fallback never waits. Element Call starts in the browser's language and follows the host's own setting through a `language` prop; `supportedLanguages` says what it accepts. Translations are shared by every Element Call on the page, so the most recently set language wins for all of them. The harness gets a language picker, and the app and the component share the parsing of locale paths. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
56 lines
1.8 KiB
TypeScript
56 lines
1.8 KiB
TypeScript
/*
|
|
Copyright 2026 Element Creations Ltd.
|
|
|
|
SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
|
|
Please see LICENSE in the repository root for full details.
|
|
*/
|
|
|
|
/**
|
|
* Translations for Element Call as a component.
|
|
*
|
|
* The standalone app fetches its locale files at runtime from URLs its own
|
|
* build emits, which a host serving the library from somewhere else could not
|
|
* resolve. The component instead has the bundler split every locale into a
|
|
* chunk of its own, loaded the first time its language is asked for; English,
|
|
* the fallback, is bundled in so that the first paint never waits for it.
|
|
*/
|
|
|
|
import { type BackendModule, type ResourceKey } from "i18next";
|
|
|
|
import { languageOfLocalePath } from "../src/utils/i18n";
|
|
|
|
/** Every locale, as a lazily imported module. */
|
|
const translations = import.meta.glob<{ default: ResourceKey }>(
|
|
"../locales/*/app.json",
|
|
);
|
|
|
|
/**
|
|
* The languages Element Call can be shown in, as BCP 47 tags — `en`, `de`,
|
|
* `zh-Hans` and so on. A language that is not one of these falls back to its
|
|
* base language where there is one (`de-AT` to `de`), and to English otherwise.
|
|
*/
|
|
export const supportedLanguages: readonly string[] = [
|
|
...new Set(Object.keys(translations).map(languageOfLocalePath)),
|
|
];
|
|
|
|
/** Loads translations on demand. */
|
|
export const translationsBackend: BackendModule = {
|
|
type: "backend",
|
|
init(): void {},
|
|
read(language: string, namespace: string, callback): void {
|
|
const load = translations[`../locales/${language}/${namespace}.json`];
|
|
if (load === undefined) {
|
|
callback(new Error(`No ${namespace} translations for ${language}`), null);
|
|
return;
|
|
}
|
|
load().then(
|
|
(module) => callback(null, module.default),
|
|
(error: unknown) =>
|
|
callback(
|
|
error instanceof Error ? error : new Error(String(error)),
|
|
null,
|
|
),
|
|
);
|
|
},
|
|
};
|