Reneame useStylesAndScript to useInitialize

2024-09-22 18:12:46 +02:00
parent e5ab46727a
commit f137960f96
4 changed files with 49 additions and 38 deletions
--- a/src/login/Template.useInitialize.ts
+++ b/src/login/Template.useInitialize.ts
@ -0,0 +1,77 @@
+import { useEffect } from "react";
+import { assert } from "keycloakify/tools/assert";
+import { useInsertScriptTags } from "keycloakify/tools/useInsertScriptTags";
+import { useInsertLinkTags } from "keycloakify/tools/useInsertLinkTags";
+import type { KcContext } from "keycloakify/login/KcContext";
+
+export type KcContextLike = {
+    url: {
+        resourcesCommonPath: string;
+        resourcesPath: string;
+        ssoLoginInOtherTabsUrl: string;
+    };
+    scripts: string[];
+};
+
+assert<keyof KcContextLike extends keyof KcContext ? true : false>();
+assert<KcContext extends KcContextLike ? true : false>();
+
+export function useInitialize(params: {
+    kcContext: KcContextLike;
+    doUseDefaultCss: boolean;
+}) {
+    const { kcContext, doUseDefaultCss } = params;
+
+    const { url, scripts } = kcContext;
+
+    const { areAllStyleSheetsLoaded } = useInsertLinkTags({
+        componentOrHookName: "Template",
+        hrefs: !doUseDefaultCss
+            ? []
+            : [
+                  `${url.resourcesCommonPath}/node_modules/@patternfly/patternfly/patternfly.min.css`,
+                  `${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly.min.css`,
+                  `${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly-additions.min.css`,
+                  `${url.resourcesCommonPath}/lib/pficon/pficon.css`,
+                  `${url.resourcesPath}/css/login.css`
+              ]
+    });
+
+    const { insertScriptTags } = useInsertScriptTags({
+        componentOrHookName: "Template",
+        scriptTags: [
+            {
+                type: "importmap",
+                textContent: JSON.stringify({
+                    imports: {
+                        rfc4648: `${url.resourcesCommonPath}/node_modules/rfc4648/lib/rfc4648.js`
+                    }
+                })
+            },
+            {
+                type: "module",
+                src: `${url.resourcesPath}/js/menu-button-links.js`
+            },
+            ...scripts.map(src => ({
+                type: "text/javascript" as const,
+                src
+            })),
+            {
+                type: "module",
+                textContent: `
+                    import { checkCookiesAndSetTimer } from "${url.resourcesPath}/js/authChecker.js";
+
+                    checkCookiesAndSetTimer("${url.ssoLoginInOtherTabsUrl}");
+                `
+            }
+        ]
+    });
+
+    useEffect(() => {
+        if (areAllStyleSheetsLoaded) {
+            insertScriptTags();
+        }
+    }, [areAllStyleSheetsLoaded]);
+
+    return { isReadyToRender: areAllStyleSheetsLoaded };
+}