keycloakify 10.0.0-rc.2 → 10.0.0-rc.20

package/src/bin/shared/buildOptions.ts

@@ -0,0 +1,307 @@
+import { parse as urlParse } from "url";
+import { join as pathJoin } from "path";
+import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath";
+import { getNpmWorkspaceRootDirPath } from "../tools/getNpmWorkspaceRootDirPath";
+import type { CliCommandOptions } from "../main";
+import { z } from "zod";
+import * as fs from "fs";
+import { assert } from "tsafe";
+import * as child_process from "child_process";
+import { vitePluginSubScriptEnvNames } from "./constants";
+
+/** Consolidated build option gathered form CLI arguments and config in package.json */
+export type BuildOptions = {
+    bundler: "vite" | "webpack";
+    themeVersion: string;
+    themeNames: string[];
+    extraThemeProperties: string[] | undefined;
+    groupId: string;
+    artifactId: string;
+    loginThemeResourcesFromKeycloakVersion: string;
+    reactAppRootDirPath: string;
+    // TODO: Remove from vite type
+    reactAppBuildDirPath: string;
+    /** Directory that keycloakify outputs to. Defaults to {cwd}/build_keycloak */
+    keycloakifyBuildDirPath: string;
+    publicDirPath: string;
+    cacheDirPath: string;
+    /** If your app is hosted under a subpath, it's the case in CRA if you have "homepage": "https://example.com/my-app" in your package.json
+     * In this case the urlPathname will be "/my-app/" */
+    urlPathname: string | undefined;
+    assetsDirPath: string;
+    npmWorkspaceRootDirPath: string;
+};
+
+export type UserProvidedBuildOptions = {
+    extraThemeProperties?: string[];
+    artifactId?: string;
+    groupId?: string;
+    loginThemeResourcesFromKeycloakVersion?: string;
+    keycloakifyBuildDirPath?: string;
+    themeName?: string | string[];
+};
+
+export type ResolvedViteConfig = {
+    buildDir: string;
+    publicDir: string;
+    assetsDir: string;
+    urlPathname: string | undefined;
+    userProvidedBuildOptions: UserProvidedBuildOptions;
+};
+
+export function readBuildOptions(params: {
+    cliCommandOptions: CliCommandOptions;
+}): BuildOptions {
+    const { cliCommandOptions } = params;
+
+    const reactAppRootDirPath = (() => {
+        if (cliCommandOptions.reactAppRootDirPath === undefined) {
+            return process.cwd();
+        }
+
+        return getAbsoluteAndInOsFormatPath({
+            pathIsh: cliCommandOptions.reactAppRootDirPath,
+            cwd: process.cwd()
+        });
+    })();
+
+    const { resolvedViteConfig } = (() => {
+        if (
+            fs
+                .readdirSync(reactAppRootDirPath)
+                .find(fileBasename => fileBasename.startsWith("vite.config")) ===
+            undefined
+        ) {
+            return { resolvedViteConfig: undefined };
+        }
+
+        const output = child_process
+            .execSync("npx vite", {
+                cwd: reactAppRootDirPath,
+                env: {
+                    ...process.env,
+                    [vitePluginSubScriptEnvNames.resolveViteConfig]: "true"
+                }
+            })
+            .toString("utf8");
+
+        assert(
+            output.includes(vitePluginSubScriptEnvNames.resolveViteConfig),
+            "Seems like the Keycloakify's Vite plugin is not installed."
+        );
+
+        const resolvedViteConfigStr = output
+            .split(vitePluginSubScriptEnvNames.resolveViteConfig)
+            .reverse()[0];
+
+        const resolvedViteConfig: ResolvedViteConfig = JSON.parse(resolvedViteConfigStr);
+
+        return { resolvedViteConfig };
+    })();
+
+    const parsedPackageJson = (() => {
+        type ParsedPackageJson = {
+            name: string;
+            version?: string;
+            homepage?: string;
+            keycloakify?: UserProvidedBuildOptions & {
+                reactAppBuildDirPath?: string;
+            };
+        };
+
+        const zParsedPackageJson = z.object({
+            name: z.string(),
+            version: z.string().optional(),
+            homepage: z.string().optional(),
+            keycloakify: z
+                .object({
+                    extraThemeProperties: z.array(z.string()).optional(),
+                    artifactId: z.string().optional(),
+                    groupId: z.string().optional(),
+                    loginThemeResourcesFromKeycloakVersion: z.string().optional(),
+                    reactAppBuildDirPath: z.string().optional(),
+                    keycloakifyBuildDirPath: z.string().optional(),
+                    themeName: z.union([z.string(), z.array(z.string())]).optional()
+                })
+                .optional()
+        });
+
+        {
+            type Got = ReturnType<(typeof zParsedPackageJson)["parse"]>;
+            type Expected = ParsedPackageJson;
+            assert<Got extends Expected ? true : false>();
+            assert<Expected extends Got ? true : false>();
+        }
+
+        return zParsedPackageJson.parse(
+            JSON.parse(
+                fs
+                    .readFileSync(pathJoin(reactAppRootDirPath, "package.json"))
+                    .toString("utf8")
+            )
+        );
+    })();
+
+    const userProvidedBuildOptions: UserProvidedBuildOptions = {
+        ...parsedPackageJson.keycloakify,
+        ...resolvedViteConfig?.userProvidedBuildOptions
+    };
+
+    const themeNames = (() => {
+        if (userProvidedBuildOptions.themeName === undefined) {
+            return [
+                parsedPackageJson.name
+                    .replace(/^@(.*)/, "$1")
+                    .split("/")
+                    .join("-")
+            ];
+        }
+
+        if (typeof userProvidedBuildOptions.themeName === "string") {
+            return [userProvidedBuildOptions.themeName];
+        }
+
+        return userProvidedBuildOptions.themeName;
+    })();
+
+    const reactAppBuildDirPath = (() => {
+        webpack: {
+            if (resolvedViteConfig !== undefined) {
+                break webpack;
+            }
+
+            if (parsedPackageJson.keycloakify?.reactAppBuildDirPath !== undefined) {
+                return getAbsoluteAndInOsFormatPath({
+                    pathIsh: parsedPackageJson.keycloakify.reactAppBuildDirPath,
+                    cwd: reactAppRootDirPath
+                });
+            }
+
+            return pathJoin(reactAppRootDirPath, "build");
+        }
+
+        return pathJoin(reactAppRootDirPath, resolvedViteConfig.buildDir);
+    })();
+
+    const { npmWorkspaceRootDirPath } = getNpmWorkspaceRootDirPath({
+        reactAppRootDirPath,
+        dependencyExpected: "keycloakify"
+    });
+
+    return {
+        bundler: resolvedViteConfig !== undefined ? "vite" : "webpack",
+        themeVersion:
+            process.env.KEYCLOAKIFY_THEME_VERSION ?? parsedPackageJson.version ?? "0.0.0",
+        themeNames,
+        extraThemeProperties: userProvidedBuildOptions.extraThemeProperties,
+        groupId: (() => {
+            const fallbackGroupId = `${themeNames[0]}.keycloak`;
+
+            return (
+                process.env.KEYCLOAKIFY_GROUP_ID ??
+                userProvidedBuildOptions.groupId ??
+                (parsedPackageJson.homepage === undefined
+                    ? fallbackGroupId
+                    : urlParse(parsedPackageJson.homepage)
+                          .host?.replace(/:[0-9]+$/, "")
+                          ?.split(".")
+                          .reverse()
+                          .join(".") ?? fallbackGroupId) + ".keycloak"
+            );
+        })(),
+        artifactId:
+            process.env.KEYCLOAKIFY_ARTIFACT_ID ??
+            userProvidedBuildOptions.artifactId ??
+            `${themeNames[0]}-keycloak-theme`,
+        loginThemeResourcesFromKeycloakVersion:
+            userProvidedBuildOptions.loginThemeResourcesFromKeycloakVersion ?? "24.0.4",
+        reactAppRootDirPath,
+        reactAppBuildDirPath,
+        keycloakifyBuildDirPath: (() => {
+            if (userProvidedBuildOptions.keycloakifyBuildDirPath !== undefined) {
+                return getAbsoluteAndInOsFormatPath({
+                    pathIsh: userProvidedBuildOptions.keycloakifyBuildDirPath,
+                    cwd: reactAppRootDirPath
+                });
+            }
+
+            return pathJoin(
+                reactAppRootDirPath,
+                resolvedViteConfig?.buildDir === undefined
+                    ? "build_keycloak"
+                    : `${resolvedViteConfig.buildDir}_keycloak`
+            );
+        })(),
+        publicDirPath: (() => {
+            webpack: {
+                if (resolvedViteConfig !== undefined) {
+                    break webpack;
+                }
+
+                if (process.env.PUBLIC_DIR_PATH !== undefined) {
+                    return getAbsoluteAndInOsFormatPath({
+                        pathIsh: process.env.PUBLIC_DIR_PATH,
+                        cwd: reactAppRootDirPath
+                    });
+                }
+
+                return pathJoin(reactAppRootDirPath, "public");
+            }
+
+            return pathJoin(reactAppRootDirPath, resolvedViteConfig.publicDir);
+        })(),
+        cacheDirPath: (() => {
+            const cacheDirPath = pathJoin(
+                (() => {
+                    if (process.env.XDG_CACHE_HOME !== undefined) {
+                        return getAbsoluteAndInOsFormatPath({
+                            pathIsh: process.env.XDG_CACHE_HOME,
+                            cwd: process.cwd()
+                        });
+                    }
+
+                    return pathJoin(npmWorkspaceRootDirPath, "node_modules", ".cache");
+                })(),
+                "keycloakify"
+            );
+
+            return cacheDirPath;
+        })(),
+        urlPathname: (() => {
+            webpack: {
+                if (resolvedViteConfig !== undefined) {
+                    break webpack;
+                }
+
+                const { homepage } = parsedPackageJson;
+
+                let url: URL | undefined = undefined;
+
+                if (homepage !== undefined) {
+                    url = new URL(homepage);
+                }
+
+                if (url === undefined) {
+                    return undefined;
+                }
+
+                const out = url.pathname.replace(/([^/])$/, "$1/");
+                return out === "/" ? undefined : out;
+            }
+
+            return resolvedViteConfig.urlPathname;
+        })(),
+        assetsDirPath: (() => {
+            webpack: {
+                if (resolvedViteConfig !== undefined) {
+                    break webpack;
+                }
+
+                return pathJoin(reactAppBuildDirPath, "static");
+            }
+
+            return pathJoin(reactAppBuildDirPath, resolvedViteConfig.assetsDir);
+        })(),
+        npmWorkspaceRootDirPath
+    };
+}

