Bump version

Update types to reflect what is actually there on the kcContext
Bump version
2024-02-21 20:43:34 +01:00 · 2024-02-21 20:43:18 +01:00 · 2024-02-18 11:28:29 +01:00 · 2024-02-18 11:28:17 +01:00 · 2024-02-17 04:15:31 +01:00 · 2024-02-17 03:47:03 +01:00
48 changed files with 791 additions and 841 deletions
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@ -3,9 +3,6 @@ on:
  push:
    branches:
      - main
-      - v5
-      - v6
-      - v7
  pull_request:
    branches:
      - main
--- a/README.md
+++ b/README.md
@ -14,9 +14,6 @@
    <a href="https://github.com/garronej/keycloakify/blob/main/LICENSE">
      <img src="https://img.shields.io/npm/l/keycloakify">
    </a>
-    <a href="https://github.com/keycloakify/keycloakify/blob/729503fe31a155a823f46dd66ad4ff34ca274e0a/tsconfig.json#L14">
-        <img src="https://camo.githubusercontent.com/0f9fcc0ac1b8617ad4989364f60f78b2d6b32985ad6a508f215f14d8f897b8d3/68747470733a2f2f62616467656e2e6e65742f62616467652f547970655363726970742f7374726963742532302546302539462539322541412f626c7565">
-    </a>
    <a href="https://github.com/thomasdarimont/awesome-keycloak">
        <img src="https://awesome.re/mentioned-badge.svg"/>
    </a>
