diff --git a/js/apps/admin-ui/src/context/realm-context/RealmContext.tsx b/js/apps/admin-ui/src/context/realm-context/RealmContext.tsx index 7faf4d3116..d8a3119ffb 100644 --- a/js/apps/admin-ui/src/context/realm-context/RealmContext.tsx +++ b/js/apps/admin-ui/src/context/realm-context/RealmContext.tsx @@ -1,13 +1,14 @@ -import { PropsWithChildren, useEffect, useMemo, useState } from "react"; -import { useMatch } from "react-router-dom"; +import RealmRepresentation from "@keycloak/keycloak-admin-client/lib/defs/realmRepresentation"; import { createNamedContext, useEnvironment, useRequiredContext, } from "@keycloak/keycloak-ui-shared"; +import { PropsWithChildren, useEffect, useMemo, useState } from "react"; +import { useMatch } from "react-router-dom"; import { useAdminClient } from "../../admin-client"; import { DashboardRouteWithRealm } from "../../dashboard/routes/Dashboard"; -import RealmRepresentation from "@keycloak/keycloak-admin-client/lib/defs/realmRepresentation"; +import { i18n } from "../../i18n/i18n"; import { useFetch } from "../../utils/useFetch"; type RealmContextType = { @@ -41,7 +42,13 @@ export const RealmContextProvider = ({ children }: PropsWithChildren) => { ); // Configure admin client to use selected realm when it changes. - useEffect(() => adminClient.setConfig({ realmName: realm }), [realm]); + useEffect(() => { + (async () => { + adminClient.setConfig({ realmName: realm }); + await i18n.loadNamespaces(realm); + i18n.setDefaultNamespace(realm); + })(); + }, [realm]); useFetch( () => adminClient.realms.findOne({ realm }), setRealmRepresentation, diff --git a/js/apps/admin-ui/src/i18n/i18n.ts b/js/apps/admin-ui/src/i18n/i18n.ts index 98dcae643c..ba95391f22 100644 --- a/js/apps/admin-ui/src/i18n/i18n.ts +++ b/js/apps/admin-ui/src/i18n/i18n.ts @@ -16,10 +16,12 @@ export const i18n = createInstance({ interpolation: { escapeValue: false, }, + defaultNS: [environment.realm], + ns: [environment.realm], backend: { loadPath: joinPath( environment.adminBaseUrl, - `resources/${environment.realm}/admin/{{lng}}`, + `resources/{{ns}}/admin/{{lng}}`, ), parse: (data: string) => { const messages = JSON.parse(data); diff --git a/js/apps/admin-ui/src/realm-settings/localization/RealmOverrides.tsx b/js/apps/admin-ui/src/realm-settings/localization/RealmOverrides.tsx index 845e96bad1..ae0a12fb2b 100644 --- a/js/apps/admin-ui/src/realm-settings/localization/RealmOverrides.tsx +++ b/js/apps/admin-ui/src/realm-settings/localization/RealmOverrides.tsx @@ -241,7 +241,7 @@ export const RealmOverrides = ({ try { for (const key of selectedRowKeys) { delete ( - i18n.store.data[whoAmI.getLocale()]["translation"] as Record< + i18n.store.data[whoAmI.getLocale()][currentRealm] as Record< string, string >