Initial commit

src/KcApp/KcApp.tsx

@@ -0,0 +1,70 @@
+import "./KcApp.css";
+import type { KcContext } from "./kcContext";
+import KcAppBase, { defaultKcProps, useDownloadTerms, useI18n } from "keycloakify";
+import tos_en_url from "./tos_en.md";
+import tos_fr_url from "./tos_fr.md";
+
+export type Props = {
+    kcContext: KcContext;
+};
+
+export default function KcApp(props: Props) {
+    const { kcContext } = props;
+
+    useDownloadTerms({
+        kcContext,
+        "downloadTermMarkdown": async ({ currentLanguageTag }) => {
+            const markdownString = await fetch(
+                (() => {
+                    switch (currentLanguageTag) {
+                        case "fr":
+                            return tos_fr_url;
+                        default:
+                            return tos_en_url;
+                    }
+                })(),
+            ).then(response => response.text());
+
+            return markdownString;
+        },
+    });
+
+    const i18n = useI18n({
+        kcContext,
+        // NOTE: Here you can override the default i18n messages
+        // or define new ones that, for example, you would have
+        // defined in the Keycloak admin UI for UserProfile
+        // https://user-images.githubusercontent.com/6702424/182050652-522b6fe6-8ee5-49df-aca3-dba2d33f24a5.png
+        "extraMessages": {
+            "en": {
+                "foo": "foo in English",
+                // Here we overwrite the default english value for the message "doForgotPassword" 
+                // that is "Forgot Password?" see: https://github.com/InseeFrLab/keycloakify/blob/f0ae5ea908e0aa42391af323b6d5e2fd371af851/src/lib/i18n/generated_messages/18.0.1/login/en.ts#L17
+                "doForgotPassword": "I forgot my password"
+            },
+            "fr": {
+                /* spell-checker: disable */
+                "foo": "foo en Francais",
+                "doForgotPassword": "J'ai oublié mon mot de passe"
+                /* spell-checker: enable */
+            },
+        },
+    });
+
+    //NOTE: Locale not yet downloaded
+    if (i18n === null) {
+        return null;
+    }
+
+    return (
+        <KcAppBase
+            kcContext={kcContext}
+            i18n={i18n}
+            {...{
+                ...defaultKcProps,
+                // NOTE: The classes are defined in ./KcApp.css
+                "kcHeaderWrapperClass": "my-color my-font",
+            }}
+        />
+    );
+}