@ -43,10 +40,6 @@

 Keycloakify is fully compatible with Keycloak 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, [~~22~~](https://github.com/keycloakify/keycloakify/issues/389#issuecomment-1822509763), **23** [and up](https://github.com/keycloakify/keycloakify/discussions/346#discussioncomment-5889791)!

-> 📣 I've observed that a few people have unstarred the project recently.  
-> I'm concerned that I may have inadvertently introduced some misinformation in the documentation, leading to frustration.  
-> If you're having a negative experience, [please let me know so I can resolve the issue](https://github.com/keycloakify/keycloakify/discussions/507).
-
 ## Sponsor 👼

 We are exclusively sponsored by [Cloud IAM](https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github), a French company offering Keycloak as a service.  
@ -130,6 +123,15 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d

 # Changelog highlights

+## 9.4
+
+**Vite Support! 🎉**
+
+-   [The starter is now a Vite project](https://github.com/keycloakify/keycloakify-starter).
+    The Webpack based starter is accessible [here](https://github.com/keycloakify/keycloakify-starter-cra).
+-   CRA (Webpack) remains supported for the forseable future.
+-   If you have a CRA Keycloakify theme that you wish to migrate to Vite checkout [this migration guide](https://docs.keycloakify.dev/migration-guides/cra-greater-than-vite).
+
 ## 9.0

 Bring back support for account themes in Keycloak v23 and up! [See issue](https://github.com/keycloakify/keycloakify/issues/389).
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
    "name": "keycloakify",
-    "version": "9.4.0-rc.2",
+    "version": "9.4.4",
    "description": "Create Keycloak themes using React",
    "repository": {
        "type": "git",
@ -119,7 +119,6 @@
        "make-fetch-happen": "^11.0.3",
        "minimal-polyfills": "^2.2.2",
        "minimist": "^1.2.6",
-        "path-browserify": "^1.0.1",
        "react-markdown": "^5.0.3",
        "recast": "^0.23.3",
        "rfc4648": "^1.5.2",
--- a/scripts/generate-i18n-messages.ts
+++ b/scripts/generate-i18n-messages.ts
@ -3,7 +3,7 @@ import * as fs from "fs";
 import { join as pathJoin, relative as pathRelative, dirname as pathDirname, sep as pathSep } from "path";
 import { crawl } from "../src/bin/tools/crawl";
 import { downloadBuiltinKeycloakTheme } from "../src/bin/download-builtin-keycloak-theme";
-import { getProjectRoot } from "../src/bin/tools/getProjectRoot";
+import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
 import { getLogger } from "../src/bin/tools/logger";

 // NOTE: To run without argument when we want to generate src/i18n/generated_kcMessages files,
@ -19,7 +19,9 @@ const logger = getLogger({ isSilent });
 async function main() {
    const keycloakVersion = "23.0.4";

-    const tmpDirPath = pathJoin(getProjectRoot(), "tmp_xImOef9dOd44");
+    const thisCodebaseRootDirPath = getThisCodebaseRootDirPath();
+
+    const tmpDirPath = pathJoin(thisCodebaseRootDirPath, "tmp_xImOef9dOd44");

    fs.rmSync(tmpDirPath, { "recursive": true, "force": true });

@ -31,7 +33,8 @@ async function main() {
        keycloakVersion,
        "destDirPath": tmpDirPath,
        "buildOptions": {
-            "cacheDirPath": pathJoin(getProjectRoot(), "node_modules", ".cache", "keycloakify")
+            "cacheDirPath": pathJoin(thisCodebaseRootDirPath, "node_modules", ".cache", "keycloakify"),
+            "npmWorkspaceRootDirPath": thisCodebaseRootDirPath
        }
    });

@ -72,14 +75,13 @@ async function main() {
            return;
        }

-        const baseMessagesDirPath = pathJoin(getProjectRoot(), "src", themeType, "i18n", "baseMessages");
+        const baseMessagesDirPath = pathJoin(thisCodebaseRootDirPath, "src", themeType, "i18n", "baseMessages");

        const languages = Object.keys(recordForPageType);

        const generatedFileHeader = [
-            `//This code was automatically generated by running ${pathRelative(getProjectRoot(), __filename)}`,
-            "//PLEASE DO NOT EDIT MANUALLY",
-            ""
+            `//This code was automatically generated by running ${pathRelative(thisCodebaseRootDirPath, __filename)}`,
+            "//PLEASE DO NOT EDIT MANUALLY"
        ].join("\n");

        languages.forEach(language => {
@ -92,6 +94,7 @@ async function main() {
                Buffer.from(
                    [
                        generatedFileHeader,
+                        "",
                        "/* spell-checker: disable */",
                        `const messages= ${JSON.stringify(recordForPageType[language], null, 2)};`,
                        "",
@ -110,10 +113,15 @@ async function main() {
            Buffer.from(
                [
                    generatedFileHeader,
+                    `import * as en from "./en";`,
+                    "",
                    "export async function getMessages(currentLanguageTag: string) {",
                    "    const { default: messages } = await (() => {",
                    "        switch (currentLanguageTag) {",
-                    ...languages.map(language => `            case "${language}": return import("./${language}");`),
+                    `            case "en": return en;`,
+                    ...languages
+                        .filter(language => language !== "en")
+                        .map(language => `            case "${language}": return import("./${language}");`),
                    '            default: return { "default": {} };',
                    "        }",
                    "    })();",
--- a/scripts/generate-json-schema.ts
+++ b/scripts/generate-json-schema.ts
@ -1,14 +0,0 @@
-import fs from "fs";
-import path from "path";
-import zodToJsonSchema from "zod-to-json-schema";
-import { zParsedPackageJson } from "../src/bin/keycloakify/parsedPackageJson";
-
-const jsonSchemaName = "keycloakifyPackageJsonSchema";
-const jsonSchema = zodToJsonSchema(zParsedPackageJson, jsonSchemaName);
-
-const baseProperties = {
-    // merges package.json schema with keycloakify properties
-    "allOf": [{ "$ref": "https://json.schemastore.org/package.json" }, { "$ref": jsonSchemaName }]
-};
-
-fs.writeFileSync(path.join(process.cwd(), "keycloakify-json-schema.json"), JSON.stringify({ ...baseProperties, ...jsonSchema }, null, 2));
--- a/scripts/link-in-app.ts
+++ b/scripts/link-in-app.ts
@ -1,11 +1,11 @@
 import { execSync } from "child_process";
 import { join as pathJoin, relative as pathRelative } from "path";
-import { getProjectRoot } from "../src/bin/tools/getProjectRoot";
+import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
 import * as fs from "fs";

 const singletonDependencies: string[] = ["react", "@types/react"];

-const rootDirPath = getProjectRoot();
+const rootDirPath = getThisCodebaseRootDirPath();

 //NOTE: This is only required because of: https://github.com/garronej/ts-ci/blob/c0e207b9677523d4ec97fe672ddd72ccbb3c1cc4/README.md?plain=1#L54-L58
 fs.writeFileSync(
--- a/src/PUBLIC_URL.ts
+++ b/src/PUBLIC_URL.ts
@ -0,0 +1,21 @@
+import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "keycloakify/bin/constants";
+import { assert } from "tsafe/assert";
+
+/**
+ * This is an equivalent of process.env.PUBLIC_URL thay you can use in Webpack projects.
+ * This works both in your main app and in your Keycloak theme.
+ */
+export const PUBLIC_URL = (() => {
+    const kcContext = (window as any)[nameOfTheGlobal];
+
+    if (kcContext === undefined || process.env.NODE_ENV === "development") {
+        assert(
+            process.env.PUBLIC_URL !== undefined,
+            `If you use keycloakify/PUBLIC_URL you should be in Webpack and thus process.env.PUBLIC_URL should be defined`
+        );
+
+        return process.env.PUBLIC_URL;
+    }
+
+    return `${kcContext.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}`;
+})();
--- a/src/account/kcContext/createGetKcContext.ts
+++ b/src/account/kcContext/createGetKcContext.ts
@ -1,10 +1,9 @@
 import type { DeepPartial } from "keycloakify/tools/DeepPartial";
 import { deepAssign } from "keycloakify/tools/deepAssign";
+import { isStorybook } from "keycloakify/lib/isStorybook";
 import type { ExtendKcContext } from "./getKcContextFromWindow";
 import { getKcContextFromWindow } from "./getKcContextFromWindow";
-import { pathJoin } from "keycloakify/bin/tools/pathJoin";
 import { symToStr } from "tsafe/symToStr";
-import { resources_common } from "keycloakify/bin/constants";
 import { kcContextMocks, kcContextCommonMock } from "keycloakify/account/kcContext/kcContextMocks";

 export function createGetKcContext<KcContextExtension extends { pageId: string } = never>(params?: {
@ -27,7 +26,13 @@ export function createGetKcContext<KcContextExtension extends { pageId: string }
        if (mockPageId !== undefined && realKcContext === undefined) {
            //TODO maybe trow if no mock fo custom page

-            console.log(`%cKeycloakify: ${symToStr({ mockPageId })} set to ${mockPageId}.`, "background: red; color: yellow; font-size: medium");
+            warn_that_mock_is_enbaled: {
+                if (isStorybook) {
+                    break warn_that_mock_is_enbaled;
+                }
+
+                console.log(`%cKeycloakify: ${symToStr({ mockPageId })} set to ${mockPageId}.`, "background: red; color: yellow; font-size: medium");
+            }

            const kcContextDefaultMock = kcContextMocks.find(({ pageId }) => pageId === mockPageId);

@ -88,8 +93,6 @@ export function createGetKcContext<KcContextExtension extends { pageId: string }
            return { "kcContext": undefined as any };
        }

-        realKcContext.url.resourcesCommonPath = pathJoin(realKcContext.url.resourcesPath, resources_common);
-
        return { "kcContext": realKcContext as any };
    }

--- a/src/account/kcContext/kcContextMocks.ts
+++ b/src/account/kcContext/kcContextMocks.ts
@ -1,12 +1,10 @@
 import "minimal-polyfills/Object.fromEntries";
 import { resources_common, keycloak_resources } from "keycloakify/bin/constants";
-import { pathJoin } from "keycloakify/bin/tools/pathJoin";
 import { id } from "tsafe/id";
 import type { KcContext } from "./KcContext";
+import { BASE_URL } from "keycloakify/lib/BASE_URL";

-const PUBLIC_URL = (typeof process !== "object" ? undefined : process.env?.["PUBLIC_URL"]) || "/";
-
-const resourcesPath = pathJoin(PUBLIC_URL, keycloak_resources, "account", "resources");
+const resourcesPath = `${BASE_URL}${keycloak_resources}/account/resources`;

 export const kcContextCommonMock: KcContext.Common = {
    "themeVersion": "0.0.0",
@ -15,7 +13,7 @@ export const kcContextCommonMock: KcContext.Common = {
    "themeName": "my-theme-name",
    "url": {
        resourcesPath,
-        "resourcesCommonPath": pathJoin(resourcesPath, resources_common),
+        "resourcesCommonPath": `${resourcesPath}/${resources_common}`,
        "resourceUrl": "#",
        "accountUrl": "#",
        "applicationsUrl": "#",
--- a/src/account/pages/PageProps.ts
+++ b/src/account/pages/PageProps.ts
@ -1,10 +1,11 @@
 import type { I18n } from "keycloakify/account/i18n";
 import type { TemplateProps, ClassKey } from "keycloakify/account/TemplateProps";
 import type { LazyOrNot } from "keycloakify/tools/LazyOrNot";
+import type { KcContext } from "keycloakify/account/kcContext";

-export type PageProps<KcContext, I18nExtended extends I18n> = {
+export type PageProps<NarowedKcContext = KcContext, I18nExtended extends I18n = I18n> = {
    Template: LazyOrNot<(props: TemplateProps<any, any>) => JSX.Element | null>;
-    kcContext: KcContext;
+    kcContext: NarowedKcContext;
    i18n: I18nExtended;
    doUseDefaultCss: boolean;
    classes?: Partial<Record<ClassKey, string>>;
--- a/src/bin/constants.ts
+++ b/src/bin/constants.ts
@ -2,7 +2,7 @@ export const nameOfTheGlobal = "kcContext";
 export const keycloak_resources = "keycloak-resources";
 export const resources_common = "resources-common";
 export const lastKeycloakVersionWithAccountV1 = "21.1.2";
-export const resolvedViteConfigJsonBasename = ".keycloakifyViteConfig.json";
+export const resolvedViteConfigJsonBasename = "vite.json";
 export const basenameOfTheKeycloakifyResourcesDir = "build";

 export const themeTypes = ["login", "account"] as const;
--- a/src/bin/copy-keycloak-resources-to-public.ts
+++ b/src/bin/copy-keycloak-resources-to-public.ts
@ -1,17 +1,44 @@
 #!/usr/bin/env node

-import { downloadKeycloakStaticResources } from "./keycloakify/generateTheme/downloadKeycloakStaticResources";
+import { downloadKeycloakStaticResources, type BuildOptionsLike } from "./keycloakify/generateTheme/downloadKeycloakStaticResources";
 import { join as pathJoin, relative as pathRelative } from "path";
 import { readBuildOptions } from "./keycloakify/buildOptions";
 import { themeTypes, keycloak_resources, lastKeycloakVersionWithAccountV1 } from "./constants";
+import { readThisNpmProjectVersion } from "./tools/readThisNpmProjectVersion";
+import { assert, type Equals } from "tsafe/assert";
 import * as fs from "fs";
+import { rmSync } from "./tools/fs.rmSync";

-(async () => {
-    const buildOptions = readBuildOptions({
-        "processArgv": process.argv.slice(2)
+export async function copyKeycloakResourcesToPublic(params: { processArgv: string[] }) {
+    const { processArgv } = params;
+
+    const buildOptions = readBuildOptions({ processArgv });
+
+    const destDirPath = pathJoin(buildOptions.publicDirPath, keycloak_resources);
+
+    const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo");
+
+    const { keycloakifyBuildinfoRaw } = generateKeycloakifyBuildinfoRaw({
+        destDirPath,
+        "keycloakifyVersion": readThisNpmProjectVersion(),
+        buildOptions
    });

-    const reservedDirPath = pathJoin(buildOptions.publicDirPath, keycloak_resources);
+    skip_if_already_done: {
+        if (!fs.existsSync(keycloakifyBuildinfoFilePath)) {
+            break skip_if_already_done;
+        }
+
+        const keycloakifyBuildinfoRaw_previousRun = fs.readFileSync(keycloakifyBuildinfoFilePath).toString("utf8");
+
+        if (keycloakifyBuildinfoRaw_previousRun !== keycloakifyBuildinfoRaw) {
+            break skip_if_already_done;
+        }
+
+        return;
+    }
+
+    rmSync(destDirPath, { "force": true, "recursive": true });

    for (const themeType of themeTypes) {
        await downloadKeycloakStaticResources({
@ -24,13 +51,13 @@ import * as fs from "fs";
                }
            })(),
            themeType,
-            "themeDirPath": reservedDirPath,
+            "themeDirPath": destDirPath,
            buildOptions
        });
    }

    fs.writeFileSync(
-        pathJoin(reservedDirPath, "README.txt"),
+        pathJoin(destDirPath, "README.txt"),
        Buffer.from(
            // prettier-ignore
            [
@ -42,5 +69,44 @@ import * as fs from "fs";

    fs.writeFileSync(pathJoin(buildOptions.publicDirPath, keycloak_resources, ".gitignore"), Buffer.from("*", "utf8"));

-    console.log(`${pathRelative(buildOptions.reactAppRootDirPath, reservedDirPath)} directory created.`);
-})();
+    fs.writeFileSync(keycloakifyBuildinfoFilePath, Buffer.from(keycloakifyBuildinfoRaw, "utf8"));
+}
+
+export function generateKeycloakifyBuildinfoRaw(params: {
+    destDirPath: string;
+    keycloakifyVersion: string;
+    buildOptions: BuildOptionsLike & {
+        loginThemeResourcesFromKeycloakVersion: string;
+    };
+}) {
+    const { destDirPath, keycloakifyVersion, buildOptions } = params;
+
+    const { cacheDirPath, npmWorkspaceRootDirPath, loginThemeResourcesFromKeycloakVersion, ...rest } = buildOptions;
+
+    assert<Equals<typeof rest, {}>>(true);
+
+    const keycloakifyBuildinfoRaw = JSON.stringify(
+        {
+            keycloakifyVersion,
+            "buildOptions": {
+                loginThemeResourcesFromKeycloakVersion,
+                "cacheDirPath": pathRelative(destDirPath, cacheDirPath),
+                "npmWorkspaceRootDirPath": pathRelative(destDirPath, npmWorkspaceRootDirPath)
+            }
+        },
+        null,
+        2
+    );
+
+    return { keycloakifyBuildinfoRaw };
+}
+
+async function main() {
+    await copyKeycloakResourcesToPublic({
+        "processArgv": process.argv.slice(2)
+    });
+}
+
+if (require.main === module) {
+    main();
+}
--- a/src/bin/download-builtin-keycloak-theme.ts
+++ b/src/bin/download-builtin-keycloak-theme.ts
@ -1,6 +1,6 @@
 #!/usr/bin/env node
 import { join as pathJoin } from "path";
-import { downloadAndUnzip } from "./tools/downloadAndUnzip";
+import { downloadAndUnzip } from "./downloadAndUnzip";
 import { promptKeycloakVersion } from "./promptKeycloakVersion";
 import { getLogger } from "./tools/logger";
 import { readBuildOptions, type BuildOptions } from "./keycloakify/buildOptions";
@ -13,6 +13,7 @@ import { transformCodebase } from "./tools/transformCodebase";

 export type BuildOptionsLike = {
    cacheDirPath: string;
+    npmWorkspaceRootDirPath: string;
 };

 assert<BuildOptions extends BuildOptionsLike ? true : false>();
@ -21,11 +22,10 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st
    const { keycloakVersion, destDirPath, buildOptions } = params;

    await downloadAndUnzip({
-        "doUseCache": true,
-        "cacheDirPath": buildOptions.cacheDirPath,
        destDirPath,
        "url": `https://github.com/keycloak/keycloak/archive/refs/tags/${keycloakVersion}.zip`,
        "specificDirsToExtract": ["", "-community"].map(ext => `keycloak-${keycloakVersion}/themes/src/main/resources${ext}/theme`),
+        buildOptions,
        "preCacheTransform": {
            "actionCacheId": "npm install and build",
            "action": async ({ destDirPath }) => {
@ -62,9 +62,9 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st

                // Note, this is an optimization for reducing the size of the jar
                remove_unused_node_modules: {
-                    const pathOfNodeModules = pathJoin(destDirPath, "keycloak", "common", "resources", "node_modules");
+                    const nodeModuleDirPath = pathJoin(destDirPath, "keycloak", "common", "resources", "node_modules");

-                    if (!fs.existsSync(pathOfNodeModules)) {
+                    if (!fs.existsSync(nodeModuleDirPath)) {
                        break remove_unused_node_modules;
                    }

@ -114,8 +114,8 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st
                    ];

                    transformCodebase({
-                        "srcDirPath": pathOfNodeModules,
-                        "destDirPath": pathOfNodeModules,
+                        "srcDirPath": nodeModuleDirPath,
+                        "destDirPath": nodeModuleDirPath,
                        "transformSourceCode": ({ sourceCode, fileRelativePath }) => {
                            if (fileRelativePath.endsWith(".map")) {
                                return undefined;
@ -140,6 +140,33 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st
                    });
                }

+                // Just like node_modules
+                remove_unused_lib: {
+                    const libDirPath = pathJoin(destDirPath, "keycloak", "common", "resources", "lib");
+
+                    if (!fs.existsSync(libDirPath)) {
+                        break remove_unused_lib;
+                    }
+
+                    const toDeletePerfixes = ["ui-ace", "filesaver", "fileupload", "angular", "ui-ace", "pficon"];
+
+                    transformCodebase({
+                        "srcDirPath": libDirPath,
+                        "destDirPath": libDirPath,
+                        "transformSourceCode": ({ sourceCode, fileRelativePath }) => {
+                            if (fileRelativePath.endsWith(".map")) {
+                                return undefined;
+                            }
+
+                            if (toDeletePerfixes.find(prefix => fileRelativePath.startsWith(prefix)) !== undefined) {
+                                return undefined;
+                            }
+
+                            return { "modifiedSourceCode": sourceCode };
+                        }
+                    });
+                }
+
                last_account_v1_transformations: {
                    if (lastKeycloakVersionWithAccountV1 !== keycloakVersion) {
                        break last_account_v1_transformations;
@ -182,38 +209,25 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st
                        );
                    }

-                    // Note, this is an optimization for reducing the size of the jar
+                    // Note, this is an optimization for reducing the size of the jar,
+                    // For this version we know exactly which resources are used.
                    {
-                        const nodeModulesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources");
+                        const nodeModulesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources", "node_modules");

-                        const usedCommonResourceRelativeFilePaths = [
+                        const toKeepPrefixes = [
                            ...["patternfly.min.css", "patternfly-additions.min.css", "patternfly-additions.min.css"].map(fileBasename =>
                                pathJoin("patternfly", "dist", "css", fileBasename)
                            ),
-                            ...[
-                                "OpenSans-Light-webfont.woff2",
-                                "OpenSans-Regular-webfont.woff2",
-                                "OpenSans-Bold-webfont.woff2",
-                                "OpenSans-Semibold-webfont.woff2",
-                                "OpenSans-Bold-webfont.woff",
-                                "OpenSans-Light-webfont.woff",
-                                "OpenSans-Regular-webfont.woff",
-                                "OpenSans-Semibold-webfont.woff",
-                                "OpenSans-Regular-webfont.ttf",
-                                "OpenSans-Light-webfont.ttf",
-                                "OpenSans-Semibold-webfont.ttf",
-                                "OpenSans-Bold-webfont.ttf"
-                            ].map(fileBasename => pathJoin("patternfly", "dist", "fonts", fileBasename))
+                            pathJoin("patternfly", "dist", "fonts")
                        ];

                        transformCodebase({
                            "srcDirPath": nodeModulesDirPath,
                            "destDirPath": nodeModulesDirPath,
                            "transformSourceCode": ({ sourceCode, fileRelativePath }) => {
-                                if (!usedCommonResourceRelativeFilePaths.includes(fileRelativePath)) {
+                                if (toKeepPrefixes.find(prefix => fileRelativePath.startsWith(prefix)) === undefined) {
                                    return undefined;
                                }
-
                                return { "modifiedSourceCode": sourceCode };
                            }
                        });
--- a/src/bin/downloadAndUnzip.ts
+++ b/src/bin/downloadAndUnzip.ts
@ -0,0 +1,203 @@
+import { createHash } from "crypto";
+import { mkdir, writeFile, unlink } from "fs/promises";
+import fetch from "make-fetch-happen";
+import { dirname as pathDirname, join as pathJoin, basename as pathBasename } from "path";
+import { assert } from "tsafe/assert";
+import { transformCodebase } from "./tools/transformCodebase";
+import { unzip, zip } from "./tools/unzip";
+import { rm } from "./tools/fs.rm";
+import * as child_process from "child_process";
+import { existsAsync } from "./tools/fs.existsAsync";
+import type { BuildOptions } from "./keycloakify/buildOptions";
+import { getProxyFetchOptions } from "./tools/fetchProxyOptions";
+
+export type BuildOptionsLike = {
+    cacheDirPath: string;
+    npmWorkspaceRootDirPath: string;
+};
+
+assert<BuildOptions extends BuildOptionsLike ? true : false>();
+
+export async function downloadAndUnzip(params: {
+    url: string;
+    destDirPath: string;
+    specificDirsToExtract?: string[];
+    preCacheTransform?: {
+        actionCacheId: string;
+        action: (params: { destDirPath: string }) => Promise<void>;
+    };
+    buildOptions: BuildOptionsLike;
+}) {
+    const { url, destDirPath, specificDirsToExtract, preCacheTransform, buildOptions } = params;
+
+    const { extractDirPath, zipFilePath } = (() => {
+        const zipFileBasenameWithoutExt = generateFileNameFromURL({
+            url,
+            "preCacheTransform":
+                preCacheTransform === undefined
+                    ? undefined
+                    : {
+                          "actionCacheId": preCacheTransform.actionCacheId,
+                          "actionFootprint": preCacheTransform.action.toString()
+                      }
+        });
+
+        const zipFilePath = pathJoin(buildOptions.cacheDirPath, `${zipFileBasenameWithoutExt}.zip`);
+        const extractDirPath = pathJoin(buildOptions.cacheDirPath, `tmp_unzip_${zipFileBasenameWithoutExt}`);
+
+        return { zipFilePath, extractDirPath };
+    })();
+
+    download_zip_and_transform: {
+        if (await existsAsync(zipFilePath)) {
+            break download_zip_and_transform;
+        }
+
+        const { response, isFromRemoteCache } = await (async () => {
+            const proxyFetchOptions = await getProxyFetchOptions({
+                "npmWorkspaceRootDirPath": buildOptions.npmWorkspaceRootDirPath
+            });
+
+            const response = await fetch(
+                `https://github.com/keycloakify/keycloakify/releases/download/v0.0.1/${pathBasename(zipFilePath)}`,
+                proxyFetchOptions
+            );
+
+            if (response.status === 200) {
+                return {
+                    response,
+                    "isFromRemoteCache": true
+                };
+            }
+
+            return {
+                "response": await fetch(url, proxyFetchOptions),
+                "isFromRemoteCache": false
+            };
+        })();
+
+        await mkdir(pathDirname(zipFilePath), { "recursive": true });
+
+        /**
+         * The correct way to fix this is to upgrade node-fetch beyond 3.2.5
+         * (see https://github.com/node-fetch/node-fetch/issues/1295#issuecomment-1144061991.)
+         * Unfortunately, octokit (a dependency of keycloakify) also uses node-fetch, and
+         * does not support node-fetch 3.x. So we stick around with this band-aid until
+         * octokit upgrades.
+         */
+        response.body?.setMaxListeners(Number.MAX_VALUE);
+        assert(typeof response.body !== "undefined" && response.body != null);
+
+        await writeFile(zipFilePath, response.body);
+
+        if (isFromRemoteCache) {
+            break download_zip_and_transform;
+        }
+
+        if (specificDirsToExtract === undefined && preCacheTransform === undefined) {
+            break download_zip_and_transform;
+        }
+
+        await unzip(zipFilePath, extractDirPath, specificDirsToExtract);
+
+        try {
+            await preCacheTransform?.action({
+                "destDirPath": extractDirPath
+            });
+        } catch (error) {
+            await Promise.all([rm(extractDirPath, { "recursive": true }), unlink(zipFilePath)]);
+
+            throw error;
+        }
+
+        await unlink(zipFilePath);
+
+        await zip(extractDirPath, zipFilePath);
+
+        await rm(extractDirPath, { "recursive": true });
+
+        upload_to_remot_cache_if_admin: {
+            const githubToken = process.env["KEYCLOAKIFY_ADMIN_GITHUB_PERSONAL_ACCESS_TOKEN"];
+
+            if (githubToken === undefined) {
+                break upload_to_remot_cache_if_admin;
+            }
+
+            console.log("uploading to remote cache");
+
+            try {
+                child_process.execSync(`which putasset`);
+            } catch {
+                child_process.execSync(`npm install -g putasset`);
+            }
+
+            try {
+                child_process.execFileSync("putasset", [
+                    "--owner",
+                    "keycloakify",
+                    "--repo",
+                    "keycloakify",
+                    "--tag",
+                    "v0.0.1",
+                    "--filename",
+                    zipFilePath,
+                    "--token",
+                    githubToken
+                ]);
+            } catch {
+                console.log("upload failed, asset probably already exists in remote cache");
+            }
+        }
+    }
+
+    await unzip(zipFilePath, extractDirPath);
+
+    transformCodebase({
+        "srcDirPath": extractDirPath,
+        "destDirPath": destDirPath
+    });
+
+    await rm(extractDirPath, { "recursive": true });
+}
+
+function generateFileNameFromURL(params: {
+    url: string;
+    preCacheTransform:
+        | {
+              actionCacheId: string;
+              actionFootprint: string;
+          }
+        | undefined;
+}): string {
+    const { preCacheTransform } = params;
+
+    // Parse the URL
+    const url = new URL(params.url);
+
+    // Extract pathname and remove leading slashes
+    let fileName = url.pathname.replace(/^\//, "").replace(/\//g, "_");
+
+    // Optionally, add query parameters replacing special characters
+    if (url.search) {
+        fileName += url.search.replace(/[&=?]/g, "-");
+    }
+
+    // Replace any characters that are not valid in filenames
+    fileName = fileName.replace(/[^a-zA-Z0-9-_]/g, "");
+
+    // Trim or pad the fileName to a specific length
+    fileName = fileName.substring(0, 50);
+
+    add_pre_cache_transform: {
+        if (preCacheTransform === undefined) {
+            break add_pre_cache_transform;
+        }
+
+        // Sanitize actionCacheId the same way as other components
+        const sanitizedActionCacheId = preCacheTransform.actionCacheId.replace(/[^a-zA-Z0-9-_]/g, "_");
+
+        fileName += `_${sanitizedActionCacheId}_${createHash("sha256").update(preCacheTransform.actionFootprint).digest("hex").substring(0, 5)}`;
+    }
+
+    return fileName;
+}
--- a/src/bin/eject-keycloak-page.ts
+++ b/src/bin/eject-keycloak-page.ts
@ -1,6 +1,6 @@
 #!/usr/bin/env node

-import { getProjectRoot } from "./tools/getProjectRoot";
+import { getThisCodebaseRootDirPath } from "./tools/getThisCodebaseRootDirPath";
 import cliSelect from "cli-select";
 import { loginThemePageIds, accountThemePageIds, type LoginThemePageId, type AccountThemePageId } from "./keycloakify/generateFtl";
 import { capitalize } from "tsafe/capitalize";
@ -11,11 +11,14 @@ import { kebabCaseToCamelCase } from "./tools/kebabCaseToSnakeCase";
 import { assert, Equals } from "tsafe/assert";
 import { getThemeSrcDirPath } from "./getThemeSrcDirPath";
 import { themeTypes, type ThemeType } from "./constants";
+import { getReactAppRootDirPath } from "./keycloakify/buildOptions/getReactAppRootDirPath";

 (async () => {
    console.log("Select a theme type");

-    const reactAppRootDirPath = process.cwd();
+    const { reactAppRootDirPath } = getReactAppRootDirPath({
+        "processArgv": process.argv.slice(2)
+    });

    const { value: themeType } = await cliSelect<ThemeType>({
        "values": [...themeTypes]
@ -55,7 +58,7 @@ import { themeTypes, type ThemeType } from "./constants";
        process.exit(-1);
    }

-    await writeFile(targetFilePath, await readFile(pathJoin(getProjectRoot(), "src", themeType, "pages", pageBasename)));
+    await writeFile(targetFilePath, await readFile(pathJoin(getThisCodebaseRootDirPath(), "src", themeType, "pages", pageBasename)));

    console.log(`${pathRelative(process.cwd(), targetFilePath)} created`);
 })();
--- a/src/bin/keycloakify/buildOptions/buildOptions.ts
+++ b/src/bin/keycloakify/buildOptions/buildOptions.ts
@ -4,7 +4,10 @@ import { join as pathJoin } from "path";
 import parseArgv from "minimist";
 import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
 import { readResolvedViteConfig } from "./resolvedViteConfig";
-import { getKeycloakifyBuildDirPath } from "./getKeycloakifyBuildDirPath";
+import * as fs from "fs";
+import { getCacheDirPath } from "./getCacheDirPath";
+import { getReactAppRootDirPath } from "./getReactAppRootDirPath";
+import { getNpmWorkspaceRootDirPath } from "./getNpmWorkspaceRootDirPath";

 /** Consolidated build option gathered form CLI arguments and config in package.json */
 export type BuildOptions = {
@ -28,34 +31,24 @@ export type BuildOptions = {
    urlPathname: string | undefined;
    assetsDirPath: string;
    doBuildRetrocompatAccountTheme: boolean;
+    npmWorkspaceRootDirPath: string;
 };

 export function readBuildOptions(params: { processArgv: string[] }): BuildOptions {
    const { processArgv } = params;

-    const argv = parseArgv(processArgv);
+    const { reactAppRootDirPath } = getReactAppRootDirPath({ processArgv });

-    const reactAppRootDirPath = (() => {
-        const arg = argv["project"] ?? argv["p"];
+    const { cacheDirPath } = getCacheDirPath({ reactAppRootDirPath });

-        if (typeof arg !== "string") {
-            return process.cwd();
-        }
+    const { resolvedViteConfig } = readResolvedViteConfig({ cacheDirPath });

-        return getAbsoluteAndInOsFormatPath({
-            "pathIsh": arg,
-            "cwd": process.cwd()
-        });
-    })();
+    if (resolvedViteConfig === undefined && fs.existsSync(pathJoin(reactAppRootDirPath, "vite.config.ts"))) {
+        throw new Error("Keycloakify's Vite plugin output not found");
+    }

    const parsedPackageJson = readParsedPackageJson({ reactAppRootDirPath });

-    const { resolvedViteConfig } =
-        readResolvedViteConfig({
-            "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": parsedPackageJson.keycloakify?.keycloakifyBuildDirPath,
-            reactAppRootDirPath
-        }) ?? {};
-
    const themeNames = (() => {
        if (parsedPackageJson.keycloakify?.themeName === undefined) {
            return [
@ -73,12 +66,6 @@ export function readBuildOptions(params: { processArgv: string[] }): BuildOption
        return parsedPackageJson.keycloakify.themeName;
    })();

-    const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({
-        "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": parsedPackageJson.keycloakify?.keycloakifyBuildDirPath,
-        reactAppRootDirPath,
-        "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack"
-    });
-
    const reactAppBuildDirPath = (() => {
        webpack: {
            if (resolvedViteConfig !== undefined) {
@ -98,6 +85,10 @@ export function readBuildOptions(params: { processArgv: string[] }): BuildOption
        return pathJoin(reactAppRootDirPath, resolvedViteConfig.buildDir);
    })();

+    const argv = parseArgv(processArgv);
+
+    const { npmWorkspaceRootDirPath } = getNpmWorkspaceRootDirPath({ reactAppRootDirPath });
+
    return {
        "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack",
        "isSilent": typeof argv["silent"] === "boolean" ? argv["silent"] : false,
@ -124,7 +115,16 @@ export function readBuildOptions(params: { processArgv: string[] }): BuildOption
        "loginThemeResourcesFromKeycloakVersion": parsedPackageJson.keycloakify?.loginThemeResourcesFromKeycloakVersion ?? "11.0.3",
        reactAppRootDirPath,
        reactAppBuildDirPath,
-        keycloakifyBuildDirPath,
+        "keycloakifyBuildDirPath": (() => {
+            if (parsedPackageJson.keycloakify?.keycloakifyBuildDirPath !== undefined) {
+                return getAbsoluteAndInOsFormatPath({
+                    "pathIsh": parsedPackageJson.keycloakify?.keycloakifyBuildDirPath,
+                    "cwd": reactAppRootDirPath
+                });
+            }
+
+            return resolvedViteConfig?.buildDir === undefined ? "build_keycloak" : `${resolvedViteConfig.buildDir}_keycloak`;
+        })(),
        "publicDirPath": (() => {
            webpack: {
                if (resolvedViteConfig !== undefined) {
@ -143,19 +143,7 @@ export function readBuildOptions(params: { processArgv: string[] }): BuildOption

            return pathJoin(reactAppRootDirPath, resolvedViteConfig.publicDir);
        })(),
-        "cacheDirPath": pathJoin(
-            (() => {
-                if (process.env.XDG_CACHE_HOME !== undefined) {
-                    return getAbsoluteAndInOsFormatPath({
-                        "pathIsh": process.env.XDG_CACHE_HOME,
-                        "cwd": reactAppRootDirPath
-                    });
-                }
-
-                return pathJoin(reactAppRootDirPath, "node_modules", ".cache");
-            })(),
-            "keycloakify"
-        ),
+        cacheDirPath,
        "urlPathname": (() => {
            webpack: {
                if (resolvedViteConfig !== undefined) {
@ -191,6 +179,7 @@ export function readBuildOptions(params: { processArgv: string[] }): BuildOption

            return pathJoin(reactAppBuildDirPath, resolvedViteConfig.assetsDir);
        })(),
-        "doBuildRetrocompatAccountTheme": parsedPackageJson.keycloakify?.doBuildRetrocompatAccountTheme ?? true
+        "doBuildRetrocompatAccountTheme": parsedPackageJson.keycloakify?.doBuildRetrocompatAccountTheme ?? true,
+        npmWorkspaceRootDirPath
    };
 }
--- a/src/bin/keycloakify/buildOptions/getCacheDirPath.ts
+++ b/src/bin/keycloakify/buildOptions/getCacheDirPath.ts
@ -0,0 +1,25 @@
+import { join as pathJoin } from "path";
+import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
+import { getNpmWorkspaceRootDirPath } from "./getNpmWorkspaceRootDirPath";
+
+export function getCacheDirPath(params: { reactAppRootDirPath: string }) {
+    const { reactAppRootDirPath } = params;
+
+    const { npmWorkspaceRootDirPath } = getNpmWorkspaceRootDirPath({ reactAppRootDirPath });
+
+    const cacheDirPath = pathJoin(
+        (() => {
+            if (process.env.XDG_CACHE_HOME !== undefined) {
+                return getAbsoluteAndInOsFormatPath({
+                    "pathIsh": process.env.XDG_CACHE_HOME,
+                    "cwd": reactAppRootDirPath
+                });
+            }
+
+            return pathJoin(npmWorkspaceRootDirPath, "node_modules", ".cache");
+        })(),
+        "keycloakify"
+    );
+
+    return { cacheDirPath };
+}
--- a/src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts
+++ b/src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts
@ -1,33 +0,0 @@
-import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
-import { join as pathJoin } from "path";
-
-export function getKeycloakifyBuildDirPath(params: {
-    reactAppRootDirPath: string;
-    parsedPackageJson_keycloakify_keycloakifyBuildDirPath: string | undefined;
-    bundler: "vite" | "webpack";
-}) {
-    const { reactAppRootDirPath, parsedPackageJson_keycloakify_keycloakifyBuildDirPath, bundler } = params;
-
-    const keycloakifyBuildDirPath = (() => {
-        if (parsedPackageJson_keycloakify_keycloakifyBuildDirPath !== undefined) {
-            getAbsoluteAndInOsFormatPath({
-                "pathIsh": parsedPackageJson_keycloakify_keycloakifyBuildDirPath,
-                "cwd": reactAppRootDirPath
-            });
-        }
-
-        return pathJoin(
-            reactAppRootDirPath,
-            `${(() => {
-                switch (bundler) {
-                    case "vite":
-                        return "dist";
-                    case "webpack":
-                        return "build";
-                }
-            })()}_keycloak`
-        );
-    })();
-
-    return { keycloakifyBuildDirPath };
-}
--- a/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts
+++ b/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts
@ -0,0 +1,49 @@
+import * as child_process from "child_process";
+import { join as pathJoin, resolve as pathResolve, sep as pathSep } from "path";
+import { assert } from "tsafe/assert";
+
+let cache:
+    | {
+          reactAppRootDirPath: string;
+          npmWorkspaceRootDirPath: string;
+      }
+    | undefined = undefined;
+
+export function getNpmWorkspaceRootDirPath(params: { reactAppRootDirPath: string }) {
+    const { reactAppRootDirPath } = params;
+
+    use_cache: {
+        if (cache === undefined || cache.reactAppRootDirPath !== reactAppRootDirPath) {
+            break use_cache;
+        }
+
+        const { npmWorkspaceRootDirPath } = cache;
+
+        return { npmWorkspaceRootDirPath };
+    }
+
+    const npmWorkspaceRootDirPath = (function callee(depth: number): string {
+        const cwd = pathResolve(pathJoin(...[reactAppRootDirPath, ...Array(depth).fill("..")]));
+
+        try {
+            child_process.execSync("npm config get", { cwd: cwd });
+        } catch (error) {
+            if (String(error).includes("ENOWORKSPACES")) {
+                assert(cwd !== pathSep, "NPM workspace not found");
+
+                return callee(depth + 1);
+            }
+
+            throw error;
+        }
+
+        return cwd;
+    })(0);
+
+    cache = {
+        reactAppRootDirPath,
+        npmWorkspaceRootDirPath
+    };
+
+    return { npmWorkspaceRootDirPath };
+}
--- a/src/bin/keycloakify/buildOptions/getReactAppRootDirPath.ts
+++ b/src/bin/keycloakify/buildOptions/getReactAppRootDirPath.ts
@ -0,0 +1,23 @@
+import parseArgv from "minimist";
+import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
+
+export function getReactAppRootDirPath(params: { processArgv: string[] }) {
+    const { processArgv } = params;
+
+    const argv = parseArgv(processArgv);
+
+    const reactAppRootDirPath = (() => {
+        const arg = argv["project"] ?? argv["p"];
+
+        if (typeof arg !== "string") {
+            return process.cwd();
+        }
+
+        return getAbsoluteAndInOsFormatPath({
+            "pathIsh": arg,
+            "cwd": process.cwd()
+        });
+    })();
+
+    return { reactAppRootDirPath };
+}
--- a/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts
+++ b/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts
@ -5,7 +5,6 @@ import { z } from "zod";
 import { join as pathJoin } from "path";
 import { resolvedViteConfigJsonBasename } from "../../constants";
 import type { OptionalIfCanBeUndefined } from "../../tools/OptionalIfCanBeUndefined";
-import { getKeycloakifyBuildDirPath } from "./getKeycloakifyBuildDirPath";

 export type ResolvedViteConfig = {
    buildDir: string;
@ -28,31 +27,18 @@ const zResolvedViteConfig = z.object({
    assert<Equals<Got, Expected>>();
 }

-export function readResolvedViteConfig(params: {
-    reactAppRootDirPath: string;
-    parsedPackageJson_keycloakify_keycloakifyBuildDirPath: string | undefined;
-}):
-    | {
-          resolvedViteConfig: ResolvedViteConfig;
-      }
-    | undefined {
-    const { reactAppRootDirPath, parsedPackageJson_keycloakify_keycloakifyBuildDirPath } = params;
+export function readResolvedViteConfig(params: { cacheDirPath: string }): {
+    resolvedViteConfig: ResolvedViteConfig | undefined;
+} {
+    const { cacheDirPath } = params;

-    const viteConfigTsFilePath = pathJoin(reactAppRootDirPath, "vite.config.ts");
+    const resolvedViteConfigJsonFilePath = pathJoin(cacheDirPath, resolvedViteConfigJsonBasename);

-    if (!fs.existsSync(viteConfigTsFilePath)) {
-        return undefined;
+    if (!fs.existsSync(resolvedViteConfigJsonFilePath)) {
+        return { "resolvedViteConfig": undefined };
    }

-    const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({
-        reactAppRootDirPath,
-        parsedPackageJson_keycloakify_keycloakifyBuildDirPath,
-        "bundler": "vite"
-    });
-
    const resolvedViteConfig = (() => {
-        const resolvedViteConfigJsonFilePath = pathJoin(keycloakifyBuildDirPath, resolvedViteConfigJsonBasename);
-
        if (!fs.existsSync(resolvedViteConfigJsonFilePath)) {
            throw new Error("Missing Keycloakify Vite plugin output.");
        }
--- a/src/bin/keycloakify/generateFtl/ftl_object_to_js_code_declaring_an_object.ftl
+++ b/src/bin/keycloakify/generateFtl/ftl_object_to_js_code_declaring_an_object.ftl
@ -408,6 +408,14 @@
    out["themeName"] = "KEYCLOAKIFY_THEME_NAME_cXxKd3xEer";
    out["pageId"] = "${pageId}";

+    try {
+
+        out["url"]["resourcesCommonPath"] = out["url"]["resourcesPath"] + "/" + "RESOURCES_COMMON_cLsLsMrtDkpVv";
+
+    } catch(error) {
+
+    }
+
    return out;

 })()
@ -455,9 +463,10 @@
                        <#-- https://github.com/keycloakify/keycloakify/issues/91#issue-1212319466 (reports with error.ftl and Kc18) -->
                        <#-- https://github.com/keycloakify/keycloakify/issues/109#issuecomment-1134610163 -->
                        <#-- https://github.com/keycloakify/keycloakify/issues/357 -->
+                        <#-- https://github.com/keycloakify/keycloakify/discussions/406#discussioncomment-7514787 -->
                        key == "loginAction" && 
                        are_same_path(path, ["url"]) && 
-                        ["saml-post-form.ftl", "error.ftl", "info.ftl", "login-oauth-grant.ftl", "logout-confirm.ftl"]?seq_contains(pageId) &&
+                        ["saml-post-form.ftl", "error.ftl", "info.ftl", "login-oauth-grant.ftl", "logout-confirm.ftl", "login-oauth2-device-verify-user-code.ftl"]?seq_contains(pageId) &&
                        !(auth?has_content && auth.showTryAnotherWayLink())
                    ) || (
                        <#-- https://github.com/keycloakify/keycloakify/issues/362 -->
@ -490,14 +499,19 @@
                    <#continue>
                </#if>

-                <#if pageId == "register.ftl" && key == "attemptedUsername" && are_same_path(path, ["auth"])>
+                <#-- https://github.com/keycloakify/keycloakify/discussions/406 -->
+                <#if (
+                    ["register.ftl", "info.ftl", "login.ftl", "login-update-password.ftl", "login-oauth2-device-verify-user-code.ftl"]?seq_contains(pageId) && 
+                    key == "attemptedUsername" && are_same_path(path, ["auth"])
+                )>
                    <#attempt>
                        <#-- https://github.com/keycloak/keycloak/blob/3a2bf0c04bcde185e497aaa32d0bb7ab7520cf4a/themes/src/main/resources/theme/base/login/template.ftl#L63 -->
-                        <#-- https://github.com/keycloakify/keycloakify/discussions/406 -->
                        <#if !(auth?has_content && auth.showUsername() && !auth.showResetCredentials())>
+                            <#local out_seq += ["/*If you need '" + key + "' on " + pageId + ", please submit an issue to the Keycloakify repo*/"]>
                            <#continue>
                        </#if>
                    <#recover>
+                        <#local out_seq += ["/*Testing if attemptedUsername should be skipped throwed an exception */"]>
                    </#attempt>
                </#if>
                
--- a/src/bin/keycloakify/generateFtl/generateFtl.ts
+++ b/src/bin/keycloakify/generateFtl/generateFtl.ts
@ -7,7 +7,7 @@ import { join as pathJoin } from "path";
 import { objectKeys } from "tsafe/objectKeys";
 import type { BuildOptions } from "../buildOptions";
 import { assert } from "tsafe/assert";
-import { type ThemeType, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../constants";
+import { type ThemeType, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir, resources_common } from "../../constants";

 export type BuildOptionsLike = {
    bundler: "vite" | "webpack";
@ -105,7 +105,8 @@ export function generateFtlFilesCodeFactory(params: {
            .replace("KEYCLOAKIFY_VERSION_xEdKd3xEdr", keycloakifyVersion)
            .replace("KEYCLOAKIFY_THEME_VERSION_sIgKd3xEdr3dx", buildOptions.themeVersion)
            .replace("KEYCLOAKIFY_THEME_TYPE_dExKd3xEdr", themeType)
-            .replace("KEYCLOAKIFY_THEME_NAME_cXxKd3xEer", themeName),
+            .replace("KEYCLOAKIFY_THEME_NAME_cXxKd3xEer", themeName)
+            .replace("RESOURCES_COMMON_cLsLsMrtDkpVv", resources_common),
        "<!-- xIdLqMeOedErIdLsPdNdI9dSlxI -->": [
            "<#if scripts??>",
            "    <#list scripts as script>",
--- a/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts
+++ b/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts
@ -30,7 +30,6 @@ export function generateStartKeycloakTestingContainer(params: { jarFilePath: str
        Buffer.from(
            [
                "#!/usr/bin/env bash",
-                `# If you want to test with Keycloak version prior to 23 use the retrocompat-${pathBasename(jarFilePath)}`,
                "",
                `docker rm ${containerName} || true`,
                "",
--- a/src/bin/keycloakify/generateTheme/bringInAccountV1.ts
+++ b/src/bin/keycloakify/generateTheme/bringInAccountV1.ts
@ -11,6 +11,7 @@ import { rmSync } from "../../tools/fs.rmSync";
 type BuildOptionsLike = {
    keycloakifyBuildDirPath: string;
    cacheDirPath: string;
+    npmWorkspaceRootDirPath: string;
 };

 {
--- a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts
+++ b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts
@ -9,6 +9,7 @@ import { rmSync } from "../../tools/fs.rmSync";

 export type BuildOptionsLike = {
    cacheDirPath: string;
+    npmWorkspaceRootDirPath: string;
 };

 assert<BuildOptions extends BuildOptionsLike ? true : false>();
--- a/src/bin/keycloakify/generateTheme/generateTheme.ts
+++ b/src/bin/keycloakify/generateTheme/generateTheme.ts
@ -20,6 +20,7 @@ import { readFieldNameUsage } from "./readFieldNameUsage";
 import { readExtraPagesNames } from "./readExtraPageNames";
 import { generateMessageProperties } from "./generateMessageProperties";
 import { bringInAccountV1 } from "./bringInAccountV1";
+import { rmSync } from "../../tools/fs.rmSync";

 export type BuildOptionsLike = {
    bundler: "vite" | "webpack";
@ -33,6 +34,7 @@ export type BuildOptionsLike = {
    urlPathname: string | undefined;
    doBuildRetrocompatAccountTheme: boolean;
    themeNames: string[];
+    npmWorkspaceRootDirPath: string;
 };

 assert<BuildOptions extends BuildOptionsLike ? true : false>();
@ -77,6 +79,11 @@ export async function generateTheme(params: {
        const themeTypeDirPath = getThemeTypeDirPath({ themeType });

        apply_replacers_and_move_to_theme_resources: {
+            const destDirPath = pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir);
+
+            // NOTE: Prevent accumulation of files in the assets dir, as names are hashed they pile up.
+            rmSync(destDirPath, { "recursive": true, "force": true });
+
            if (themeType === "account" && implementedThemeTypes.login) {
                // NOTE: We prevend doing it twice, it has been done for the login theme.

@ -88,7 +95,7 @@ export async function generateTheme(params: {
                        "resources",
                        basenameOfTheKeycloakifyResourcesDir
                    ),
-                    "destDirPath": pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir)
+                    destDirPath
                });

                break apply_replacers_and_move_to_theme_resources;
@ -96,7 +103,7 @@ export async function generateTheme(params: {

            transformCodebase({
                "srcDirPath": buildOptions.reactAppBuildDirPath,
-                "destDirPath": pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir),
+                destDirPath,
                "transformSourceCode": ({ filePath, sourceCode }) => {
                    //NOTE: Prevent cycles, excludes the folder we generated for debug in public/
                    // This should not happen if users follow the new instruction setup but we keep it for retrocompatibility.
--- a/src/bin/keycloakify/keycloakify.ts
+++ b/src/bin/keycloakify/keycloakify.ts
@ -6,9 +6,9 @@ import { generateStartKeycloakTestingContainer } from "./generateStartKeycloakTe
 import * as fs from "fs";
 import { readBuildOptions } from "./buildOptions";
 import { getLogger } from "../tools/logger";
-import { assert } from "tsafe/assert";
 import { getThemeSrcDirPath } from "../getThemeSrcDirPath";
-import { getProjectRoot } from "../tools/getProjectRoot";
+import { getThisCodebaseRootDirPath } from "../tools/getThisCodebaseRootDirPath";
+import { readThisNpmProjectVersion } from "../tools/readThisNpmProjectVersion";

 export async function main() {
    const buildOptions = readBuildOptions({
@ -18,23 +18,15 @@ export async function main() {
    const logger = getLogger({ "isSilent": buildOptions.isSilent });
    logger.log("🔏 Building the keycloak theme...⌚");

-    const keycloakifyDirPath = getProjectRoot();
-
    const { themeSrcDirPath } = getThemeSrcDirPath({ "reactAppRootDirPath": buildOptions.reactAppRootDirPath });

    for (const themeName of buildOptions.themeNames) {
        await generateTheme({
            themeName,
            themeSrcDirPath,
-            "keycloakifySrcDirPath": pathJoin(keycloakifyDirPath, "src"),
-            buildOptions,
-            "keycloakifyVersion": (() => {
-                const version = JSON.parse(fs.readFileSync(pathJoin(keycloakifyDirPath, "package.json")).toString("utf8"))["version"];
-
-                assert(typeof version === "string");
-
-                return version;
-            })()
+            "keycloakifySrcDirPath": pathJoin(getThisCodebaseRootDirPath(), "src"),
+            "keycloakifyVersion": readThisNpmProjectVersion(),
+            buildOptions
        });
    }

@ -67,7 +59,7 @@ export async function main() {
        );
    }

-    const containerKeycloakVersion = "23.0.0";
+    const containerKeycloakVersion = "23.0.6";

    generateStartKeycloakTestingContainer({
        "keycloakVersion": containerKeycloakVersion,
@ -75,6 +67,8 @@ export async function main() {
        buildOptions
    });

+    fs.writeFileSync(pathJoin(buildOptions.keycloakifyBuildDirPath, ".gitignore"), Buffer.from("*", "utf8"));
+
    logger.log(
        [
            "",
--- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts
+++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts
@ -29,20 +29,6 @@ export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOp
        );
    }

-    // d={NODE_ENV:"production",PUBLIC_URL:"/foo-bar",WDS_SOCKET_HOST
-    // d={NODE_ENV:"production",PUBLIC_URL:"",WDS_SOCKET_HOST
-    // ->
-    // ... PUBLIC_URL:window.kcContext.url.resourcesPath+"/build" ...
-    fixedJsCode = fixedJsCode.replace(
-        new RegExp(
-            `NODE_ENV:"production",PUBLIC_URL:"${
-                buildOptions.urlPathname !== undefined ? replaceAll(buildOptions.urlPathname.slice(0, -1), "/", "\\/") : ""
-            }"`,
-            "g"
-        ),
-        `NODE_ENV:"production",PUBLIC_URL:window.${nameOfTheGlobal}.url.resourcesPath+"/${basenameOfTheKeycloakifyResourcesDir}"`
-    );
-
    // Example: "static/ or "foo/bar/"
    const staticDir = (() => {
        let out = pathRelative(buildOptions.reactAppBuildDirPath, buildOptions.assetsDirPath);
--- a/src/bin/tools/downloadAndUnzip.ts
+++ b/src/bin/tools/downloadAndUnzip.ts
@ -1,301 +0,0 @@
-import { exec as execCallback } from "child_process";
-import { createHash } from "crypto";
-import { mkdir, readFile, stat, writeFile, unlink } from "fs/promises";
-import fetch, { type FetchOptions } from "make-fetch-happen";
-import { dirname as pathDirname, join as pathJoin, resolve as pathResolve, sep as pathSep, basename as pathBasename } from "path";
-import { assert } from "tsafe/assert";
-import { promisify } from "util";
-import { transformCodebase } from "./transformCodebase";
-import { unzip, zip } from "./unzip";
-import { rm } from "../tools/fs.rm";
-import * as child_process from "child_process";
-
-const exec = promisify(execCallback);
-
-function generateFileNameFromURL(params: {
-    url: string;
-    preCacheTransform:
-        | {
-              actionCacheId: string;
-              actionFootprint: string;
-          }
-        | undefined;
-}): string {
-    const { preCacheTransform } = params;
-
-    // Parse the URL
-    const url = new URL(params.url);
-
-    // Extract pathname and remove leading slashes
-    let fileName = url.pathname.replace(/^\//, "").replace(/\//g, "_");
-
-    // Optionally, add query parameters replacing special characters
-    if (url.search) {
-        fileName += url.search.replace(/[&=?]/g, "-");
-    }
-
-    // Replace any characters that are not valid in filenames
-    fileName = fileName.replace(/[^a-zA-Z0-9-_]/g, "");
-
-    // Trim or pad the fileName to a specific length
-    fileName = fileName.substring(0, 50);
-
-    add_pre_cache_transform: {
-        if (preCacheTransform === undefined) {
-            break add_pre_cache_transform;
-        }
-
-        // Sanitize actionCacheId the same way as other components
-        const sanitizedActionCacheId = preCacheTransform.actionCacheId.replace(/[^a-zA-Z0-9-_]/g, "_");
-
-        fileName += `_${sanitizedActionCacheId}_${createHash("sha256").update(preCacheTransform.actionFootprint).digest("hex").substring(0, 5)}`;
-    }
-
-    return fileName;
-}
-
-async function exists(path: string) {
-    try {
-        await stat(path);
-        return true;
-    } catch (error) {
-        if ((error as Error & { code: string }).code === "ENOENT") return false;
-        throw error;
-    }
-}
-
-function ensureArray<T>(arg0: T | T[]) {
-    return Array.isArray(arg0) ? arg0 : typeof arg0 === "undefined" ? [] : [arg0];
-}
-
-function ensureSingleOrNone<T>(arg0: T | T[]) {
-    if (!Array.isArray(arg0)) return arg0;
-    if (arg0.length === 0) return undefined;
-    if (arg0.length === 1) return arg0[0];
-    throw new Error("Illegal configuration, expected a single value but found multiple: " + arg0.map(String).join(", "));
-}
-
-type NPMConfig = Record<string, string | string[]>;
-
-const npmConfigReducer = (cfg: NPMConfig, [key, value]: [string, string]) =>
-    key in cfg ? { ...cfg, [key]: [...ensureArray(cfg[key]), value] } : { ...cfg, [key]: value };
-
-/**
- * Get npm configuration as map
- */
-async function getNmpConfig() {
-    return readNpmConfig().then(parseNpmConfig);
-}
-
-function readNpmConfig(): Promise<string> {
-    return (async function callee(depth: number): Promise<string> {
-        const cwd = pathResolve(pathJoin(...[process.cwd(), ...Array(depth).fill("..")]));
-
-        let stdout: string;
-
-        try {
-            stdout = await exec("npm config get", { "encoding": "utf8", cwd }).then(({ stdout }) => stdout);
-        } catch (error) {
-            if (String(error).includes("ENOWORKSPACES")) {
-                assert(cwd !== pathSep);
-
-                return callee(depth + 1);
-            }
-
-            throw error;
-        }
-
-        return stdout;
-    })(0);
-}
-
-function parseNpmConfig(stdout: string) {
-    return stdout
-        .split("\n")
-        .filter(line => !line.startsWith(";"))
-        .map(line => line.trim())
-        .map(line => line.split("=", 2) as [string, string])
-        .reduce(npmConfigReducer, {} as NPMConfig);
-}
-
-function maybeBoolean(arg0: string | undefined) {
-    return typeof arg0 === "undefined" ? undefined : Boolean(arg0);
-}
-
-function chunks<T>(arr: T[], size: number = 2) {
-    return arr.map((_, i) => i % size == 0 && arr.slice(i, i + size)).filter(Boolean) as T[][];
-}
-
-async function readCafile(cafile: string) {
-    const cafileContent = await readFile(cafile, "utf-8");
-    return chunks(cafileContent.split(/(-----END CERTIFICATE-----)/), 2).map(ca => ca.join("").replace(/^\n/, "").replace(/\n/g, "\\n"));
-}
-
-/**
- * Get proxy and ssl configuration from npm config files. Note that we don't care about
- * proxy config in env vars, because make-fetch-happen will do that for us.
- *
- * @returns proxy configuration
- */
-async function getFetchOptions(): Promise<Pick<FetchOptions, "proxy" | "noProxy" | "strictSSL" | "ca" | "cert">> {
-    const cfg = await getNmpConfig();
-
-    const proxy = ensureSingleOrNone(cfg["https-proxy"] ?? cfg["proxy"]);
-    const noProxy = cfg["noproxy"] ?? cfg["no-proxy"];
-    const strictSSL = maybeBoolean(ensureSingleOrNone(cfg["strict-ssl"]));
-    const cert = cfg["cert"];
-    const ca = ensureArray(cfg["ca"] ?? cfg["ca[]"]);
-    const cafile = ensureSingleOrNone(cfg["cafile"]);
-
-    if (typeof cafile !== "undefined" && cafile !== "null") ca.push(...(await readCafile(cafile)));
-
-    return { proxy, noProxy, strictSSL, cert, ca: ca.length === 0 ? undefined : ca };
-}
-
-export async function downloadAndUnzip(
-    params: {
-        url: string;
-        destDirPath: string;
-        specificDirsToExtract?: string[];
-        preCacheTransform?: {
-            actionCacheId: string;
-            action: (params: { destDirPath: string }) => Promise<void>;
-        };
-    } & (
-        | {
-              doUseCache: true;
-              cacheDirPath: string;
-          }
-        | {
-              doUseCache: false;
-          }
-    )
-) {
-    const { url, destDirPath, specificDirsToExtract, preCacheTransform, ...rest } = params;
-
-    const zipFileBasename = generateFileNameFromURL({
-        url,
-        "preCacheTransform":
-            preCacheTransform === undefined
-                ? undefined
-                : {
-                      "actionCacheId": preCacheTransform.actionCacheId,
-                      "actionFootprint": preCacheTransform.action.toString()
-                  }
-    });
-
-    const cacheDirPath = !rest.doUseCache ? `tmp_${Math.random().toString().slice(2, 12)}` : rest.cacheDirPath;
-
-    const zipFilePath = pathJoin(cacheDirPath, `${zipFileBasename}.zip`);
-    const extractDirPath = pathJoin(cacheDirPath, `tmp_unzip_${zipFileBasename}`);
-
-    download_zip_and_transform: {
-        if (await exists(zipFilePath)) {
-            break download_zip_and_transform;
-        }
-
-        const opts = await getFetchOptions();
-
-        const { response, isFromRemoteCache } = await (async () => {
-            const response = await fetch(`https://github.com/keycloakify/keycloakify/releases/download/v0.0.1/${pathBasename(zipFilePath)}`, opts);
-
-            if (response.status === 200) {
-                return {
-                    response,
-                    "isFromRemoteCache": true
-                };
-            }
-
-            return {
-                "response": await fetch(url, opts),
-                "isFromRemoteCache": false
-            };
-        })();
-
-        await mkdir(pathDirname(zipFilePath), { "recursive": true });
-
-        /**
-         * The correct way to fix this is to upgrade node-fetch beyond 3.2.5
-         * (see https://github.com/node-fetch/node-fetch/issues/1295#issuecomment-1144061991.)
-         * Unfortunately, octokit (a dependency of keycloakify) also uses node-fetch, and
-         * does not support node-fetch 3.x. So we stick around with this band-aid until
-         * octokit upgrades.
-         */
-        response.body?.setMaxListeners(Number.MAX_VALUE);
-        assert(typeof response.body !== "undefined" && response.body != null);
-
-        await writeFile(zipFilePath, response.body);
-
-        if (isFromRemoteCache) {
-            break download_zip_and_transform;
-        }
-
-        if (specificDirsToExtract === undefined && preCacheTransform === undefined) {
-            break download_zip_and_transform;
-        }
-
-        await unzip(zipFilePath, extractDirPath, specificDirsToExtract);
-
-        try {
-            await preCacheTransform?.action({
-                "destDirPath": extractDirPath
-            });
-        } catch (error) {
-            await Promise.all([rm(extractDirPath, { "recursive": true }), unlink(zipFilePath)]);
-
-            throw error;
-        }
-
-        await unlink(zipFilePath);
-
-        await zip(extractDirPath, zipFilePath);
-
-        await rm(extractDirPath, { "recursive": true });
-
-        upload_to_remot_cache_if_admin: {
-            const githubToken = process.env["KEYCLOAKIFY_ADMIN_GITHUB_PERSONAL_ACCESS_TOKEN"];
-
-            if (githubToken === undefined) {
-                break upload_to_remot_cache_if_admin;
-            }
-
-            console.log("uploading to remote cache");
-
-            try {
-                child_process.execSync(`which putasset`);
-            } catch {
-                child_process.execSync(`npm install -g putasset`);
-            }
-
-            try {
-                child_process.execFileSync("putasset", [
-                    "--owner",
-                    "keycloakify",
-                    "--repo",
-                    "keycloakify",
-                    "--tag",
-                    "v0.0.1",
-                    "--filename",
-                    zipFilePath,
-                    "--token",
-                    githubToken
-                ]);
-            } catch {
-                console.log("upload failed, asset probably already exists in remote cache");
-            }
-        }
-    }
-
-    await unzip(zipFilePath, extractDirPath);
-
-    transformCodebase({
-        "srcDirPath": extractDirPath,
-        "destDirPath": destDirPath
-    });
-
-    if (!rest.doUseCache) {
-        await rm(cacheDirPath, { "recursive": true });
-    } else {
-        await rm(extractDirPath, { "recursive": true });
-    }
-}
--- a/src/bin/tools/fetchProxyOptions.ts
+++ b/src/bin/tools/fetchProxyOptions.ts
@ -0,0 +1,73 @@
+import { exec as execCallback } from "child_process";
+import { readFile } from "fs/promises";
+import { type FetchOptions } from "make-fetch-happen";
+import { promisify } from "util";
+
+function ensureArray<T>(arg0: T | T[]) {
+    return Array.isArray(arg0) ? arg0 : typeof arg0 === "undefined" ? [] : [arg0];
+}
+
+function ensureSingleOrNone<T>(arg0: T | T[]) {
+    if (!Array.isArray(arg0)) return arg0;
+    if (arg0.length === 0) return undefined;
+    if (arg0.length === 1) return arg0[0];
+    throw new Error("Illegal configuration, expected a single value but found multiple: " + arg0.map(String).join(", "));
+}
+
+type NPMConfig = Record<string, string | string[]>;
+
+/**
+ * Get npm configuration as map
+ */
+async function getNmpConfig(params: { npmWorkspaceRootDirPath: string }) {
+    const { npmWorkspaceRootDirPath } = params;
+
+    const exec = promisify(execCallback);
+
+    const stdout = await exec("npm config get", { "encoding": "utf8", "cwd": npmWorkspaceRootDirPath }).then(({ stdout }) => stdout);
+
+    const npmConfigReducer = (cfg: NPMConfig, [key, value]: [string, string]) =>
+        key in cfg ? { ...cfg, [key]: [...ensureArray(cfg[key]), value] } : { ...cfg, [key]: value };
+
+    return stdout
+        .split("\n")
+        .filter(line => !line.startsWith(";"))
+        .map(line => line.trim())
+        .map(line => line.split("=", 2) as [string, string])
+        .reduce(npmConfigReducer, {} as NPMConfig);
+}
+
+export type ProxyFetchOptions = Pick<FetchOptions, "proxy" | "noProxy" | "strictSSL" | "cert" | "ca">;
+
+export async function getProxyFetchOptions(params: { npmWorkspaceRootDirPath: string }): Promise<ProxyFetchOptions> {
+    const { npmWorkspaceRootDirPath } = params;
+
+    const cfg = await getNmpConfig({ npmWorkspaceRootDirPath });
+
+    const proxy = ensureSingleOrNone(cfg["https-proxy"] ?? cfg["proxy"]);
+    const noProxy = cfg["noproxy"] ?? cfg["no-proxy"];
+
+    function maybeBoolean(arg0: string | undefined) {
+        return typeof arg0 === "undefined" ? undefined : Boolean(arg0);
+    }
+
+    const strictSSL = maybeBoolean(ensureSingleOrNone(cfg["strict-ssl"]));
+    const cert = cfg["cert"];
+    const ca = ensureArray(cfg["ca"] ?? cfg["ca[]"]);
+    const cafile = ensureSingleOrNone(cfg["cafile"]);
+
+    if (typeof cafile !== "undefined" && cafile !== "null") {
+        ca.push(
+            ...(await (async () => {
+                function chunks<T>(arr: T[], size: number = 2) {
+                    return arr.map((_, i) => i % size == 0 && arr.slice(i, i + size)).filter(Boolean) as T[][];
+                }
+
+                const cafileContent = await readFile(cafile, "utf-8");
+                return chunks(cafileContent.split(/(-----END CERTIFICATE-----)/), 2).map(ca => ca.join("").replace(/^\n/, "").replace(/\n/g, "\\n"));
+            })())
+        );
+    }
+
+    return { proxy, noProxy, strictSSL, cert, "ca": ca.length === 0 ? undefined : ca };
+}
--- a/src/bin/tools/fs.existsAsync.ts
+++ b/src/bin/tools/fs.existsAsync.ts
@ -0,0 +1,11 @@
+import * as fs from "fs/promises";
+
+export async function existsAsync(path: string) {
+    try {
+        await fs.stat(path);
+        return true;
+    } catch (error) {
+        if ((error as Error & { code: string }).code === "ENOENT") return false;
+        throw error;
+    }
+}
--- a/src/bin/tools/getThisCodebaseRootDirPath.ts
+++ b/src/bin/tools/getThisCodebaseRootDirPath.ts
@ -1,19 +1,19 @@
 import * as fs from "fs";
 import * as path from "path";

-function getProjectRootRec(dirPath: string): string {
+function getThisCodebaseRootDirPath_rec(dirPath: string): string {
    if (fs.existsSync(path.join(dirPath, "package.json"))) {
        return dirPath;
    }
-    return getProjectRootRec(path.join(dirPath, ".."));
+    return getThisCodebaseRootDirPath_rec(path.join(dirPath, ".."));
 }

 let result: string | undefined = undefined;

-export function getProjectRoot(): string {
+export function getThisCodebaseRootDirPath(): string {
    if (result !== undefined) {
        return result;
    }

-    return (result = getProjectRootRec(__dirname));
+    return (result = getThisCodebaseRootDirPath_rec(__dirname));
 }
--- a/src/bin/tools/grant-exec-perms.ts
+++ b/src/bin/tools/grant-exec-perms.ts
@ -1,13 +1,15 @@
-import { getProjectRoot } from "./getProjectRoot";
+import { getThisCodebaseRootDirPath } from "./getThisCodebaseRootDirPath";
 import { join as pathJoin } from "path";
 import { constants } from "fs";
 import { chmod, stat } from "fs/promises";

 (async () => {
-    const { bin } = await import(pathJoin(getProjectRoot(), "package.json"));
+    const thisCodebaseRootDirPath = getThisCodebaseRootDirPath();
+
+    const { bin } = await import(pathJoin(thisCodebaseRootDirPath, "package.json"));

    const promises = Object.values<string>(bin).map(async scriptPath => {
-        const fullPath = pathJoin(getProjectRoot(), scriptPath);
+        const fullPath = pathJoin(thisCodebaseRootDirPath, scriptPath);
        const oldMode = (await stat(fullPath)).mode;
        const newMode = oldMode | constants.S_IXUSR | constants.S_IXGRP | constants.S_IXOTH;
        await chmod(fullPath, newMode);
--- a/src/bin/tools/pathJoin.ts
+++ b/src/bin/tools/pathJoin.ts
@ -1,6 +0,0 @@
-export function pathJoin(...path: string[]): string {
-    return path
-        .map((part, i) => (i === 0 ? part : part.replace(/^\/+/, "")))
-        .map((part, i) => (i === path.length - 1 ? part : part.replace(/\/+$/, "")))
-        .join(typeof process !== "undefined" && process.platform === "win32" ? "\\" : "/");
-}
--- a/src/bin/tools/readThisNpmProjectVersion.ts
+++ b/src/bin/tools/readThisNpmProjectVersion.ts
@ -0,0 +1,12 @@
+import { getThisCodebaseRootDirPath } from "./getThisCodebaseRootDirPath";
+import { assert } from "tsafe/assert";
+import * as fs from "fs";
+import { join as pathJoin } from "path";
+
+export function readThisNpmProjectVersion(): string {
+    const version = JSON.parse(fs.readFileSync(pathJoin(getThisCodebaseRootDirPath(), "package.json")).toString("utf8"))["version"];
+
+    assert(typeof version === "string");
+
+    return version;
+}
--- a/src/bin/tools/transformCodebase.ts
+++ b/src/bin/tools/transformCodebase.ts
@ -17,13 +17,14 @@ type TransformSourceCode = (params: { sourceCode: Buffer; filePath: string; file
 * */
 export function transformCodebase(params: { srcDirPath: string; destDirPath: string; transformSourceCode?: TransformSourceCode }) {
    const { srcDirPath, transformSourceCode } = params;
-    let { destDirPath } = params;

-    const isTargetSameAsSource = path.relative(srcDirPath, destDirPath) === "";
+    const isTargetSameAsSource = path.relative(srcDirPath, params.destDirPath) === "";

-    if (isTargetSameAsSource) {
-        destDirPath = path.join(srcDirPath, "..", "tmp_xOsPdkPsTdzPs34sOkHs");
-    }
+    const destDirPath = isTargetSameAsSource ? path.join(srcDirPath, "..", "tmp_xOsPdkPsTdzPs34sOkHs") : params.destDirPath;
+
+    fs.mkdirSync(destDirPath, {
+        "recursive": true
+    });

    for (const fileRelativePath of crawl({ "dirPath": srcDirPath, "returnedPathsType": "relative to dirPath" })) {
        const filePath = path.join(srcDirPath, fileRelativePath);
--- a/src/lib/BASE_URL.ts
+++ b/src/lib/BASE_URL.ts
@ -0,0 +1,44 @@
+import { assert } from "tsafe/assert";
+
+/**
+ * WARNING: Internal use only!!
+ * THIS DOES NOT WORK IN KEYCLOAK! It's only for resolving mock assets.
+ * This is just a way to know what's the base url that works
+ * both in webpack and vite.
+ * You can see this as a polyfill that return `import.meta.env.BASE_URL` when in Vite
+ * and when in Webpack returns the base url in the same format as vite does meaning
+ * "/" if hosted at root or "/foo/" when hosted under a subpath (always start and ends with a "/").
+ */
+export const BASE_URL = (() => {
+    vite: {
+        let BASE_URL: string;
+
+        try {
+            // @ts-expect-error
+            BASE_URL = import.meta.env.BASE_URL;
+
+            assert(typeof BASE_URL === "string");
+        } catch {
+            break vite;
+        }
+
+        return BASE_URL;
+    }
+
+    webpack: {
+        let BASE_URL: string;
+
+        try {
+            // @ts-expect-error
+            BASE_URL = process.env.PUBLIC_URL;
+
+            assert(typeof BASE_URL === "string");
+        } catch {
+            break webpack;
+        }
+
+        return BASE_URL === "" ? "/" : `${BASE_URL}/`;
+    }
+
+    throw new Error("Bundler not supported");
+})();
--- a/src/lib/isStorybook.ts
+++ b/src/lib/isStorybook.ts
@ -0,0 +1 @@
+export const isStorybook = typeof window === "object" && Object.keys(window).find(key => key.startsWith("__STORYBOOK")) !== undefined;
--- a/src/lib/keycloakJsAdapter.ts
+++ b/src/lib/keycloakJsAdapter.ts
@ -36,6 +36,10 @@ export declare namespace keycloak_js {
 }

 /**
+ * @deprecated: This will be removed in the next major version.
+ * If you use this, please copy paste the code into your project.
+ * Better yet migrate away from keycloak-js and use https://docs.oidc-spa.dev instead.
+ *
 * NOTE: This is just a slightly modified version of the default adapter in keycloak-js
 * The goal here is just to be able to inject search param in url before keycloak redirect.
 * Our use case for it is to pass over the login screen the states of useGlobalState
--- a/src/login/kcContext/KcContext.ts
+++ b/src/login/kcContext/KcContext.ts
@ -84,7 +84,7 @@ export declare namespace KcContext {
            description?: string;
            attributes: Record<string, string>;
        };
-        isAppInitiatedAction: boolean;
+        isAppInitiatedAction?: boolean;
        messagesPerField: {
            /**
             * Return text if message for given field exists. Useful eg. to add css styles for fields with message.
--- a/src/login/kcContext/createGetKcContext.ts
+++ b/src/login/kcContext/createGetKcContext.ts
@ -2,14 +2,13 @@ import type { KcContext, Attribute } from "./KcContext";
 import { kcContextMocks, kcContextCommonMock } from "./kcContextMocks";
 import type { DeepPartial } from "keycloakify/tools/DeepPartial";
 import { deepAssign } from "keycloakify/tools/deepAssign";
+import { isStorybook } from "keycloakify/lib/isStorybook";
 import { id } from "tsafe/id";
 import { exclude } from "tsafe/exclude";
 import { assert } from "tsafe/assert";
 import type { ExtendKcContext } from "./getKcContextFromWindow";
 import { getKcContextFromWindow } from "./getKcContextFromWindow";
-import { pathJoin } from "keycloakify/bin/tools/pathJoin";
 import { symToStr } from "tsafe/symToStr";
-import { resources_common } from "keycloakify/bin/constants";

 export function createGetKcContext<KcContextExtension extends { pageId: string } = never>(params?: {
    mockData?: readonly DeepPartial<ExtendKcContext<KcContextExtension>>[];
@ -31,7 +30,13 @@ export function createGetKcContext<KcContextExtension extends { pageId: string }
        if (mockPageId !== undefined && realKcContext === undefined) {
            //TODO maybe trow if no mock fo custom page

-            console.log(`%cKeycloakify: ${symToStr({ mockPageId })} set to ${mockPageId}.`, "background: red; color: yellow; font-size: medium");
+            warn_that_mock_is_enbaled: {
+                if (isStorybook) {
+                    break warn_that_mock_is_enbaled;
+                }
+
+                console.log(`%cKeycloakify: ${symToStr({ mockPageId })} set to ${mockPageId}.`, "background: red; color: yellow; font-size: medium");
+            }

            const kcContextDefaultMock = kcContextMocks.find(({ pageId }) => pageId === mockPageId);

@ -147,8 +152,6 @@ export function createGetKcContext<KcContextExtension extends { pageId: string }
            return { "kcContext": undefined as any };
        }

-        realKcContext.url.resourcesCommonPath = pathJoin(realKcContext.url.resourcesPath, resources_common);
-
        return { "kcContext": realKcContext as any };
    }

--- a/src/login/kcContext/kcContextMocks.ts
+++ b/src/login/kcContext/kcContextMocks.ts
@ -1,10 +1,10 @@
 import "minimal-polyfills/Object.fromEntries";
 import type { KcContext, Attribute } from "./KcContext";
 import { resources_common, keycloak_resources } from "keycloakify/bin/constants";
-import { pathJoin } from "keycloakify/bin/tools/pathJoin";
 import { id } from "tsafe/id";
 import { assert, type Equals } from "tsafe/assert";
 import type { LoginThemePageId } from "keycloakify/bin/keycloakify/generateFtl";
+import { BASE_URL } from "keycloakify/lib/BASE_URL";

 const attributes: Attribute[] = [
    {
@ -100,9 +100,7 @@ const attributes: Attribute[] = [

 const attributesByName = Object.fromEntries(attributes.map(attribute => [attribute.name, attribute])) as any;

-const PUBLIC_URL = (typeof process !== "object" ? undefined : process.env?.["PUBLIC_URL"]) || "/";
-
-const resourcesPath = pathJoin(PUBLIC_URL, keycloak_resources, "login", "resources");
+const resourcesPath = `${BASE_URL}${keycloak_resources}/login/resources`;

 export const kcContextCommonMock: KcContext.Common = {
    "themeVersion": "0.0.0",
@ -112,7 +110,7 @@ export const kcContextCommonMock: KcContext.Common = {
    "url": {
        "loginAction": "#",
        resourcesPath,
-        "resourcesCommonPath": pathJoin(resourcesPath, resources_common),
+        "resourcesCommonPath": `${resourcesPath}/${resources_common}`,
        "loginRestartFlowUrl": "/auth/realms/myrealm/login-actions/restart?client_id=account&tab_id=HoAx28ja4xg",
        "loginUrl": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg"
    },
--- a/src/login/pages/PageProps.ts
+++ b/src/login/pages/PageProps.ts
@ -1,10 +1,11 @@
 import type { I18n } from "keycloakify/login/i18n";
 import { type TemplateProps, type ClassKey } from "keycloakify/login/TemplateProps";
 import type { LazyOrNot } from "keycloakify/tools/LazyOrNot";
+import type { KcContext } from "keycloakify/account/kcContext";

-export type PageProps<KcContext, I18nExtended extends I18n> = {
+export type PageProps<NarowedKcContext = KcContext, I18nExtended extends I18n = I18n> = {
    Template: LazyOrNot<(props: TemplateProps<any, any>) => JSX.Element | null>;
-    kcContext: KcContext;
+    kcContext: NarowedKcContext;
    i18n: I18nExtended;
    doUseDefaultCss: boolean;
    classes?: Partial<Record<ClassKey, string>>;
--- a/src/vite-plugin/config.json
+++ b/src/vite-plugin/config.json
@ -1,232 +0,0 @@
-{
-    "plugins": [
-        {
-            "name": "vite:build-metadata"
-        },
-        {
-            "name": "vite:watch-package-data"
-        },
-        {
-            "name": "vite:pre-alias"
-        },
-        {
-            "name": "alias"
-        },
-        {
-            "name": "vite:react-babel",
-            "enforce": "pre"
-        },
-        {
-            "name": "vite:react-refresh",
-            "enforce": "pre"
-        },
-        {
-            "name": "vite:modulepreload-polyfill"
-        },
-        {
-            "name": "vite:resolve"
-        },
-        {
-            "name": "vite:html-inline-proxy"
-        },
-        {
-            "name": "vite:css"
-        },
-        {
-            "name": "vite:esbuild"
-        },
-        {
-            "name": "vite:json"
-        },
-        {
-            "name": "vite:wasm-helper"
-        },
-        {
-            "name": "vite:worker"
-        },
-        {
-            "name": "vite:asset"
-        },
-        {
-            "name": "vite-plugin-commonjs"
-        },
-        {
-            "name": "keycloakify"
-        },
-        {
-            "name": "vite:wasm-fallback"
-        },
-        {
-            "name": "vite:define"
-        },
-        {
-            "name": "vite:css-post"
-        },
-        {
-            "name": "vite:build-html"
-        },
-        {
-            "name": "vite:worker-import-meta-url"
-        },
-        {
-            "name": "vite:asset-import-meta-url"
-        },
-        {
-            "name": "vite:force-systemjs-wrap-complete"
-        },
-        {
-            "name": "commonjs",
-            "version": "25.0.7"
-        },
-        {
-            "name": "vite:data-uri"
-        },
-        {
-            "name": "vite:dynamic-import-vars"
-        },
-        {
-            "name": "vite:import-glob"
-        },
-        {
-            "name": "vite:build-import-analysis"
-        },
-        {
-            "name": "vite:esbuild-transpile"
-        },
-        {
-            "name": "vite:terser"
-        },
-        {
-            "name": "vite:reporter"
-        },
-        {
-            "name": "vite:load-fallback"
-        }
-    ],
-    "optimizeDeps": {
-        "disabled": "build",
-        "esbuildOptions": {
-            "preserveSymlinks": false,
-            "jsx": "automatic",
-            "plugins": [
-                {
-                    "name": "vite-plugin-commonjs:pre-bundle"
-                }
-            ]
-        },
-        "include": ["react", "react/jsx-dev-runtime", "react/jsx-runtime"]
-    },
-    "build": {
-        "target": ["es2020", "edge88", "firefox78", "chrome87", "safari14"],
-        "cssTarget": ["es2020", "edge88", "firefox78", "chrome87", "safari14"],
-        "outDir": "dist",
-        "assetsDir": "assets",
-        "assetsInlineLimit": 4096,
-        "cssCodeSplit": true,
-        "sourcemap": false,
-        "rollupOptions": {},
-        "minify": "esbuild",
-        "terserOptions": {},
-        "write": true,
-        "emptyOutDir": null,
-        "copyPublicDir": true,
-        "manifest": false,
-        "lib": false,
-        "ssr": false,
-        "ssrManifest": false,
-        "ssrEmitAssets": false,
-        "reportCompressedSize": true,
-        "chunkSizeWarningLimit": 500,
-        "watch": null,
-        "commonjsOptions": {
-            "include": [{}],
-            "extensions": [".js", ".cjs"]
-        },
-        "dynamicImportVarsOptions": {
-            "warnOnError": true,
-            "exclude": [{}]
-        },
-        "modulePreload": {
-            "polyfill": true
-        },
-        "cssMinify": true
-    },
-    "esbuild": {
-        "jsxDev": false,
-        "jsx": "automatic"
-    },
-    "resolve": {
-        "mainFields": ["browser", "module", "jsnext:main", "jsnext"],
-        "conditions": [],
-        "extensions": [".mjs", ".js", ".mts", ".ts", ".jsx", ".tsx", ".json"],
-        "dedupe": ["react", "react-dom"],
-        "preserveSymlinks": false,
-        "alias": [
-            {
-                "find": {},
-                "replacement": "/@fs/Users/joseph/github/keycloakify-starter/node_modules/vite/dist/client/env.mjs"
-            },
-            {
-                "find": {},
-                "replacement": "/@fs/Users/joseph/github/keycloakify-starter/node_modules/vite/dist/client/client.mjs"
-            }
-        ]
-    },
-    "configFile": "/Users/joseph/github/keycloakify-starter/vite.config.ts",
-    "configFileDependencies": ["/Users/joseph/github/keycloakify-starter/vite.config.ts"],
-    "inlineConfig": {
-        "optimizeDeps": {},
-        "build": {}
-    },
-    "root": "/Users/joseph/github/keycloakify-starter",
-    "base": "/",
-    "rawBase": "/",
-    "publicDir": "/Users/joseph/github/keycloakify-starter/public",
-    "cacheDir": "/Users/joseph/github/keycloakify-starter/node_modules/.vite",
-    "command": "build",
-    "mode": "production",
-    "ssr": {
-        "target": "node",
-        "optimizeDeps": {
-            "disabled": true,
-            "esbuildOptions": {
-                "preserveSymlinks": false
-            }
-        }
-    },
-    "isWorker": false,
-    "mainConfig": null,
-    "isProduction": true,
-    "css": {},
-    "server": {
-        "preTransformRequests": true,
-        "middlewareMode": false,
-        "fs": {
-            "strict": true,
-            "allow": ["/Users/joseph/github/keycloakify-starter"],
-            "deny": [".env", ".env.*", "*.{crt,pem}"],
-            "cachedChecks": false
-        }
-    },
-    "preview": {},
-    "envDir": "/Users/joseph/github/keycloakify-starter",
-    "env": {
-        "BASE_URL": "/",
-        "MODE": "production",
-        "DEV": false,
-        "PROD": true
-    },
-    "logger": {
-        "hasWarned": false
-    },
-    "packageCache": {},
-    "worker": {
-        "format": "iife",
-        "rollupOptions": {}
-    },
-    "appType": "spa",
-    "experimental": {
-        "importGlobRestoreExtension": false,
-        "hmrPartialAccept": false
-    }
-}
--- a/src/vite-plugin/vite-plugin.ts
+++ b/src/vite-plugin/vite-plugin.ts
@ -1,28 +1,39 @@
 import { join as pathJoin, relative as pathRelative, sep as pathSep } from "path";
-import { readParsedPackageJson } from "../bin/keycloakify/buildOptions/parsedPackageJson";
 import type { Plugin } from "vite";
-import { assert } from "tsafe/assert";
 import * as fs from "fs";
 import { resolvedViteConfigJsonBasename, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir, keycloak_resources } from "../bin/constants";
 import type { ResolvedViteConfig } from "../bin/keycloakify/buildOptions/resolvedViteConfig";
-import { getKeycloakifyBuildDirPath } from "../bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath";
+import { getCacheDirPath } from "../bin/keycloakify/buildOptions/getCacheDirPath";
 import { replaceAll } from "../bin/tools/String.prototype.replaceAll";
 import { id } from "tsafe/id";
 import { rm } from "../bin/tools/fs.rm";
+import { copyKeycloakResourcesToPublic } from "../bin/copy-keycloak-resources-to-public";
+import { assert } from "tsafe/assert";

-export function keycloakify(): Plugin {
+export function keycloakify() {
    let reactAppRootDirPath: string | undefined = undefined;
    let urlPathname: string | undefined = undefined;
    let buildDirPath: string | undefined = undefined;
+    let command: "build" | "serve" | undefined = undefined;
+
+    const plugin = {
+        "name": "keycloakify" as const,
+        "configResolved": async resolvedConfig => {
+            command = resolvedConfig.command;

-    return {
-        "name": "keycloakify",
-        "apply": "build",
-        "configResolved": resolvedConfig => {
            reactAppRootDirPath = resolvedConfig.root;
            urlPathname = (() => {
                let out = resolvedConfig.env.BASE_URL;

+                if (out.startsWith(".") && command === "build" && resolvedConfig.envPrefix?.includes("STORYBOOK_") !== true) {
+                    throw new Error(
+                        [
+                            `BASE_URL=${out} is not supported By Keycloakify. Use an absolute URL instead.`,
+                            `If this is a problem, please open an issue at https://github.com/keycloakify/keycloakify/issues/new`
+                        ].join("\n")
+                    );
+                }
+
                if (out === undefined) {
                    return undefined;
                }
@ -40,19 +51,16 @@ export function keycloakify(): Plugin {

            buildDirPath = pathJoin(reactAppRootDirPath, resolvedConfig.build.outDir);

-            const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({
-                "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": readParsedPackageJson({ reactAppRootDirPath }).keycloakify
-                    ?.keycloakifyBuildDirPath,
-                reactAppRootDirPath,
-                "bundler": "vite"
+            const { cacheDirPath } = getCacheDirPath({
+                reactAppRootDirPath
            });

-            if (!fs.existsSync(keycloakifyBuildDirPath)) {
-                fs.mkdirSync(keycloakifyBuildDirPath);
+            if (!fs.existsSync(cacheDirPath)) {
+                fs.mkdirSync(cacheDirPath, { "recursive": true });
            }

            fs.writeFileSync(
-                pathJoin(keycloakifyBuildDirPath, resolvedViteConfigJsonBasename),
+                pathJoin(cacheDirPath, resolvedViteConfigJsonBasename),
                Buffer.from(
                    JSON.stringify(
                        id<ResolvedViteConfig>({
@ -67,8 +75,18 @@ export function keycloakify(): Plugin {
                    "utf8"
                )
            );
+
+            await copyKeycloakResourcesToPublic({
+                "processArgv": ["--project", reactAppRootDirPath]
+            });
        },
        "transform": (code, id) => {
+            assert(command !== undefined);
+
+            if (command !== "build") {
+                return;
+            }
+
            assert(reactAppRootDirPath !== undefined);

            let transformedCode: string | undefined = undefined;
@ -82,9 +100,8 @@ export function keycloakify(): Plugin {
                    }
                }

-                const isJavascriptFile = id.endsWith(".js") || id.endsWith(".jsx");
-
                {
+                    const isJavascriptFile = id.endsWith(".js") || id.endsWith(".jsx");
                    const isTypeScriptFile = id.endsWith(".ts") || id.endsWith(".tsx");

                    if (!isTypeScriptFile && !isJavascriptFile) {
@ -92,8 +109,6 @@ export function keycloakify(): Plugin {
                    }
                }

-                const windowToken = isJavascriptFile ? "window" : "(window as any)";
-
                if (transformedCode === undefined) {
                    transformedCode = code;
                }
@ -103,9 +118,9 @@ export function keycloakify(): Plugin {
                    "import.meta.env.BASE_URL",
                    [
                        `(`,
-                        `(${windowToken}.${nameOfTheGlobal} === undefined || import.meta.env.MODE === "development") ?`,
-                        `    "${urlPathname ?? "/"}" :`,
-                        `    \`\${${windowToken}.${nameOfTheGlobal}.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/\``,
+                        `(window.${nameOfTheGlobal} === undefined || import.meta.env.MODE === "development")?`,
+                        `"${urlPathname ?? "/"}":`,
+                        `(window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/")`,
                        `)`
                    ].join("")
                );
@ -119,10 +134,18 @@ export function keycloakify(): Plugin {
                "code": transformedCode
            };
        },
-        "buildEnd": async () => {
+        "closeBundle": async () => {
+            assert(command !== undefined);
+
+            if (command !== "build") {
+                return;
+            }
+
            assert(buildDirPath !== undefined);

            await rm(pathJoin(buildDirPath, keycloak_resources), { "recursive": true, "force": true });
        }
-    };
+    } satisfies Plugin;
+
+    return plugin as any;
 }
--- a/test/bin/replacers.spec.ts
+++ b/test/bin/replacers.spec.ts
@ -361,40 +361,6 @@ describe("js replacer - webpack", () => {

        expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true);
    });
-
-    it("replaceImportsInJsCode_webpack - 4", () => {
-        const jsCodeUntransformed = `d={NODE_ENV:"production",PUBLIC_URL:"",WDS_SOCKET_HOST`;
-
-        const { fixedJsCode } = replaceImportsInJsCode_webpack({
-            "jsCode": jsCodeUntransformed,
-            "buildOptions": {
-                "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/build",
-                "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/build/static",
-                "urlPathname": undefined
-            }
-        });
-
-        const fixedJsCodeExpected = `d={NODE_ENV:"production",PUBLIC_URL:window.${nameOfTheGlobal}.url.resourcesPath+"/${basenameOfTheKeycloakifyResourcesDir}",WDS_SOCKET_HOST`;
-
-        expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true);
-    });
-
-    it("replaceImportsInJsCode_webpack - 5", () => {
-        const jsCodeUntransformed = `d={NODE_ENV:"production",PUBLIC_URL:"/foo-bar",WDS_SOCKET_HOST`;
-
-        const { fixedJsCode } = replaceImportsInJsCode_webpack({
-            "jsCode": jsCodeUntransformed,
-            "buildOptions": {
-                "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/build",
-                "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/build/static",
-                "urlPathname": "/foo-bar/"
-            }
-        });
-
-        const fixedJsCodeExpected = `d={NODE_ENV:"production",PUBLIC_URL:window.${nameOfTheGlobal}.url.resourcesPath+"/${basenameOfTheKeycloakifyResourcesDir}",WDS_SOCKET_HOST`;
-
-        expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true);
-    });
 });

 describe("css replacer", () => {
--- a/test/bin/setupSampleReactProject.ts
+++ b/test/bin/setupSampleReactProject.ts
@ -1,9 +1,16 @@
-import { downloadAndUnzip } from "keycloakify/bin/tools/downloadAndUnzip";
+import { downloadAndUnzip } from "keycloakify/bin/downloadAndUnzip";
+import { join as pathJoin } from "path";
+import { getThisCodebaseRootDirPath } from "keycloakify/bin/tools/getThisCodebaseRootDirPath";

 export async function setupSampleReactProject(destDirPath: string) {
+    const thisCodebaseRootDirPath = getThisCodebaseRootDirPath();
+
    await downloadAndUnzip({
        "url": "https://github.com/keycloakify/keycloakify/releases/download/v0.0.1/sample_build_dir_and_package_json.zip",
        "destDirPath": destDirPath,
-        "doUseCache": false
+        "buildOptions": {
+            "cacheDirPath": pathJoin(thisCodebaseRootDirPath, "node_modules", ".cache", "keycloakify"),
+            "npmWorkspaceRootDirPath": thisCodebaseRootDirPath
+        }
    });
 }
Author	SHA1	Message	Date
Joseph Garrone	69936750d5	Bump version	2024-02-21 20:43:34 +01:00
Joseph Garrone	442bfa4ed6	Update types to reflect what is actually there on the kcContext	2024-02-21 20:43:18 +01:00
Joseph Garrone	2a88e6802f	Bump version	2024-02-18 11:28:29 +01:00
Joseph Garrone	bcc8b12e13	Enable to statically build storybook in Vite project	2024-02-18 11:28:17 +01:00
Joseph Garrone	9b974505eb	Update ci	2024-02-17 04:15:31 +01:00
Joseph Garrone	29b1c26771	Bump version	2024-02-17 03:47:03 +01:00
Joseph Garrone	02db20d98b	Enable to release on v8 branch	2024-02-17 03:47:03 +01:00
Joseph Garrone	757354df7d	Follow up on #406	2024-02-17 03:47:03 +01:00
Joseph Garrone	563518cf46	Remove poll	2024-02-13 15:07:14 +01:00
Joseph Garrone	7c42d9082a	Remove broken badge	2024-02-13 04:47:14 +01:00
Joseph Garrone	040284af71	Reference Vite doc	2024-02-13 04:46:36 +01:00
Joseph Garrone	34f64184d9	Bump version	2024-02-13 01:33:31 +01:00
Joseph Garrone	b9abd74156	Create a .gitignore that matches all in the build_keycloak directory	2024-02-13 01:33:15 +01:00
Joseph Garrone	a1c0bfda6c	Bump version	2024-02-13 01:13:26 +01:00
Joseph Garrone	617dcef09d	Merge pull request #499 from keycloakify/vite Vite	2024-02-13 01:04:54 +01:00
Joseph Garrone	d9c406800a	Fix tests	2024-02-12 23:57:21 +01:00
Joseph Garrone	54b869def1	Release candidate	2024-02-12 23:43:21 +01:00
Joseph Garrone	d80a583979	Better test for isStorybook	2024-02-12 23:42:31 +01:00
Joseph Garrone	99bfd7379b	Release candidate	2024-02-12 13:43:34 +01:00
Joseph Garrone	5f257382fa	Prevent accumulation of assets in build dir	2024-02-12 13:43:12 +01:00
Joseph Garrone	e3e6847c82	Prevent users from having to use any	2024-02-12 13:27:07 +01:00
Joseph Garrone	4ee0823acb	Bump version	2024-02-12 01:47:21 +01:00
Joseph Garrone	d466123b1c	Use Keycloak 23.0.6	2024-02-12 01:41:08 +01:00
Joseph Garrone	21cbc14a48	Release candidate	2024-02-12 01:34:54 +01:00
Joseph Garrone	b2f2c3e386	Disalow releative basename in vite config	2024-02-12 01:34:34 +01:00
Joseph Garrone	b03340ed10	Do not dynamically import "en" to make vite happy	2024-02-12 00:33:12 +01:00
Joseph Garrone	5b563d8e9b	Improve privacy on the buildinfo file that might be served	2024-02-12 00:32:18 +01:00
Joseph Garrone	2790487fc7	Release candidate	2024-02-11 23:59:23 +01:00
Joseph Garrone	ad5a368065	Run vite configResolved in dev mode as well	2024-02-11 23:59:10 +01:00
Joseph Garrone	7c0a631a9a	Fix crash in vite-plugin	2024-02-11 23:54:28 +01:00
Joseph Garrone	4a8920749a	release candidate	2024-02-11 23:48:09 +01:00
Joseph Garrone	8ab118dd06	Remove path-browserify dependency	2024-02-11 23:47:58 +01:00
Joseph Garrone	e6661cb898	Fix build	2024-02-11 23:22:37 +01:00
Joseph Garrone	1671850714	Release candidate	2024-02-11 20:21:05 +01:00
Joseph Garrone	d568bafe04	Remove unessesary file	2024-02-11 20:20:52 +01:00
Joseph Garrone	43dcce8478	Add cache to getNpmWorkspaceRootDirPath	2024-02-11 20:20:38 +01:00
Joseph Garrone	ad70a4cffd	Make Vite run copy-keaycloak-resources-to-public	2024-02-11 20:15:18 +01:00
Joseph Garrone	6d4a948dd8	minor refactor	2024-02-11 19:25:52 +01:00
Joseph Garrone	839ba6a964	Improve monorepo support	2024-02-11 18:28:58 +01:00
Joseph Garrone	b5cfdb9d0a	Store vite plugin output in cache dir path	2024-02-11 16:17:58 +01:00
Joseph Garrone	9706338182	Release candidate	2024-02-11 12:05:05 +01:00
Joseph Garrone	05f52c3d23	Remove unessesary log	2024-02-11 12:04:50 +01:00
Joseph Garrone	df3acb6932	Release candidate	2024-02-11 10:38:12 +01:00
Joseph Garrone	b3c242595e	Fix PUBLIC_URL typing	2024-02-11 10:37:22 +01:00
Joseph Garrone	26985f8d81	Release candidate	2024-02-11 00:21:21 +01:00
Joseph Garrone	05e5e4efec	When is storybook, don't print mock related warning in console	2024-02-11 00:21:04 +01:00
Joseph Garrone	4d67f16e94	Release candidate	2024-02-10 20:40:59 +01:00
Joseph Garrone	334ec1870a	Throw if unrecognized bundler when getting BASE_URL for mocks	2024-02-10 20:40:41 +01:00
Joseph Garrone	ef5e4fccd3	Replace the common asset path url in the ftl (upstream) to help pepole figure out what's going on	2024-02-10 20:04:08 +01:00
Joseph Garrone	8535edcfd4	Relase candidate	2024-02-10 19:51:39 +01:00
Joseph Garrone	bda76200d7	Base url that works everywhere in mocks	2024-02-10 19:51:24 +01:00
Joseph Garrone	db0dc96cc7	Release candidate	2024-02-09 17:56:57 +01:00
Joseph Garrone	6d62b5a150	Don't replace process.env.PUBLIC_URL	2024-02-09 17:56:28 +01:00
Joseph Garrone	217439d673	Export polyfill of process.env.PUBLIC_URL	2024-02-09 17:52:26 +01:00
Joseph Garrone	1f79a8f7dc	Deprecate keycloakJsAdapter	2024-02-09 17:52:03 +01:00
Joseph Garrone	7596786b18	Release candidate	2024-02-08 23:37:14 +01:00
Joseph Garrone	2540b06c94	Tweak the resources of the default theme that are kept	2024-02-08 23:36:52 +01:00
Joseph Garrone	43eeaf3002	Remove misleading comment in start-keycloak-container script	2024-02-08 14:41:07 +01:00
Joseph Garrone	037cd150de	Release candidate	2024-02-08 14:10:10 +01:00
Joseph Garrone	ae0b059217	Fix a couple of bug in donwnload-builtin-keycloak-theme	2024-02-08 14:09:55 +01:00
				`@ -0,0 +1 @@`
				`export const isStorybook = typeof window === "object" && Object.keys(window).find(key => key.startsWith("__STORYBOOK")) !== undefined;`