diff --git a/src/lib/components/Template.tsx b/src/lib/components/Template.tsx index 62bc6a8f..b148c81c 100644 --- a/src/lib/components/Template.tsx +++ b/src/lib/components/Template.tsx @@ -1,12 +1,13 @@ -import { useState, useReducer ,useEffect, memo } from "react"; +import { useReducer, useEffect, memo } from "react"; import type { ReactNode } from "react"; import { useKcTranslation } from "../i18n/useKcTranslation"; +import { useKcLanguageTag } from "../i18n/useKcLanguageTag"; import { kcContext } from "../kcContext"; import { assert } from "../tools/assert"; import { cx } from "tss-react"; -import { useKcLanguageTag } from "../i18n/useKcLanguageTag"; import type { KcLanguageTag } from "../i18n/KcLanguageTag"; +import { getBestMatchAmongKcLanguageTag } from "../i18n/KcLanguageTag"; import { getKcLanguageTagLabel } from "../i18n/KcLanguageTag"; import { useCallbackFactory } from "powerhooks"; import { appendHead } from "../tools/appendHead"; @@ -41,29 +42,45 @@ export const Template = memo((props: TemplateProps) => { displayInfoNode = null } = props; - useEffect(()=> { console.log("Rendering this page with react using keycloakify") },[]); + useEffect(() => { console.log("Rendering this page with react using keycloakify") }, []); const { t } = useKcTranslation(); const { kcLanguageTag, setKcLanguageTag } = useKcLanguageTag(); + const onChangeLanguageClickFactory = useCallbackFactory( - ([languageTag]: [KcLanguageTag]) => + ([languageTag]: [KcLanguageTag]) => setKcLanguageTag(languageTag) ); - const onTryAnotherWayClick = useConstCallback(() => { + const onTryAnotherWayClick = useConstCallback(() => + (document.forms["kc-select-try-another-way-form" as never].submit(), false) + ); - document.forms["kc-select-try-another-way-form" as never].submit(); + assert(kcContext !== undefined); - return false; + const { + realm, locale, auth, + url, message, isAppInitiatedAction + }= kcContext; - }); + useEffect(()=>{ - const [{ realm, locale, auth, url, message, isAppInitiatedAction }] = useState(() => ( - assert(kcContext !== undefined, "App is not currently being served by KeyCloak"), - kcContext - )); + if( !realm.internationalizationEnabled ){ + return; + } + + assert( locale !== undefined ); + + if( kcLanguageTag === getBestMatchAmongKcLanguageTag(locale.current) ){ + return; + } + + window.location.href = + locale.supported.find(({ languageTag }) => languageTag === kcLanguageTag)!.url; + + },[kcLanguageTag]); const [isExtraCssLoaded, setExtraCssLoaded] = useReducer(() => true, false); @@ -71,7 +88,8 @@ export const Template = memo((props: TemplateProps) => { let isUnmounted = false; - const toArr= (x: string | readonly string[] | undefined )=> typeof x === "string" ? x.split(" ") : x ?? []; + const toArr = (x: string | readonly string[] | undefined) => + typeof x === "string" ? x.split(" ") : x ?? []; Promise.all( [ @@ -135,15 +153,14 @@ export const Template = memo((props: TemplateProps) => { diff --git a/src/lib/i18n/useKcLanguageTag.ts b/src/lib/i18n/useKcLanguageTag.ts index 86d4a5c1..60109a80 100644 --- a/src/lib/i18n/useKcLanguageTag.ts +++ b/src/lib/i18n/useKcLanguageTag.ts @@ -6,7 +6,7 @@ import { getBestMatchAmongKcLanguageTag } from "./KcLanguageTag"; export const { useKcLanguageTag } = createUseGlobalState( "kcLanguageTag", () => getBestMatchAmongKcLanguageTag( - kcContext?.locale?.["current" as never] ?? + kcContext?.locale?.current ?? navigator.language ), { "persistance": "cookie" } diff --git a/src/lib/kcContext.ts b/src/lib/kcContext.ts index 238f3bb7..b5154e2a 100644 --- a/src/lib/kcContext.ts +++ b/src/lib/kcContext.ts @@ -5,16 +5,11 @@ import { id } from "evt/tools/typeSafety/id"; import type { KcLanguageTag } from "./i18n/KcLanguageTag"; import { doExtends } from "evt/tools/typeSafety/doExtends"; import type { MessageKey } from "./i18n/useKcTranslation"; +import type { LanguageLabel } from "./i18n/KcLanguageTag"; type ExtractAfterStartingWith = StrEnum extends `${Prefix}${infer U}` ? U : never; -const x: "33" | "44" = null as any;; - -const y: `foo.${typeof x}` = `foo.${x}` as const; - -y; - export type KcContext = KcContext.Login | KcContext.Register | KcContext.Info; export declare namespace KcContext { @@ -43,9 +38,7 @@ export declare namespace KcContext { */ //label: LanguageLabel; }[]; - //NOTE: We do not expose this because the language is managed - //client side. We use this value however to set the default. - //current: LanguageLabel; + current: LanguageLabel; }, auth?: { showUsername: boolean;