package/src/bin/{keycloakify/generateFtl/pageId.ts → shared/constants.ts}

@@ -1,3 +1,23 @@
+export const nameOfTheGlobal = "kcContext";
+export const nameOfTheLocalizationRealmOverridesUserProfileProperty =
+    "__localizationRealmOverridesUserProfile";
+export const keycloak_resources = "keycloak-resources";
+export const resources_common = "resources-common";
+export const lastKeycloakVersionWithAccountV1 = "21.1.2";
+export const basenameOfTheKeycloakifyResourcesDir = "build";
+
+export const themeTypes = ["login", "account"] as const;
+export const accountV1ThemeName = "account-v1";
+
+export type ThemeType = (typeof themeTypes)[number];
+
+export const vitePluginSubScriptEnvNames = {
+    runPostBuildScript: "KEYCLOAKIFY_RUN_POST_BUILD_SCRIPT",
+    resolveViteConfig: "KEYCLOAKIFY_RESOLVE_VITE_CONFIG"
+} as const;
+
+export const skipBuildJarsEnvName = "KEYCLOAKIFY_SKIP_BUILD_JAR";
+
 export const loginThemePageIds = [
     "login.ftl",
     "login-username.ftl",
@@ -35,7 +55,17 @@ export const loginThemePageIds = [
     "webauthn-error.ftl"
 ] as const;
 
-export const accountThemePageIds = ["password.ftl", "account.ftl", "sessions.ftl", "totp.ftl", "applications.ftl", "log.ftl"] as const;
+export const accountThemePageIds = [
+    "password.ftl",
+    "account.ftl",
+    "sessions.ftl",
+    "totp.ftl",
+    "applications.ftl",
+    "log.ftl",
+    "federatedIdentity.ftl"
+] as const;
 
 export type LoginThemePageId = (typeof loginThemePageIds)[number];
 export type AccountThemePageId = (typeof accountThemePageIds)[number];
+
+export const containerName = "keycloak-keycloakify";

package/src/bin/shared/copyKeycloakResourcesToPublic.ts

@@ -0,0 +1,104 @@
+import {
+    downloadKeycloakStaticResources,
+    type BuildOptionsLike as BuildOptionsLike_downloadKeycloakStaticResources
+} from "./downloadKeycloakStaticResources";
+import { join as pathJoin, relative as pathRelative } from "path";
+import {
+    themeTypes,
+    keycloak_resources,
+    lastKeycloakVersionWithAccountV1
+} from "../shared/constants";
+import { readThisNpmPackageVersion } from "../tools/readThisNpmPackageVersion";
+import { assert } from "tsafe/assert";
+import * as fs from "fs";
+import { rmSync } from "../tools/fs.rmSync";
+import type { BuildOptions } from "./buildOptions";
+
+export type BuildOptionsLike = BuildOptionsLike_downloadKeycloakStaticResources & {
+    loginThemeResourcesFromKeycloakVersion: string;
+    publicDirPath: string;
+};
+
+assert<BuildOptions extends BuildOptionsLike ? true : false>();
+
+export async function copyKeycloakResourcesToPublic(params: {
+    buildOptions: BuildOptionsLike;
+}) {
+    const { buildOptions } = params;
+
+    const destDirPath = pathJoin(buildOptions.publicDirPath, keycloak_resources);
+
+    const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo");
+
+    const keycloakifyBuildinfoRaw = JSON.stringify(
+        {
+            destDirPath,
+            keycloakifyVersion: readThisNpmPackageVersion(),
+            buildOptions: {
+                loginThemeResourcesFromKeycloakVersion: readThisNpmPackageVersion(),
+                cacheDirPath: pathRelative(destDirPath, buildOptions.cacheDirPath),
+                npmWorkspaceRootDirPath: pathRelative(
+                    destDirPath,
+                    buildOptions.npmWorkspaceRootDirPath
+                )
+            }
+        },
+        null,
+        2
+    );
+
+    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 });
+
+    fs.mkdirSync(destDirPath, { recursive: true });
+
+    fs.writeFileSync(pathJoin(destDirPath, ".gitignore"), Buffer.from("*", "utf8"));
+
+    for (const themeType of themeTypes) {
+        await downloadKeycloakStaticResources({
+            keycloakVersion: (() => {
+                switch (themeType) {
+                    case "login":
+                        return buildOptions.loginThemeResourcesFromKeycloakVersion;
+                    case "account":
+                        return lastKeycloakVersionWithAccountV1;
+                }
+            })(),
+            themeType,
+            themeDirPath: destDirPath,
+            buildOptions
+        });
+    }
+
+    fs.writeFileSync(
+        pathJoin(destDirPath, "README.txt"),
+        Buffer.from(
+            // prettier-ignore
+            [
+                "This is just a test folder that helps develop",
+                "the login and register page without having to run a Keycloak container\n",
+                "This directory will be automatically excluded from the final build."
+            ].join(" ")
+        )
+    );
+
+    fs.writeFileSync(
+        keycloakifyBuildinfoFilePath,
+        Buffer.from(keycloakifyBuildinfoRaw, "utf8")
+    );
+}

