Merge branch 'main' into i18n_extraLanguages_and_perThemeVariantTranslations

package.json

@@ -1,6 +1,6 @@
 {
     "name": "keycloakify",
-    "version": "10.1.0",
+    "version": "10.1.4",
     "description": "Create Keycloak themes using React",
     "repository": {
         "type": "git",

scripts/build-storybook.ts

@@ -1,59 +1,8 @@
 import * as child_process from "child_process";
-import { transformCodebase } from "../src/bin/tools/transformCodebase";
-import { join as pathJoin, sep as pathSep } from "path";
-import { assert } from "tsafe/assert";
 
 run("yarn build");
 run("npx build-storybook");
 
-const storybookStaticDirPath = "storybook-static";
-
-{
-    let hasPatched = false;
-
-    transformCodebase({
-        srcDirPath: storybookStaticDirPath,
-        destDirPath: storybookStaticDirPath,
-        transformSourceCode: ({ fileRelativePath, sourceCode }) => {
-            replace_dot_keycloakify: {
-                if (fileRelativePath.includes(pathSep)) {
-                    break replace_dot_keycloakify;
-                }
-
-                if (!fileRelativePath.endsWith(".js")) {
-                    break replace_dot_keycloakify;
-                }
-
-                const search = `DOT_KEYCLOAKIFY:".keycloakify"`;
-
-                if (!sourceCode.includes(search)) {
-                    break replace_dot_keycloakify;
-                }
-
-                hasPatched = true;
-
-                return {
-                    modifiedSourceCode: Buffer.from(
-                        sourceCode
-                            .toString("utf8")
-                            .replace(search, `DOT_KEYCLOAKIFY:"dot_keycloakify"`),
-                        "utf8"
-                    )
-                };
-            }
-
-            return { modifiedSourceCode: sourceCode };
-        }
-    });
-
-    assert(hasPatched);
-}
-
-transformCodebase({
-    srcDirPath: pathJoin(storybookStaticDirPath, ".keycloakify"),
-    destDirPath: pathJoin(storybookStaticDirPath, "dot_keycloakify")
-});
-
 function run(command: string, options?: { env?: NodeJS.ProcessEnv }) {
     console.log(`$ ${command}`);
 

scripts/build/createPublicKeycloakifyDevResourcesDir.ts

@@ -7,7 +7,7 @@ import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "../../src/bin/shared/constants";
 import { assert, type Equals } from "tsafe/assert";
 import * as fsPr from "fs/promises";
 
-export async function createPublicDotKeycloakifyDir() {
+export async function createPublicKeycloakifyDevResourcesDir() {
     await Promise.all(
         (["login", "account"] as const).map(async themeType => {
             const { extractedDirPath } = await downloadKeycloakDefaultTheme({
@@ -27,7 +27,7 @@ export async function createPublicDotKeycloakifyDir() {
                 "dist",
                 "res",
                 "public",
-                WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY,
+                WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES,
                 themeType
             );
 

scripts/build/main.ts

@@ -3,7 +3,7 @@ import * as fs from "fs";
 import { join } from "path";
 import { assert } from "tsafe/assert";
 import { transformCodebase } from "../../src/bin/tools/transformCodebase";
-import { createPublicDotKeycloakifyDir } from "./createPublicDotKeycloakifyDir";
+import { createPublicKeycloakifyDevResourcesDir } from "./createPublicKeycloakifyDevResourcesDir";
 import { createAccountV1Dir } from "./createAccountV1Dir";
 import chalk from "chalk";
 
@@ -144,7 +144,7 @@ import chalk from "chalk";
         fs.cpSync(dirBasename, destDirPath, { recursive: true });
     }
 
-    await createPublicDotKeycloakifyDir();
+    await createPublicKeycloakifyDevResourcesDir();
     await createAccountV1Dir();
 
     transformCodebase({

src/account/KcContext/kcContextMocks.ts

@@ -6,7 +6,7 @@ import { BASE_URL } from "keycloakify/lib/BASE_URL";
 import { assert, type Equals } from "tsafe/assert";
 import type { LanguageTag } from "keycloakify/account/i18n/messages_defaultSet/types";
 
-const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY}/account`;
+const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES}/account`;
 
 export const kcContextCommonMock: KcContext.Common = {
     themeVersion: "0.0.0",

src/bin/keycloakify/generateFtl/kcContextDeclarationTemplate.ftl

@@ -85,6 +85,19 @@ attributes_to_attributesByName: {
     });
 }
 window.kcContext = kcContext;
+
+<#if xKeycloakify.themeType == "login" >
+    const script = document.createElement("script");
+    script.type = "importmap";
+    script.textContent = JSON.stringify({
+      imports: {
+        "rfc4648": kcContext.url.resourcesCommonPath + "/node_modules/rfc4648/lib/rfc4648.js"
+      }
+    }, null, 2); 
+
+    document.head.appendChild(script);
+</#if>
+
 function decodeHtmlEntities(htmlStr){
     var element = decodeHtmlEntities.element;
     if (!element) {

src/bin/keycloakify/generateResources/generateResourcesForMainTheme.ts

@@ -112,7 +112,7 @@ export async function generateResourcesForMainTheme(params: {
             {
                 const dirPath = pathJoin(
                     buildContext.projectBuildDirPath,
-                    WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY
+                    WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
                 );
 
                 if (fs.existsSync(dirPath)) {
@@ -120,7 +120,7 @@ export async function generateResourcesForMainTheme(params: {
 
                     throw new Error(
                         [
-                            `Keycloakify build error: The ${WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY} directory shouldn't exist in your build directory.`,
+                            `Keycloakify build error: The ${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES} directory shouldn't exist in your build directory.`,
                             `(${pathRelative(process.cwd(), dirPath)}).\n`,
                             `Theses assets are only required for local development with Storybook.",
                             "Please remove this directory as an additional step of your command.\n`,
@@ -266,7 +266,7 @@ export async function generateResourcesForMainTheme(params: {
                     getThisCodebaseRootDirPath(),
                     "res",
                     "public",
-                    WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY,
+                    WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES,
                     themeType
                 ),
                 destDirPath: pathJoin(themeTypeDirPath, "resources")

src/bin/shared/constants.ts

@@ -1,5 +1,5 @@
 export const WELL_KNOWN_DIRECTORY_BASE_NAME = {
-    DOT_KEYCLOAKIFY: ".keycloakify",
+    KEYCLOAKIFY_DEV_RESOURCES: "keycloakify-dev-resources",
     RESOURCES_COMMON: "resources-common",
     DIST: "dist"
 } as const;

src/bin/shared/copyKeycloakResourcesToPublic.ts

@@ -21,7 +21,7 @@ export function copyKeycloakResourcesToPublic(params: {
 
     const destDirPath = pathJoin(
         buildContext.publicDirPath,
-        WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY
+        WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
     );
 
     const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo");
@@ -57,6 +57,10 @@ export function copyKeycloakResourcesToPublic(params: {
         force: true,
         recursive: true
     });
+    rmSync(pathJoin(pathDirname(destDirPath), ".keycloakify"), {
+        force: true,
+        recursive: true
+    });
 
     fs.mkdirSync(destDirPath, { recursive: true });
 
@@ -67,7 +71,7 @@ export function copyKeycloakResourcesToPublic(params: {
             getThisCodebaseRootDirPath(),
             "res",
             "public",
-            WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY
+            WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
         ),
         destDirPath
     });

src/bin/start-keycloak/start-keycloak.ts

@@ -37,15 +37,17 @@ export type CliCommandOptions = CliCommandOptions_common & {
 
 export async function command(params: { cliCommandOptions: CliCommandOptions }) {
     exit_if_docker_not_installed: {
-        let commandOutput: Buffer | undefined = undefined;
+        let commandOutput: string | undefined = undefined;
 
         try {
-            commandOutput = child_process.execSync("docker --version", {
+            commandOutput = child_process
+                .execSync("docker --version", {
                     stdio: ["ignore", "pipe", "ignore"]
-            });
+                })
+                ?.toString("utf8");
         } catch {}
 
-        if (commandOutput?.toString("utf8").includes("Docker")) {
+        if (commandOutput?.includes("Docker") || commandOutput?.includes("podman")) {
             break exit_if_docker_not_installed;
         }
 

src/login/KcContext/kcContextMocks.ts

@@ -76,7 +76,7 @@ const attributesByName = Object.fromEntries(
     ]).map(attribute => [attribute.name, attribute])
 );
 
-const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY}/login`;
+const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES}/login`;
 
 export const kcContextCommonMock: KcContext.Common = {
     themeVersion: "0.0.0",

src/login/Template.useInitialize.ts

@@ -40,14 +40,7 @@ export function useInitialize(params: {
     const { insertScriptTags } = useInsertScriptTags({
         componentOrHookName: "Template",
         scriptTags: [
-            {
+            // NOTE: The importmap is added in by the FTL script because it's too late to add it here.
-                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`

src/tools/useInsertScriptTags.ts

@@ -6,7 +6,7 @@ export type ScriptTag = ScriptTag.TextContent | ScriptTag.Src;
 
 export namespace ScriptTag {
     type Common = {
-        type: "text/javascript" | "module" | "importmap";
+        type: "text/javascript" | "module";
     };
 
     export type TextContent = Common & {

src/vite-plugin/vite-plugin.ts

@@ -201,7 +201,10 @@ export function keycloakify(params: keycloakify.Params) {
             assert(buildDirPath !== undefined);
 
             await rm(
-                pathJoin(buildDirPath, WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY),
+                pathJoin(
+                    buildDirPath,
+                    WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
+                ),
                 {
                     recursive: true,
                     force: true