diff --git a/package.json b/package.json index a75533e3..ebf92702 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "10.1.0", + "version": "10.1.4", "description": "Create Keycloak themes using React", "repository": { "type": "git", diff --git a/scripts/build-storybook.ts b/scripts/build-storybook.ts index eeccbb9e..51aac8ca 100644 --- a/scripts/build-storybook.ts +++ b/scripts/build-storybook.ts @@ -1,59 +1,8 @@ import * as child_process from "child_process"; -import { transformCodebase } from "../src/bin/tools/transformCodebase"; -import { join as pathJoin, sep as pathSep } from "path"; -import { assert } from "tsafe/assert"; run("yarn build"); run("npx build-storybook"); -const storybookStaticDirPath = "storybook-static"; - -{ - let hasPatched = false; - - transformCodebase({ - srcDirPath: storybookStaticDirPath, - destDirPath: storybookStaticDirPath, - transformSourceCode: ({ fileRelativePath, sourceCode }) => { - replace_dot_keycloakify: { - if (fileRelativePath.includes(pathSep)) { - break replace_dot_keycloakify; - } - - if (!fileRelativePath.endsWith(".js")) { - break replace_dot_keycloakify; - } - - const search = `DOT_KEYCLOAKIFY:".keycloakify"`; - - if (!sourceCode.includes(search)) { - break replace_dot_keycloakify; - } - - hasPatched = true; - - return { - modifiedSourceCode: Buffer.from( - sourceCode - .toString("utf8") - .replace(search, `DOT_KEYCLOAKIFY:"dot_keycloakify"`), - "utf8" - ) - }; - } - - return { modifiedSourceCode: sourceCode }; - } - }); - - assert(hasPatched); -} - -transformCodebase({ - srcDirPath: pathJoin(storybookStaticDirPath, ".keycloakify"), - destDirPath: pathJoin(storybookStaticDirPath, "dot_keycloakify") -}); - function run(command: string, options?: { env?: NodeJS.ProcessEnv }) { console.log(`$ ${command}`); diff --git a/scripts/build/createPublicDotKeycloakifyDir.ts b/scripts/build/createPublicKeycloakifyDevResourcesDir.ts similarity index 94% rename from scripts/build/createPublicDotKeycloakifyDir.ts rename to scripts/build/createPublicKeycloakifyDevResourcesDir.ts index 667124ea..29673261 100644 --- a/scripts/build/createPublicDotKeycloakifyDir.ts +++ b/scripts/build/createPublicKeycloakifyDevResourcesDir.ts @@ -7,7 +7,7 @@ import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "../../src/bin/shared/constants"; import { assert, type Equals } from "tsafe/assert"; import * as fsPr from "fs/promises"; -export async function createPublicDotKeycloakifyDir() { +export async function createPublicKeycloakifyDevResourcesDir() { await Promise.all( (["login", "account"] as const).map(async themeType => { const { extractedDirPath } = await downloadKeycloakDefaultTheme({ @@ -27,7 +27,7 @@ export async function createPublicDotKeycloakifyDir() { "dist", "res", "public", - WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY, + WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES, themeType ); diff --git a/scripts/build/main.ts b/scripts/build/main.ts index 40896817..b07a054f 100644 --- a/scripts/build/main.ts +++ b/scripts/build/main.ts @@ -3,7 +3,7 @@ import * as fs from "fs"; import { join } from "path"; import { assert } from "tsafe/assert"; import { transformCodebase } from "../../src/bin/tools/transformCodebase"; -import { createPublicDotKeycloakifyDir } from "./createPublicDotKeycloakifyDir"; +import { createPublicKeycloakifyDevResourcesDir } from "./createPublicKeycloakifyDevResourcesDir"; import { createAccountV1Dir } from "./createAccountV1Dir"; import chalk from "chalk"; @@ -144,7 +144,7 @@ import chalk from "chalk"; fs.cpSync(dirBasename, destDirPath, { recursive: true }); } - await createPublicDotKeycloakifyDir(); + await createPublicKeycloakifyDevResourcesDir(); await createAccountV1Dir(); transformCodebase({ diff --git a/src/account/KcContext/kcContextMocks.ts b/src/account/KcContext/kcContextMocks.ts index ebb93607..b6d7f44d 100644 --- a/src/account/KcContext/kcContextMocks.ts +++ b/src/account/KcContext/kcContextMocks.ts @@ -6,7 +6,7 @@ import { BASE_URL } from "keycloakify/lib/BASE_URL"; import { assert, type Equals } from "tsafe/assert"; import type { LanguageTag } from "keycloakify/account/i18n/messages_defaultSet/types"; -const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY}/account`; +const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES}/account`; export const kcContextCommonMock: KcContext.Common = { themeVersion: "0.0.0", diff --git a/src/bin/keycloakify/generateFtl/kcContextDeclarationTemplate.ftl b/src/bin/keycloakify/generateFtl/kcContextDeclarationTemplate.ftl index 51881ee4..d61b6980 100644 --- a/src/bin/keycloakify/generateFtl/kcContextDeclarationTemplate.ftl +++ b/src/bin/keycloakify/generateFtl/kcContextDeclarationTemplate.ftl @@ -85,6 +85,19 @@ attributes_to_attributesByName: { }); } window.kcContext = kcContext; + +<#if xKeycloakify.themeType == "login" > + const script = document.createElement("script"); + script.type = "importmap"; + script.textContent = JSON.stringify({ + imports: { + "rfc4648": kcContext.url.resourcesCommonPath + "/node_modules/rfc4648/lib/rfc4648.js" + } + }, null, 2); + + document.head.appendChild(script); + + function decodeHtmlEntities(htmlStr){ var element = decodeHtmlEntities.element; if (!element) { diff --git a/src/bin/keycloakify/generateResources/generateResourcesForMainTheme.ts b/src/bin/keycloakify/generateResources/generateResourcesForMainTheme.ts index 51a5b312..b0079a65 100644 --- a/src/bin/keycloakify/generateResources/generateResourcesForMainTheme.ts +++ b/src/bin/keycloakify/generateResources/generateResourcesForMainTheme.ts @@ -112,7 +112,7 @@ export async function generateResourcesForMainTheme(params: { { const dirPath = pathJoin( buildContext.projectBuildDirPath, - WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY + WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES ); if (fs.existsSync(dirPath)) { @@ -120,7 +120,7 @@ export async function generateResourcesForMainTheme(params: { throw new Error( [ - `Keycloakify build error: The ${WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY} directory shouldn't exist in your build directory.`, + `Keycloakify build error: The ${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES} directory shouldn't exist in your build directory.`, `(${pathRelative(process.cwd(), dirPath)}).\n`, `Theses assets are only required for local development with Storybook.", "Please remove this directory as an additional step of your command.\n`, @@ -266,7 +266,7 @@ export async function generateResourcesForMainTheme(params: { getThisCodebaseRootDirPath(), "res", "public", - WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY, + WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES, themeType ), destDirPath: pathJoin(themeTypeDirPath, "resources") diff --git a/src/bin/shared/constants.ts b/src/bin/shared/constants.ts index adf6e3fc..d0707a90 100644 --- a/src/bin/shared/constants.ts +++ b/src/bin/shared/constants.ts @@ -1,5 +1,5 @@ export const WELL_KNOWN_DIRECTORY_BASE_NAME = { - DOT_KEYCLOAKIFY: ".keycloakify", + KEYCLOAKIFY_DEV_RESOURCES: "keycloakify-dev-resources", RESOURCES_COMMON: "resources-common", DIST: "dist" } as const; diff --git a/src/bin/shared/copyKeycloakResourcesToPublic.ts b/src/bin/shared/copyKeycloakResourcesToPublic.ts index e9a90762..db78d313 100644 --- a/src/bin/shared/copyKeycloakResourcesToPublic.ts +++ b/src/bin/shared/copyKeycloakResourcesToPublic.ts @@ -21,7 +21,7 @@ export function copyKeycloakResourcesToPublic(params: { const destDirPath = pathJoin( buildContext.publicDirPath, - WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY + WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES ); const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo"); @@ -57,6 +57,10 @@ export function copyKeycloakResourcesToPublic(params: { force: true, recursive: true }); + rmSync(pathJoin(pathDirname(destDirPath), ".keycloakify"), { + force: true, + recursive: true + }); fs.mkdirSync(destDirPath, { recursive: true }); @@ -67,7 +71,7 @@ export function copyKeycloakResourcesToPublic(params: { getThisCodebaseRootDirPath(), "res", "public", - WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY + WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES ), destDirPath }); diff --git a/src/bin/start-keycloak/start-keycloak.ts b/src/bin/start-keycloak/start-keycloak.ts index 736ce0f5..c85b09dc 100644 --- a/src/bin/start-keycloak/start-keycloak.ts +++ b/src/bin/start-keycloak/start-keycloak.ts @@ -37,15 +37,17 @@ export type CliCommandOptions = CliCommandOptions_common & { export async function command(params: { cliCommandOptions: CliCommandOptions }) { exit_if_docker_not_installed: { - let commandOutput: Buffer | undefined = undefined; + let commandOutput: string | undefined = undefined; try { - commandOutput = child_process.execSync("docker --version", { - stdio: ["ignore", "pipe", "ignore"] - }); + commandOutput = child_process + .execSync("docker --version", { + stdio: ["ignore", "pipe", "ignore"] + }) + ?.toString("utf8"); } catch {} - if (commandOutput?.toString("utf8").includes("Docker")) { + if (commandOutput?.includes("Docker") || commandOutput?.includes("podman")) { break exit_if_docker_not_installed; } diff --git a/src/login/KcContext/kcContextMocks.ts b/src/login/KcContext/kcContextMocks.ts index 37bd2456..5552254b 100644 --- a/src/login/KcContext/kcContextMocks.ts +++ b/src/login/KcContext/kcContextMocks.ts @@ -76,7 +76,7 @@ const attributesByName = Object.fromEntries( ]).map(attribute => [attribute.name, attribute]) ); -const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY}/login`; +const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES}/login`; export const kcContextCommonMock: KcContext.Common = { themeVersion: "0.0.0", diff --git a/src/login/Template.useInitialize.ts b/src/login/Template.useInitialize.ts index 5f2bacd1..2ab120a5 100644 --- a/src/login/Template.useInitialize.ts +++ b/src/login/Template.useInitialize.ts @@ -40,14 +40,7 @@ export function useInitialize(params: { const { insertScriptTags } = useInsertScriptTags({ componentOrHookName: "Template", scriptTags: [ - { - type: "importmap", - textContent: JSON.stringify({ - imports: { - rfc4648: `${url.resourcesCommonPath}/node_modules/rfc4648/lib/rfc4648.js` - } - }) - }, + // NOTE: The importmap is added in by the FTL script because it's too late to add it here. { type: "module", src: `${url.resourcesPath}/js/menu-button-links.js` diff --git a/src/tools/useInsertScriptTags.ts b/src/tools/useInsertScriptTags.ts index 5cc47752..0865ba55 100644 --- a/src/tools/useInsertScriptTags.ts +++ b/src/tools/useInsertScriptTags.ts @@ -6,7 +6,7 @@ export type ScriptTag = ScriptTag.TextContent | ScriptTag.Src; export namespace ScriptTag { type Common = { - type: "text/javascript" | "module" | "importmap"; + type: "text/javascript" | "module"; }; export type TextContent = Common & { diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index d773be8b..1ccfaf89 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -201,7 +201,10 @@ export function keycloakify(params: keycloakify.Params) { assert(buildDirPath !== undefined); await rm( - pathJoin(buildDirPath, WELL_KNOWN_DIRECTORY_BASE_NAME.DOT_KEYCLOAKIFY), + pathJoin( + buildDirPath, + WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES + ), { recursive: true, force: true