package/src/bin/shared/downloadKeycloakDefaultTheme.ts

@@ -0,0 +1,207 @@
+import { join as pathJoin, relative as pathRelative } from "path";
+import { type BuildOptions } from "./buildOptions";
+import { assert } from "tsafe/assert";
+import { lastKeycloakVersionWithAccountV1 } from "./constants";
+import { downloadAndExtractArchive } from "../tools/downloadAndExtractArchive";
+import { isInside } from "../tools/isInside";
+
+export type BuildOptionsLike = {
+    cacheDirPath: string;
+    npmWorkspaceRootDirPath: string;
+};
+
+assert<BuildOptions extends BuildOptionsLike ? true : false>();
+
+export async function downloadKeycloakDefaultTheme(params: {
+    keycloakVersion: string;
+    buildOptions: BuildOptionsLike;
+}): Promise<{ defaultThemeDirPath: string }> {
+    const { keycloakVersion, buildOptions } = params;
+
+    const { extractedDirPath } = await downloadAndExtractArchive({
+        url: `https://repo1.maven.org/maven2/org/keycloak/keycloak-themes/${keycloakVersion}/keycloak-themes-${keycloakVersion}.jar`,
+        cacheDirPath: buildOptions.cacheDirPath,
+        npmWorkspaceRootDirPath: buildOptions.npmWorkspaceRootDirPath,
+        uniqueIdOfOnOnArchiveFile: "downloadKeycloakDefaultTheme",
+        onArchiveFile: async params => {
+            if (!isInside({ dirPath: "theme", filePath: params.fileRelativePath })) {
+                return;
+            }
+
+            const { readFile, writeFile } = params;
+
+            const fileRelativePath = pathRelative("theme", params.fileRelativePath);
+
+            skip_keycloak_v2: {
+                if (
+                    !isInside({
+                        dirPath: pathJoin("keycloak.v2"),
+                        filePath: fileRelativePath
+                    })
+                ) {
+                    break skip_keycloak_v2;
+                }
+
+                return;
+            }
+
+            last_account_v1_transformations: {
+                if (lastKeycloakVersionWithAccountV1 !== keycloakVersion) {
+                    break last_account_v1_transformations;
+                }
+
+                patch_account_css: {
+                    if (
+                        fileRelativePath !==
+                        pathJoin("keycloak", "account", "resources", "css", "account.css")
+                    ) {
+                        break patch_account_css;
+                    }
+
+                    await writeFile({
+                        fileRelativePath,
+                        modifiedData: Buffer.from(
+                            (await readFile())
+                                .toString("utf8")
+                                .replace("top: -34px;", "top: -34px !important;"),
+                            "utf8"
+                        )
+                    });
+
+                    return;
+                }
+
+                skip_web_modules: {
+                    if (
+                        !isInside({
+                            dirPath: pathJoin(
+                                "keycloak",
+                                "common",
+                                "resources",
+                                "web_modules"
+                            ),
+                            filePath: fileRelativePath
+                        })
+                    ) {
+                        break skip_web_modules;
+                    }
+
+                    return;
+                }
+
+                skip_unused_node_modules: {
+                    const nodeModulesDirPath = pathJoin(
+                        "keycloak",
+                        "common",
+                        "resources",
+                        "node_modules"
+                    );
+
+                    if (
+                        !isInside({
+                            dirPath: nodeModulesDirPath,
+                            filePath: fileRelativePath
+                        })
+                    ) {
+                        break skip_unused_node_modules;
+                    }
+
+                    const toKeepPrefixes = [
+                        ...[
+                            "patternfly.min.css",
+                            "patternfly-additions.min.css",
+                            "patternfly-additions.min.css"
+                        ].map(fileBasename =>
+                            pathJoin(
+                                nodeModulesDirPath,
+                                "patternfly",
+                                "dist",
+                                "css",
+                                fileBasename
+                            )
+                        ),
+                        pathJoin(nodeModulesDirPath, "patternfly", "dist", "fonts")
+                    ];
+
+                    if (
+                        toKeepPrefixes.find(prefix =>
+                            fileRelativePath.startsWith(prefix)
+                        ) !== undefined
+                    ) {
+                        break skip_unused_node_modules;
+                    }
+
+                    return;
+                }
+            }
+
+            skip_unused_resources: {
+                if (keycloakVersion !== "24.0.4") {
+                    break skip_unused_resources;
+                }
+
+                for (const dirBasename of [
+                    "@patternfly-v5",
+                    "@rollup",
+                    "rollup",
+                    "react",
+                    "react-dom",
+                    "shx",
+                    ".pnpm"
+                ]) {
+                    if (
+                        isInside({
+                            dirPath: pathJoin(
+                                "keycloak",
+                                "common",
+                                "resources",
+                                "node_modules",
+                                dirBasename
+                            ),
+                            filePath: fileRelativePath
+                        })
+                    ) {
+                        return;
+                    }
+                }
+
+                for (const dirBasename of ["react", "react-dom"]) {
+                    if (
+                        isInside({
+                            dirPath: pathJoin(
+                                "keycloak",
+                                "common",
+                                "resources",
+                                "vendor",
+                                dirBasename
+                            ),
+                            filePath: fileRelativePath
+                        })
+                    ) {
+                        return;
+                    }
+                }
+
+                if (
+                    isInside({
+                        dirPath: pathJoin(
+                            "keycloak",
+                            "common",
+                            "resources",
+                            "node_modules",
+                            "@patternfly",
+                            "react-core"
+                        ),
+                        filePath: fileRelativePath
+                    })
+                ) {
+                    return;
+                }
+            }
+
+            await writeFile({ fileRelativePath });
+        }
+    });
+
+    return { defaultThemeDirPath: extractedDirPath };
+}