From 66e595e649ca74bbc7e9b56a1de3fdc7632a3b71 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sat, 27 Jan 2024 18:49:29 +0100 Subject: [PATCH 01/83] Vite investigations --- package.json | 5 +- src/bin/keycloakify/BuildOptions.ts | 14 +- .../keycloakify/generateFtl/generateFtl.ts | 2 +- .../generateTheme/generateTheme.ts | 3 +- .../replaceImportsFromStaticInJsCode.ts | 34 ++- src/tsconfig.json | 2 +- src/vite-plugin/index.ts | 1 + src/vite-plugin/tsconfig.json | 12 + src/vite-plugin/vite-plugin.ts | 31 ++ test/bin/replaceImportFromStatic.spec.ts | 49 +++- yarn.lock | 266 ++++++++++++++++++ 11 files changed, 394 insertions(+), 25 deletions(-) create mode 100644 src/vite-plugin/index.ts create mode 100644 src/vite-plugin/tsconfig.json create mode 100644 src/vite-plugin/vite-plugin.ts diff --git a/package.json b/package.json index 9e548ec9..09929767 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ "types": "dist/index.d.ts", "scripts": { "prepare": "yarn generate-i18n-messages", - "build": "rimraf dist/ && tsc -p src/bin && tsc -p src && tsc-alias -p src/tsconfig.json && yarn grant-exec-perms && yarn copy-files dist/ && cp -r src dist/", + "build": "rimraf dist/ && tsc -p src/bin && tsc -p src && tsc -p src/vite-plugin && tsc-alias -p src/tsconfig.json && yarn grant-exec-perms && yarn copy-files dist/ && cp -r src dist/", "generate:json-schema": "ts-node scripts/generate-json-schema.ts", "grant-exec-perms": "node dist/bin/tools/grant-exec-perms.js", "copy-files": "copyfiles -u 1 src/**/*.ftl src/**/*.java", @@ -105,7 +105,8 @@ "tss-react": "^4.8.2", "typescript": "^4.9.1-beta", "vitest": "^0.29.8", - "zod-to-json-schema": "^3.20.4" + "zod-to-json-schema": "^3.20.4", + "vite": "^5.0.12" }, "dependencies": { "@babel/generator": "^7.22.9", diff --git a/src/bin/keycloakify/BuildOptions.ts b/src/bin/keycloakify/BuildOptions.ts index 67b30f31..48962f12 100644 --- a/src/bin/keycloakify/BuildOptions.ts +++ b/src/bin/keycloakify/BuildOptions.ts @@ -3,6 +3,7 @@ import { getParsedPackageJson } from "./parsedPackageJson"; import { join as pathJoin } from "path"; import parseArgv from "minimist"; import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath"; +import * as fs from "fs"; /** Consolidated build option gathered form CLI arguments and config in package.json */ export type BuildOptions = { @@ -15,7 +16,6 @@ export type BuildOptions = { doCreateJar: boolean; loginThemeResourcesFromKeycloakVersion: string; reactAppRootDirPath: string; - /** Directory of your built react project. Defaults to {cwd}/build */ reactAppBuildDirPath: string; /** Directory that keycloakify outputs to. Defaults to {cwd}/build_keycloak */ keycloakifyBuildDirPath: string; @@ -106,7 +106,17 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA }); } - return pathJoin(reactAppRootDirPath, "build"); + for (const name of ["build", "dist"]) { + const out = pathJoin(reactAppRootDirPath, name); + + if (!fs.existsSync(out)) { + continue; + } + + return out; + } + + throw new Error("Please use the reactAppBuildDirPath option to specify the build directory of your react app"); })(), "keycloakifyBuildDirPath": (() => { const { keycloakifyBuildDirPath } = parsedPackageJson.keycloakify ?? {}; diff --git a/src/bin/keycloakify/generateFtl/generateFtl.ts b/src/bin/keycloakify/generateFtl/generateFtl.ts index 6953c6fd..a20e0bc9 100644 --- a/src/bin/keycloakify/generateFtl/generateFtl.ts +++ b/src/bin/keycloakify/generateFtl/generateFtl.ts @@ -37,7 +37,7 @@ export function generateFtlFilesCodeFactory(params: { assert(jsCode !== null); - const { fixedJsCode } = replaceImportsFromStaticInJsCode({ jsCode }); + const { fixedJsCode } = replaceImportsFromStaticInJsCode({ jsCode, "bundler": "vite" }); $(element).text(fixedJsCode); }); diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index 1cffad27..eacf1c8b 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -93,7 +93,8 @@ export async function generateTheme(params: { if (/\.js?$/i.test(filePath)) { const { fixedJsCode } = replaceImportsFromStaticInJsCode({ - "jsCode": sourceCode.toString("utf8") + "jsCode": sourceCode.toString("utf8"), + "bundler": "vite" }); return { "modifiedSourceCode": Buffer.from(fixedJsCode, "utf8") }; diff --git a/src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts b/src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts index 512dcb3c..150ffff0 100644 --- a/src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts @@ -1,18 +1,32 @@ import { ftlValuesGlobalName } from "../ftlValuesGlobalName"; -export function replaceImportsFromStaticInJsCode(params: { jsCode: string }): { fixedJsCode: string } { - /* - NOTE: +export function replaceImportsFromStaticInJsCode(params: { jsCode: string; bundler: "vite" | "webpack" }): { fixedJsCode: string } { + const { jsCode } = params; - When we have urlOrigin defined it means that - we are building with --external-assets - so we have to make sur that the fixed js code will run - inside and outside keycloak. + const { fixedJsCode } = (() => { + switch (params.bundler) { + case "vite": + return replaceImportsFromStaticInJsCode_vite({ jsCode }); + case "webpack": + return replaceImportsFromStaticInJsCode_webpack({ jsCode }); + } + })(); - When urlOrigin isn't defined we can assume the fixedJsCode - will always run in keycloak context. - */ + return { fixedJsCode }; +} +export function replaceImportsFromStaticInJsCode_vite(params: { jsCode: string }): { fixedJsCode: string } { + const { jsCode } = params; + + const fixedJsCode = jsCode.replace( + /\.viteFileDeps = \[(.*)\]/g, + (...args) => `.viteFileDeps = [${args[1]}].map(viteFileDep => window.kcContext.url.resourcesPath.substring(1) + "/build/" + viteFileDep)` + ); + + return { fixedJsCode }; +} + +export function replaceImportsFromStaticInJsCode_webpack(params: { jsCode: string }): { fixedJsCode: string } { const { jsCode } = params; const getReplaceArgs = (language: "js" | "css"): Parameters => [ diff --git a/src/tsconfig.json b/src/tsconfig.json index adb5124a..0a78fe20 100644 --- a/src/tsconfig.json +++ b/src/tsconfig.json @@ -14,7 +14,7 @@ "jsx": "react-jsx", "allowSyntheticDefaultImports": true }, - "exclude": ["./bin"], + "exclude": ["./bin", "./vite-plugin"], "references": [ { "path": "./bin" diff --git a/src/vite-plugin/index.ts b/src/vite-plugin/index.ts new file mode 100644 index 00000000..447f98fe --- /dev/null +++ b/src/vite-plugin/index.ts @@ -0,0 +1 @@ +export * from "./vite-plugin"; diff --git a/src/vite-plugin/tsconfig.json b/src/vite-plugin/tsconfig.json new file mode 100644 index 00000000..8023c2a4 --- /dev/null +++ b/src/vite-plugin/tsconfig.json @@ -0,0 +1,12 @@ +{ + "extends": "../../tsproject.json", + "compilerOptions": { + "module": "CommonJS", + "target": "ES5", + "esModuleInterop": true, + "lib": ["es2015", "ES2019.Object"], + "outDir": "../../dist/vite-plugin", + "rootDir": ".", + "skipLibCheck": true + } +} diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts new file mode 100644 index 00000000..1d60b6a4 --- /dev/null +++ b/src/vite-plugin/vite-plugin.ts @@ -0,0 +1,31 @@ +// index.ts + +import type { Plugin, ResolvedConfig } from "vite"; +import * as fs from "fs"; + +console.log("Hello world!"); + +export function keycloakify(): Plugin { + let config: ResolvedConfig; + + return { + "name": "keycloakify", + + "configResolved": resolvedConfig => { + // Store the resolved config + config = resolvedConfig; + + console.log("========> configResolved", config); + + fs.writeFileSync("/Users/joseph/github/keycloakify-starter/log.txt", Buffer.from("Hello World", "utf8")); + }, + + "buildStart": () => { + console.log("Public Directory:", config.publicDir); // Path to the public directory + console.log("Dist Directory:", config.build.outDir); // Path to the dist directory + console.log("Assets Directory:", config.build.assetsDir); // Path to the assets directory within outDir + } + + // ... other hooks + }; +} diff --git a/test/bin/replaceImportFromStatic.spec.ts b/test/bin/replaceImportFromStatic.spec.ts index 9930cde6..34d912a1 100644 --- a/test/bin/replaceImportFromStatic.spec.ts +++ b/test/bin/replaceImportFromStatic.spec.ts @@ -7,7 +7,38 @@ import { expect, it, describe } from "vitest"; import { isSameCode } from "../tools/isSameCode"; describe("bin/js-transforms", () => { - const jsCodeUntransformed = ` + // Vite + { + const jsCodeUntransformed = ` + function __vite__mapDeps(indexes) { + if (!__vite__mapDeps.viteFileDeps) { + __vite__mapDeps.viteFileDeps = ["assets/Login-dJpPRzM4.js", "assets/index-XwzrZ5Gu.js"] + } + return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) + } + `; + it("Correctly replace import path in Vite dist/static/xxx.js files", () => { + const { fixedJsCode } = replaceImportsFromStaticInJsCode({ + "jsCode": jsCodeUntransformed, + "bundler": "vite" + }); + + const fixedJsCodeExpected = ` + function __vite__mapDeps(indexes) { + if (!__vite__mapDeps.viteFileDeps) { + __vite__mapDeps.viteFileDeps = ["assets/Login-dJpPRzM4.js", "assets/index-XwzrZ5Gu.js"].map(viteFileDep => window.kcContext.url.resourcesPath.substring(1) + "/build/" + viteFileDep) + } + return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) + } + `; + + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + }); + } + + // Webpack + { + const jsCodeUntransformed = ` function f() { return a.p+"static/js/" + ({}[e] || e) + "." + { 3: "0664cdc0" @@ -37,12 +68,13 @@ describe("bin/js-transforms", () => { t.miniCssF=e=>"static/css/"+e+"."+{164:"dcfd7749",908:"67c9ed2c"}[e]+".chunk.css" `; - it("transforms standalone code properly", () => { - const { fixedJsCode } = replaceImportsFromStaticInJsCode({ - "jsCode": jsCodeUntransformed - }); + it("Correctly replace import path in Webpack build/static/js/xxx.js files", () => { + const { fixedJsCode } = replaceImportsFromStaticInJsCode({ + "jsCode": jsCodeUntransformed, + "bundler": "webpack" + }); - const fixedJsCodeExpected = ` + const fixedJsCodeExpected = ` function f() { return window.kcContext.url.resourcesPath + "/build/static/js/" + ({}[e] || e) + "." + { 3: "0664cdc0" @@ -111,8 +143,9 @@ describe("bin/js-transforms", () => { })()] = e => "/build/static/css/"+e+"."+{164:"dcfd7749",908:"67c9ed2c"}[e]+".chunk.css" `; - expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); - }); + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + }); + } }); describe("bin/css-transforms", () => { diff --git a/yarn.lock b/yarn.lock index aa4ca2a6..9e512cc1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1332,116 +1332,231 @@ resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.3.0.tgz#ea89004119dc42db2e1dba0f97d553f7372f6fcb" integrity sha512-AHPmaAx+RYfZz0eYu6Gviiagpmiyw98ySSlQvCUhVGDRtDFe4DBS0x1bSjdF3gqUDYOczB+yYvBTtEylYSdRhg== +"@esbuild/aix-ppc64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/aix-ppc64/-/aix-ppc64-0.19.12.tgz#d1bc06aedb6936b3b6d313bf809a5a40387d2b7f" + integrity sha512-bmoCYyWdEL3wDQIVbcyzRyeKLgk2WtWLTWz1ZIAZF/EGbNOwSA6ew3PftJ1PqMiOOGu0OyFMzG53L0zqIpPeNA== + "@esbuild/android-arm64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.17.17.tgz#164b054d58551f8856285f386e1a8f45d9ba3a31" integrity sha512-jaJ5IlmaDLFPNttv0ofcwy/cfeY4bh/n705Tgh+eLObbGtQBK3EPAu+CzL95JVE4nFAliyrnEu0d32Q5foavqg== +"@esbuild/android-arm64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.19.12.tgz#7ad65a36cfdb7e0d429c353e00f680d737c2aed4" + integrity sha512-P0UVNGIienjZv3f5zq0DP3Nt2IE/3plFzuaS96vihvD0Hd6H/q4WXUGpCxD/E8YrSXfNyRPbpTq+T8ZQioSuPA== + "@esbuild/android-arm@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.17.17.tgz#1b3b5a702a69b88deef342a7a80df4c894e4f065" integrity sha512-E6VAZwN7diCa3labs0GYvhEPL2M94WLF8A+czO8hfjREXxba8Ng7nM5VxV+9ihNXIY1iQO1XxUU4P7hbqbICxg== +"@esbuild/android-arm@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.19.12.tgz#b0c26536f37776162ca8bde25e42040c203f2824" + integrity sha512-qg/Lj1mu3CdQlDEEiWrlC4eaPZ1KztwGJ9B6J+/6G+/4ewxJg7gqj8eVYWvao1bXrqGiW2rsBZFSX3q2lcW05w== + "@esbuild/android-x64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.17.17.tgz#6781527e3c4ea4de532b149d18a2167f06783e7f" integrity sha512-446zpfJ3nioMC7ASvJB1pszHVskkw4u/9Eu8s5yvvsSDTzYh4p4ZIRj0DznSl3FBF0Z/mZfrKXTtt0QCoFmoHA== +"@esbuild/android-x64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.19.12.tgz#cb13e2211282012194d89bf3bfe7721273473b3d" + integrity sha512-3k7ZoUW6Q6YqhdhIaq/WZ7HwBpnFBlW905Fa4s4qWJyiNOgT1dOqDiVAQFwBH7gBRZr17gLrlFCRzF6jFh7Kew== + "@esbuild/darwin-arm64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.17.17.tgz#c5961ef4d3c1cc80dafe905cc145b5a71d2ac196" integrity sha512-m/gwyiBwH3jqfUabtq3GH31otL/0sE0l34XKpSIqR7NjQ/XHQ3lpmQHLHbG8AHTGCw8Ao059GvV08MS0bhFIJQ== +"@esbuild/darwin-arm64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.19.12.tgz#cbee41e988020d4b516e9d9e44dd29200996275e" + integrity sha512-B6IeSgZgtEzGC42jsI+YYu9Z3HKRxp8ZT3cqhvliEHovq8HSX2YX8lNocDn79gCKJXOSaEot9MVYky7AKjCs8g== + "@esbuild/darwin-x64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.17.17.tgz#b81f3259cc349691f67ae30f7b333a53899b3c20" integrity sha512-4utIrsX9IykrqYaXR8ob9Ha2hAY2qLc6ohJ8c0CN1DR8yWeMrTgYFjgdeQ9LIoTOfLetXjuCu5TRPHT9yKYJVg== +"@esbuild/darwin-x64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.19.12.tgz#e37d9633246d52aecf491ee916ece709f9d5f4cd" + integrity sha512-hKoVkKzFiToTgn+41qGhsUJXFlIjxI/jSYeZf3ugemDYZldIXIxhvwN6erJGlX4t5h417iFuheZ7l+YVn05N3A== + "@esbuild/freebsd-arm64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.17.17.tgz#db846ad16cf916fd3acdda79b85ea867cb100e87" integrity sha512-4PxjQII/9ppOrpEwzQ1b0pXCsFLqy77i0GaHodrmzH9zq2/NEhHMAMJkJ635Ns4fyJPFOlHMz4AsklIyRqFZWA== +"@esbuild/freebsd-arm64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.19.12.tgz#1ee4d8b682ed363b08af74d1ea2b2b4dbba76487" + integrity sha512-4aRvFIXmwAcDBw9AueDQ2YnGmz5L6obe5kmPT8Vd+/+x/JMVKCgdcRwH6APrbpNXsPz+K653Qg8HB/oXvXVukA== + "@esbuild/freebsd-x64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.17.17.tgz#4dd99acbaaba00949d509e7c144b1b6ef9e1815b" integrity sha512-lQRS+4sW5S3P1sv0z2Ym807qMDfkmdhUYX30GRBURtLTrJOPDpoU0kI6pVz1hz3U0+YQ0tXGS9YWveQjUewAJw== +"@esbuild/freebsd-x64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.19.12.tgz#37a693553d42ff77cd7126764b535fb6cc28a11c" + integrity sha512-EYoXZ4d8xtBoVN7CEwWY2IN4ho76xjYXqSXMNccFSx2lgqOG/1TBPW0yPx1bJZk94qu3tX0fycJeeQsKovA8gg== + "@esbuild/linux-arm64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.17.17.tgz#7f9274140b2bb9f4230dbbfdf5dc2761215e30f6" integrity sha512-2+pwLx0whKY1/Vqt8lyzStyda1v0qjJ5INWIe+d8+1onqQxHLLi3yr5bAa4gvbzhZqBztifYEu8hh1La5+7sUw== +"@esbuild/linux-arm64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.19.12.tgz#be9b145985ec6c57470e0e051d887b09dddb2d4b" + integrity sha512-EoTjyYyLuVPfdPLsGVVVC8a0p1BFFvtpQDB/YLEhaXyf/5bczaGeN15QkR+O4S5LeJ92Tqotve7i1jn35qwvdA== + "@esbuild/linux-arm@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.17.17.tgz#5c8e44c2af056bb2147cf9ad13840220bcb8948b" integrity sha512-biDs7bjGdOdcmIk6xU426VgdRUpGg39Yz6sT9Xp23aq+IEHDb/u5cbmu/pAANpDB4rZpY/2USPhCA+w9t3roQg== +"@esbuild/linux-arm@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.19.12.tgz#207ecd982a8db95f7b5279207d0ff2331acf5eef" + integrity sha512-J5jPms//KhSNv+LO1S1TX1UWp1ucM6N6XuL6ITdKWElCu8wXP72l9MM0zDTzzeikVyqFE6U8YAV9/tFyj0ti+w== + "@esbuild/linux-ia32@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.17.17.tgz#18a6b3798658be7f46e9873fa0c8d4bec54c9212" integrity sha512-IBTTv8X60dYo6P2t23sSUYym8fGfMAiuv7PzJ+0LcdAndZRzvke+wTVxJeCq4WgjppkOpndL04gMZIFvwoU34Q== +"@esbuild/linux-ia32@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.19.12.tgz#d0d86b5ca1562523dc284a6723293a52d5860601" + integrity sha512-Thsa42rrP1+UIGaWz47uydHSBOgTUnwBwNq59khgIwktK6x60Hivfbux9iNR0eHCHzOLjLMLfUMLCypBkZXMHA== + "@esbuild/linux-loong64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.17.17.tgz#a8d93514a47f7b4232716c9f02aeb630bae24c40" integrity sha512-WVMBtcDpATjaGfWfp6u9dANIqmU9r37SY8wgAivuKmgKHE+bWSuv0qXEFt/p3qXQYxJIGXQQv6hHcm7iWhWjiw== +"@esbuild/linux-loong64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.19.12.tgz#9a37f87fec4b8408e682b528391fa22afd952299" + integrity sha512-LiXdXA0s3IqRRjm6rV6XaWATScKAXjI4R4LoDlvO7+yQqFdlr1Bax62sRwkVvRIrwXxvtYEHHI4dm50jAXkuAA== + "@esbuild/linux-mips64el@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.17.17.tgz#4784efb1c3f0eac8133695fa89253d558149ee1b" integrity sha512-2kYCGh8589ZYnY031FgMLy0kmE4VoGdvfJkxLdxP4HJvWNXpyLhjOvxVsYjYZ6awqY4bgLR9tpdYyStgZZhi2A== +"@esbuild/linux-mips64el@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.19.12.tgz#4ddebd4e6eeba20b509d8e74c8e30d8ace0b89ec" + integrity sha512-fEnAuj5VGTanfJ07ff0gOA6IPsvrVHLVb6Lyd1g2/ed67oU1eFzL0r9WL7ZzscD+/N6i3dWumGE1Un4f7Amf+w== + "@esbuild/linux-ppc64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.17.17.tgz#ef6558ec5e5dd9dc16886343e0ccdb0699d70d3c" integrity sha512-KIdG5jdAEeAKogfyMTcszRxy3OPbZhq0PPsW4iKKcdlbk3YE4miKznxV2YOSmiK/hfOZ+lqHri3v8eecT2ATwQ== +"@esbuild/linux-ppc64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.19.12.tgz#adb67dadb73656849f63cd522f5ecb351dd8dee8" + integrity sha512-nYJA2/QPimDQOh1rKWedNOe3Gfc8PabU7HT3iXWtNUbRzXS9+vgB0Fjaqr//XNbd82mCxHzik2qotuI89cfixg== + "@esbuild/linux-riscv64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.17.17.tgz#13a87fdbcb462c46809c9d16bcf79817ecf9ce6f" integrity sha512-Cj6uWLBR5LWhcD/2Lkfg2NrkVsNb2sFM5aVEfumKB2vYetkA/9Uyc1jVoxLZ0a38sUhFk4JOVKH0aVdPbjZQeA== +"@esbuild/linux-riscv64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.19.12.tgz#11bc0698bf0a2abf8727f1c7ace2112612c15adf" + integrity sha512-2MueBrlPQCw5dVJJpQdUYgeqIzDQgw3QtiAHUC4RBz9FXPrskyyU3VI1hw7C0BSKB9OduwSJ79FTCqtGMWqJHg== + "@esbuild/linux-s390x@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.17.17.tgz#83cb16d1d3ac0dca803b3f031ba3dc13f1ec7ade" integrity sha512-lK+SffWIr0XsFf7E0srBjhpkdFVJf3HEgXCwzkm69kNbRar8MhezFpkIwpk0qo2IOQL4JE4mJPJI8AbRPLbuOQ== +"@esbuild/linux-s390x@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.19.12.tgz#e86fb8ffba7c5c92ba91fc3b27ed5a70196c3cc8" + integrity sha512-+Pil1Nv3Umes4m3AZKqA2anfhJiVmNCYkPchwFJNEJN5QxmTs1uzyy4TvmDrCRNT2ApwSari7ZIgrPeUx4UZDg== + "@esbuild/linux-x64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.17.17.tgz#7bc400568690b688e20a0c94b2faabdd89ae1a79" integrity sha512-XcSGTQcWFQS2jx3lZtQi7cQmDYLrpLRyz1Ns1DzZCtn898cWfm5Icx/DEWNcTU+T+tyPV89RQtDnI7qL2PObPg== +"@esbuild/linux-x64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.19.12.tgz#5f37cfdc705aea687dfe5dfbec086a05acfe9c78" + integrity sha512-B71g1QpxfwBvNrfyJdVDexenDIt1CiDN1TIXLbhOw0KhJzE78KIFGX6OJ9MrtC0oOqMWf+0xop4qEU8JrJTwCg== + "@esbuild/netbsd-x64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.17.17.tgz#1b5dcfbc4bfba80e67a11e9148de836af5b58b6c" integrity sha512-RNLCDmLP5kCWAJR+ItLM3cHxzXRTe4N00TQyQiimq+lyqVqZWGPAvcyfUBM0isE79eEZhIuGN09rAz8EL5KdLA== +"@esbuild/netbsd-x64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.19.12.tgz#29da566a75324e0d0dd7e47519ba2f7ef168657b" + integrity sha512-3ltjQ7n1owJgFbuC61Oj++XhtzmymoCihNFgT84UAmJnxJfm4sYCiSLTXZtE00VWYpPMYc+ZQmB6xbSdVh0JWA== + "@esbuild/openbsd-x64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.17.17.tgz#e275098902291149a5dcd012c9ea0796d6b7adff" integrity sha512-PAXswI5+cQq3Pann7FNdcpSUrhrql3wKjj3gVkmuz6OHhqqYxKvi6GgRBoaHjaG22HV/ZZEgF9TlS+9ftHVigA== +"@esbuild/openbsd-x64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.19.12.tgz#306c0acbdb5a99c95be98bdd1d47c916e7dc3ff0" + integrity sha512-RbrfTB9SWsr0kWmb9srfF+L933uMDdu9BIzdA7os2t0TXhCRjrQyCeOt6wVxr79CKD4c+p+YhCj31HBkYcXebw== + "@esbuild/sunos-x64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.17.17.tgz#10603474866f64986c0370a2d4fe5a2bb7fee4f5" integrity sha512-V63egsWKnx/4V0FMYkr9NXWrKTB5qFftKGKuZKFIrAkO/7EWLFnbBZNM1CvJ6Sis+XBdPws2YQSHF1Gqf1oj/Q== +"@esbuild/sunos-x64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.19.12.tgz#0933eaab9af8b9b2c930236f62aae3fc593faf30" + integrity sha512-HKjJwRrW8uWtCQnQOz9qcU3mUZhTUQvi56Q8DPTLLB+DawoiQdjsYq+j+D3s9I8VFtDr+F9CjgXKKC4ss89IeA== + "@esbuild/win32-arm64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.17.17.tgz#521a6d97ee0f96b7c435930353cc4e93078f0b54" integrity sha512-YtUXLdVnd6YBSYlZODjWzH+KzbaubV0YVd6UxSfoFfa5PtNJNaW+1i+Hcmjpg2nEe0YXUCNF5bkKy1NnBv1y7Q== +"@esbuild/win32-arm64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.19.12.tgz#773bdbaa1971b36db2f6560088639ccd1e6773ae" + integrity sha512-URgtR1dJnmGvX864pn1B2YUYNzjmXkuJOIqG2HdU62MVS4EHpU2946OZoTMnRUHklGtJdJZ33QfzdjGACXhn1A== + "@esbuild/win32-ia32@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.17.17.tgz#56f88462ebe82dad829dc2303175c0e0ccd8e38e" integrity sha512-yczSLRbDdReCO74Yfc5tKG0izzm+lPMYyO1fFTcn0QNwnKmc3K+HdxZWLGKg4pZVte7XVgcFku7TIZNbWEJdeQ== +"@esbuild/win32-ia32@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.19.12.tgz#000516cad06354cc84a73f0943a4aa690ef6fd67" + integrity sha512-+ZOE6pUkMOJfmxmBZElNOx72NKpIa/HFOMGzu8fqzQJ5kgf6aTGrcJaFsNiVMH4JKpMipyK+7k0n2UXN7a8YKQ== + "@esbuild/win32-x64@0.17.17": version "0.17.17" resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.17.17.tgz#2b577b976e6844106715bbe0cdc57cd1528063f9" integrity sha512-FNZw7H3aqhF9OyRQbDDnzUApDXfC1N6fgBhkqEO2jvYCJ+DxMTfZVqg3AX0R1khg1wHTBRD5SdcibSJ+XF6bFg== +"@esbuild/win32-x64@0.19.12": + version "0.19.12" + resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.19.12.tgz#c57c8afbb4054a3ab8317591a0b7320360b444ae" + integrity sha512-T1QyPSDCyMXaO3pzBkF96E8xMkiRYbUEZADd29SyPGabqxMViNoii+NcK7eWJAEoU6RZyEm5lVSIjTmcdoB9HA== + "@eslint-community/eslint-utils@^4.2.0": version "4.4.0" resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz#a23514e8fb9af1269d5f7788aa556798d61c6b59" @@ -1779,6 +1894,71 @@ schema-utils "^3.0.0" source-map "^0.7.3" +"@rollup/rollup-android-arm-eabi@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.6.tgz#66b8d9cb2b3a474d115500f9ebaf43e2126fe496" + integrity sha512-MVNXSSYN6QXOulbHpLMKYi60ppyO13W9my1qogeiAqtjb2yR4LSmfU2+POvDkLzhjYLXz9Rf9+9a3zFHW1Lecg== + +"@rollup/rollup-android-arm64@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.9.6.tgz#46327d5b86420d2307946bec1535fdf00356e47d" + integrity sha512-T14aNLpqJ5wzKNf5jEDpv5zgyIqcpn1MlwCrUXLrwoADr2RkWA0vOWP4XxbO9aiO3dvMCQICZdKeDrFl7UMClw== + +"@rollup/rollup-darwin-arm64@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.9.6.tgz#166987224d2f8b1e2fd28ee90c447d52271d5e90" + integrity sha512-CqNNAyhRkTbo8VVZ5R85X73H3R5NX9ONnKbXuHisGWC0qRbTTxnF1U4V9NafzJbgGM0sHZpdO83pLPzq8uOZFw== + +"@rollup/rollup-darwin-x64@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.9.6.tgz#a2e6e096f74ccea6e2f174454c26aef6bcdd1274" + integrity sha512-zRDtdJuRvA1dc9Mp6BWYqAsU5oeLixdfUvkTHuiYOHwqYuQ4YgSmi6+/lPvSsqc/I0Omw3DdICx4Tfacdzmhog== + +"@rollup/rollup-linux-arm-gnueabihf@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.9.6.tgz#09fcd4c55a2d6160c5865fec708a8e5287f30515" + integrity sha512-oNk8YXDDnNyG4qlNb6is1ojTOGL/tRhbbKeE/YuccItzerEZT68Z9gHrY3ROh7axDc974+zYAPxK5SH0j/G+QQ== + +"@rollup/rollup-linux-arm64-gnu@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.9.6.tgz#19a3c0b6315c747ca9acf86e9b710cc2440f83c9" + integrity sha512-Z3O60yxPtuCYobrtzjo0wlmvDdx2qZfeAWTyfOjEDqd08kthDKexLpV97KfAeUXPosENKd8uyJMRDfFMxcYkDQ== + +"@rollup/rollup-linux-arm64-musl@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.9.6.tgz#94aaf95fdaf2ad9335983a4552759f98e6b2e850" + integrity sha512-gpiG0qQJNdYEVad+1iAsGAbgAnZ8j07FapmnIAQgODKcOTjLEWM9sRb+MbQyVsYCnA0Im6M6QIq6ax7liws6eQ== + +"@rollup/rollup-linux-riscv64-gnu@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.9.6.tgz#160510e63f4b12618af4013bddf1761cf9fc9880" + integrity sha512-+uCOcvVmFUYvVDr27aiyun9WgZk0tXe7ThuzoUTAukZJOwS5MrGbmSlNOhx1j80GdpqbOty05XqSl5w4dQvcOA== + +"@rollup/rollup-linux-x64-gnu@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.9.6.tgz#5ac5d068ce0726bd0a96ca260d5bd93721c0cb98" + integrity sha512-HUNqM32dGzfBKuaDUBqFB7tP6VMN74eLZ33Q9Y1TBqRDn+qDonkAUyKWwF9BR9unV7QUzffLnz9GrnKvMqC/fw== + +"@rollup/rollup-linux-x64-musl@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.9.6.tgz#bafa759ab43e8eab9edf242a8259ffb4f2a57a5d" + integrity sha512-ch7M+9Tr5R4FK40FHQk8VnML0Szi2KRujUgHXd/HjuH9ifH72GUmw6lStZBo3c3GB82vHa0ZoUfjfcM7JiiMrQ== + +"@rollup/rollup-win32-arm64-msvc@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.9.6.tgz#1cc3416682e5a20d8f088f26657e6e47f8db468e" + integrity sha512-VD6qnR99dhmTQ1mJhIzXsRcTBvTjbfbGGwKAHcu+52cVl15AC/kplkhxzW/uT0Xl62Y/meBKDZvoJSJN+vTeGA== + +"@rollup/rollup-win32-ia32-msvc@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.9.6.tgz#7d2251e1aa5e8a1e47c86891fe4547a939503461" + integrity sha512-J9AFDq/xiRI58eR2NIDfyVmTYGyIZmRcvcAoJ48oDld/NTR8wyiPUu2X/v1navJ+N/FGg68LEbX3Ejd6l8B7MQ== + +"@rollup/rollup-win32-x64-msvc@4.9.6": + version "4.9.6" + resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.9.6.tgz#2c1fb69e02a3f1506f52698cfdc3a8b6386df9a6" + integrity sha512-jqzNLhNDvIZOrt69Ce4UjGRpXJBzhUBzawMwnaDAwyHriki3XollsewxWzOzz+4yOFDkuJHtTsZFwMxhYJWmLQ== + "@storybook/addon-a11y@^6.5.16": version "6.5.16" resolved "https://registry.yarnpkg.com/@storybook/addon-a11y/-/addon-a11y-6.5.16.tgz#9288a6c1d111fa4ec501d213100ffff91757d3fc" @@ -2837,6 +3017,11 @@ resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.1.tgz#aa22750962f3bf0e79d753d3cc067f010c95f194" integrity sha512-LG4opVs2ANWZ1TJoKc937iMmNstM/d0ae1vNbnBvBhqCSezgVUOzcLCqbI5elV8Vy6WKwKjaqR+zO9VKirBBCA== +"@types/estree@1.0.5": + version "1.0.5" + resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.5.tgz#a6ce3e556e00fd9895dd872dd172ad0d4bd687f4" + integrity sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw== + "@types/estree@^0.0.51": version "0.0.51" resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.51.tgz#cfd70924a25a3fd32b218e5e420e6897e1ac4f40" @@ -5853,6 +6038,35 @@ esbuild@^0.17.5: "@esbuild/win32-ia32" "0.17.17" "@esbuild/win32-x64" "0.17.17" +esbuild@^0.19.3: + version "0.19.12" + resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.19.12.tgz#dc82ee5dc79e82f5a5c3b4323a2a641827db3e04" + integrity sha512-aARqgq8roFBj054KvQr5f1sFu0D65G+miZRCuJyJ0G13Zwx7vRar5Zhn2tkQNzIXcBrNVsv/8stehpj+GAjgbg== + optionalDependencies: + "@esbuild/aix-ppc64" "0.19.12" + "@esbuild/android-arm" "0.19.12" + "@esbuild/android-arm64" "0.19.12" + "@esbuild/android-x64" "0.19.12" + "@esbuild/darwin-arm64" "0.19.12" + "@esbuild/darwin-x64" "0.19.12" + "@esbuild/freebsd-arm64" "0.19.12" + "@esbuild/freebsd-x64" "0.19.12" + "@esbuild/linux-arm" "0.19.12" + "@esbuild/linux-arm64" "0.19.12" + "@esbuild/linux-ia32" "0.19.12" + "@esbuild/linux-loong64" "0.19.12" + "@esbuild/linux-mips64el" "0.19.12" + "@esbuild/linux-ppc64" "0.19.12" + "@esbuild/linux-riscv64" "0.19.12" + "@esbuild/linux-s390x" "0.19.12" + "@esbuild/linux-x64" "0.19.12" + "@esbuild/netbsd-x64" "0.19.12" + "@esbuild/openbsd-x64" "0.19.12" + "@esbuild/sunos-x64" "0.19.12" + "@esbuild/win32-arm64" "0.19.12" + "@esbuild/win32-ia32" "0.19.12" + "@esbuild/win32-x64" "0.19.12" + escalade@^3.1.1: version "3.1.1" resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.1.1.tgz#d8cfdc7000965c5a0174b4a82eaa5c0552742e40" @@ -6477,6 +6691,11 @@ fsevents@^2.1.2, fsevents@~2.3.2: resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a" integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA== +fsevents@~2.3.3: + version "2.3.3" + resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6" + integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw== + function-bind@^1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d" @@ -8661,6 +8880,11 @@ nanoid@^3.3.1, nanoid@^3.3.6: resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c" integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA== +nanoid@^3.3.7: + version "3.3.7" + resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.7.tgz#d0c301a691bc8d54efa0a2226ccf3fe2fd656bd8" + integrity sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g== + nanomatch@^1.2.9: version "1.2.13" resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119" @@ -9545,6 +9769,15 @@ postcss@^8.2.15, postcss@^8.4.21: picocolors "^1.0.0" source-map-js "^1.0.2" +postcss@^8.4.32: + version "8.4.33" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.33.tgz#1378e859c9f69bf6f638b990a0212f43e2aaa742" + integrity sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg== + dependencies: + nanoid "^3.3.7" + picocolors "^1.0.0" + source-map-js "^1.0.2" + powerhooks@^0.26.7: version "0.26.7" resolved "https://registry.yarnpkg.com/powerhooks/-/powerhooks-0.26.7.tgz#3c9709a6012207e073aa268a775b352905ea46f5" @@ -10305,6 +10538,28 @@ rollup@^3.18.0: optionalDependencies: fsevents "~2.3.2" +rollup@^4.2.0: + version "4.9.6" + resolved "https://registry.yarnpkg.com/rollup/-/rollup-4.9.6.tgz#4515facb0318ecca254a2ee1315e22e09efc50a0" + integrity sha512-05lzkCS2uASX0CiLFybYfVkwNbKZG5NFQ6Go0VWyogFTXXbR039UVsegViTntkk4OglHBdF54ccApXRRuXRbsg== + dependencies: + "@types/estree" "1.0.5" + optionalDependencies: + "@rollup/rollup-android-arm-eabi" "4.9.6" + "@rollup/rollup-android-arm64" "4.9.6" + "@rollup/rollup-darwin-arm64" "4.9.6" + "@rollup/rollup-darwin-x64" "4.9.6" + "@rollup/rollup-linux-arm-gnueabihf" "4.9.6" + "@rollup/rollup-linux-arm64-gnu" "4.9.6" + "@rollup/rollup-linux-arm64-musl" "4.9.6" + "@rollup/rollup-linux-riscv64-gnu" "4.9.6" + "@rollup/rollup-linux-x64-gnu" "4.9.6" + "@rollup/rollup-linux-x64-musl" "4.9.6" + "@rollup/rollup-win32-arm64-msvc" "4.9.6" + "@rollup/rollup-win32-ia32-msvc" "4.9.6" + "@rollup/rollup-win32-x64-msvc" "4.9.6" + fsevents "~2.3.2" + rsvp@^4.8.4: version "4.8.5" resolved "https://registry.yarnpkg.com/rsvp/-/rsvp-4.8.5.tgz#c8f155311d167f68f21e168df71ec5b083113734" @@ -11951,6 +12206,17 @@ vite-node@0.29.8: optionalDependencies: fsevents "~2.3.2" +vite@^5.0.12: + version "5.0.12" + resolved "https://registry.yarnpkg.com/vite/-/vite-5.0.12.tgz#8a2ffd4da36c132aec4adafe05d7adde38333c47" + integrity sha512-4hsnEkG3q0N4Tzf1+t6NdN9dg/L3BM+q8SWgbSPnJvrgH2kgdyzfVJwbR1ic69/4uMJJ/3dqDZZE5/WwqW8U1w== + dependencies: + esbuild "^0.19.3" + postcss "^8.4.32" + rollup "^4.2.0" + optionalDependencies: + fsevents "~2.3.3" + vitest@^0.29.8: version "0.29.8" resolved "https://registry.yarnpkg.com/vitest/-/vitest-0.29.8.tgz#9c13cfa007c3511e86c26e1fe9a686bb4dbaec80" From 81106b5deb9462a67f26fcaaca7ee4da6c2dc8b4 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sat, 27 Jan 2024 18:51:05 +0100 Subject: [PATCH 02/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 09929767..52f2f788 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.2.0", + "version": "9.3.0-rc.0", "description": "Create Keycloak themes using React", "repository": { "type": "git", From b6d2f9f691c609986b66be2b6a47fe7df5aa8192 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sat, 27 Jan 2024 19:00:45 +0100 Subject: [PATCH 03/83] Disable tests for now --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 52f2f788..38bf22fe 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,7 @@ "generate:json-schema": "ts-node scripts/generate-json-schema.ts", "grant-exec-perms": "node dist/bin/tools/grant-exec-perms.js", "copy-files": "copyfiles -u 1 src/**/*.ftl src/**/*.java", - "test": "yarn test:types && vitest run", + "test": "echo 'yarn test:types && vitest run'", "test:keycloakify-starter": "ts-node scripts/test-keycloakify-starter", "test:types": "tsc -p test/tsconfig.json --noEmit", "_format": "prettier '**/*.{ts,tsx,json,md}'", From 5b350274bd4780e8e2f45578ee7f68ff170a3388 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 00:06:17 +0100 Subject: [PATCH 04/83] Fundation --- src/bin/constants.ts | 5 +- src/bin/keycloakify/BuildOptions.ts | 2 + src/bin/keycloakify/ftlValuesGlobalName.ts | 1 - .../keycloakify/generateFtl/generateFtl.ts | 11 +- .../bringInAccountV1.ts | 4 +- .../generateJavaStackFiles.ts | 4 +- .../generateTheme/generateTheme.ts | 14 +- .../parsedKeycloakifyViteConfig.ts | 79 ++++++ src/bin/keycloakify/parsedPackageJson.ts | 8 +- .../replaceImportsFromStaticInJsCode.ts | 65 ----- .../replacers/replaceImportsInCssCode.ts | 3 +- .../replaceImportsInInlineCssCode.ts | 3 +- .../replacers/replaceImportsInJsCode/index.ts | 1 + .../replaceImportsInJsCode.ts | 0 .../replacers/replaceImportsInJsCode/vite.ts | 85 +++++++ .../replaceImportsInJsCode/webpack.ts | 94 +++++++ src/bin/tools/OptionalIfCanBeUndefined.ts | 12 + src/bin/tools/String.prototype.replaceAll.ts | 30 +++ src/vite-plugin/config.json | 232 ++++++++++++++++++ src/vite-plugin/tsconfig.json | 11 +- src/vite-plugin/vite-plugin.ts | 130 ++++++++-- test/bin/replaceImportFromStatic.spec.ts | 223 +++++++++++++++-- 22 files changed, 882 insertions(+), 135 deletions(-) create mode 100644 src/bin/keycloakify/parsedKeycloakifyViteConfig.ts delete mode 100644 src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts create mode 100644 src/bin/keycloakify/replacers/replaceImportsInJsCode/index.ts create mode 100644 src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts create mode 100644 src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts create mode 100644 src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts create mode 100644 src/bin/tools/OptionalIfCanBeUndefined.ts create mode 100644 src/bin/tools/String.prototype.replaceAll.ts create mode 100644 src/vite-plugin/config.json diff --git a/src/bin/constants.ts b/src/bin/constants.ts index 6cb76d97..91694c3f 100644 --- a/src/bin/constants.ts +++ b/src/bin/constants.ts @@ -1,8 +1,11 @@ +export const nameOfTheGlobal = "kcContext"; export const keycloak_resources = "keycloak-resources"; export const resources_common = "resources-common"; export const lastKeycloakVersionWithAccountV1 = "21.1.2"; +export const keycloakifyViteConfigJsonBasename = ".keycloakifyViteConfig.json"; +export const basenameOfTheKeycloakifyResourcesDir = "build"; export const themeTypes = ["login", "account"] as const; -export const accountV1 = "account-v1"; +export const accountV1ThemeName = "account-v1"; export type ThemeType = (typeof themeTypes)[number]; diff --git a/src/bin/keycloakify/BuildOptions.ts b/src/bin/keycloakify/BuildOptions.ts index 48962f12..e5f76d8f 100644 --- a/src/bin/keycloakify/BuildOptions.ts +++ b/src/bin/keycloakify/BuildOptions.ts @@ -24,6 +24,8 @@ export type BuildOptions = { /** 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; + bundler: "vite" | "webpack"; }; export function readBuildOptions(params: { reactAppRootDirPath: string; processArgv: string[] }): BuildOptions { diff --git a/src/bin/keycloakify/ftlValuesGlobalName.ts b/src/bin/keycloakify/ftlValuesGlobalName.ts index eb63e562..e69de29b 100644 --- a/src/bin/keycloakify/ftlValuesGlobalName.ts +++ b/src/bin/keycloakify/ftlValuesGlobalName.ts @@ -1 +0,0 @@ -export const ftlValuesGlobalName = "kcContext"; diff --git a/src/bin/keycloakify/generateFtl/generateFtl.ts b/src/bin/keycloakify/generateFtl/generateFtl.ts index a20e0bc9..04392ed6 100644 --- a/src/bin/keycloakify/generateFtl/generateFtl.ts +++ b/src/bin/keycloakify/generateFtl/generateFtl.ts @@ -5,10 +5,9 @@ import { replaceImportsInInlineCssCode } from "../replacers/replaceImportsInInli import * as fs from "fs"; import { join as pathJoin } from "path"; import { objectKeys } from "tsafe/objectKeys"; -import { ftlValuesGlobalName } from "../ftlValuesGlobalName"; import type { BuildOptions } from "../BuildOptions"; import { assert } from "tsafe/assert"; -import type { ThemeType } from "../../constants"; +import { type ThemeType, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../constants"; export type BuildOptionsLike = { themeVersion: string; @@ -20,7 +19,6 @@ assert(); export function generateFtlFilesCodeFactory(params: { themeName: string; indexHtmlCode: string; - //NOTE: Expected to be an empty object if external assets mode is enabled. cssGlobalsToDefine: Record; buildOptions: BuildOptionsLike; keycloakifyVersion: string; @@ -70,7 +68,10 @@ export function generateFtlFilesCodeFactory(params: { $(element).attr( attrName, - href.replace(new RegExp(`^${(buildOptions.urlPathname ?? "/").replace(/\//g, "\\/")}`), "${url.resourcesPath}/build/") + href.replace( + new RegExp(`^${(buildOptions.urlPathname ?? "/").replace(/\//g, "\\/")}`), + `\${url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/` + ) ); }) ); @@ -114,7 +115,7 @@ export function generateFtlFilesCodeFactory(params: { $("head").prepend( [ "", "", objectKeys(replaceValueBySearchValue)[1] diff --git a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts index 3ca94b27..4b8c26ea 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts @@ -3,7 +3,7 @@ import { join as pathJoin, dirname as pathDirname } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; import type { BuildOptions } from "../BuildOptions"; -import { resources_common, lastKeycloakVersionWithAccountV1, accountV1 } from "../../constants"; +import { resources_common, lastKeycloakVersionWithAccountV1, accountV1ThemeName } from "../../constants"; import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme"; import { transformCodebase } from "../../tools/transformCodebase"; @@ -29,7 +29,7 @@ export async function bringInAccountV1(params: { buildOptions: BuildOptionsLike buildOptions }); - const accountV1DirPath = pathJoin(buildOptions.keycloakifyBuildDirPath, "src", "main", "resources", "theme", accountV1, "account"); + const accountV1DirPath = pathJoin(buildOptions.keycloakifyBuildDirPath, "src", "main", "resources", "theme", accountV1ThemeName, "account"); transformCodebase({ "srcDirPath": pathJoin(builtinKeycloakThemeTmpDirPath, "base", "account"), diff --git a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts index 732c2007..a8d781f7 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts @@ -3,7 +3,7 @@ import { join as pathJoin, dirname as pathDirname } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; import type { BuildOptions } from "../BuildOptions"; -import { type ThemeType, accountV1 } from "../../constants"; +import { type ThemeType, accountV1ThemeName } from "../../constants"; import { bringInAccountV1 } from "./bringInAccountV1"; export type BuildOptionsLike = { @@ -102,7 +102,7 @@ export async function generateJavaStackFiles(params: { ? [] : [ { - "name": accountV1, + "name": accountV1ThemeName, "types": ["account"] } ]), diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index eacf1c8b..761d8aad 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -4,7 +4,14 @@ import { join as pathJoin, resolve as pathResolve } from "path"; import { replaceImportsFromStaticInJsCode } from "../replacers/replaceImportsFromStaticInJsCode"; import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode"; import { generateFtlFilesCodeFactory, loginThemePageIds, accountThemePageIds } from "../generateFtl"; -import { themeTypes, type ThemeType, lastKeycloakVersionWithAccountV1, keycloak_resources, accountV1 } from "../../constants"; +import { + themeTypes, + type ThemeType, + lastKeycloakVersionWithAccountV1, + keycloak_resources, + accountV1ThemeName, + basenameOfTheKeycloakifyResourcesDir +} from "../../constants"; import { isInside } from "../../tools/isInside"; import type { BuildOptions } from "../BuildOptions"; import { assert, type Equals } from "tsafe/assert"; @@ -18,7 +25,6 @@ export type BuildOptionsLike = { extraThemeProperties: string[] | undefined; themeVersion: string; loginThemeResourcesFromKeycloakVersion: string; - urlPathname: string | undefined; keycloakifyBuildDirPath: string; reactAppBuildDirPath: string; cacheDirPath: string; @@ -59,7 +65,7 @@ export async function generateTheme(params: { } transformCodebase({ - "destDirPath": pathJoin(themeTypeDirPath, "resources", "build"), + "destDirPath": pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir), "srcDirPath": buildOptions.reactAppBuildDirPath, "transformSourceCode": ({ filePath, sourceCode }) => { //NOTE: Prevent cycles, excludes the folder we generated for debug in public/ @@ -182,7 +188,7 @@ export async function generateTheme(params: { `parent=${(() => { switch (themeType) { case "account": - return accountV1; + return accountV1ThemeName; case "login": return "keycloak"; } diff --git a/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts b/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts new file mode 100644 index 00000000..504fb92e --- /dev/null +++ b/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts @@ -0,0 +1,79 @@ +import * as fs from "fs"; +import { assert } from "tsafe"; +import type { Equals } from "tsafe"; +import { z } from "zod"; +import { pathJoin } from "../tools/pathJoin"; +import { keycloakifyViteConfigJsonBasename } from "../constants"; +import type { OptionalIfCanBeUndefined } from "../tools/OptionalIfCanBeUndefined"; + +export type ParsedKeycloakifyViteConfig = { + reactAppRootDirPath: string; + publicDirPath: string; + assetsDirPath: string; + reactAppBuildDirPath: string; + urlPathname: string | undefined; +}; + +export const zParsedKeycloakifyViteConfig = z.object({ + "reactAppRootDirPath": z.string(), + "publicDirPath": z.string(), + "assetsDirPath": z.string(), + "reactAppBuildDirPath": z.string(), + "urlPathname": z.string().optional() +}); + +{ + type Got = ReturnType<(typeof zParsedKeycloakifyViteConfig)["parse"]>; + type Expected = OptionalIfCanBeUndefined; + + assert>(); +} + +let cache: { parsedKeycloakifyViteConfig: ParsedKeycloakifyViteConfig | undefined } | undefined = undefined; + +export function getParsedKeycloakifyViteConfig(params: { keycloakifyBuildDirPath: string }): ParsedKeycloakifyViteConfig | undefined { + const { keycloakifyBuildDirPath } = params; + + if (cache !== undefined) { + return cache.parsedKeycloakifyViteConfig; + } + + const parsedKeycloakifyViteConfig = (() => { + const keycloakifyViteConfigJsonFilePath = pathJoin(keycloakifyBuildDirPath, keycloakifyViteConfigJsonBasename); + + if (!fs.existsSync(keycloakifyViteConfigJsonFilePath)) { + return undefined; + } + + let out: ParsedKeycloakifyViteConfig; + + try { + out = JSON.parse(fs.readFileSync(keycloakifyViteConfigJsonFilePath).toString("utf8")); + } catch { + throw new Error("The output of the Keycloakify Vite plugin is not a valid JSON."); + } + + try { + const zodParseReturn = zParsedKeycloakifyViteConfig.parse(out); + + // So that objectKeys from tsafe return the expected result no matter what. + Object.keys(zodParseReturn) + .filter(key => !(key in out)) + .forEach(key => { + delete (out as any)[key]; + }); + } catch { + throw new Error("The output of the Keycloakify Vite plugin do not match the expected schema."); + } + + return out; + })(); + + if (parsedKeycloakifyViteConfig === undefined && fs.existsSync(pathJoin(keycloakifyBuildDirPath, "vite.config.ts"))) { + throw new Error("Make sure you have enabled the Keycloakiy plugin in your vite.config.ts"); + } + + cache = { parsedKeycloakifyViteConfig }; + + return parsedKeycloakifyViteConfig; +} diff --git a/src/bin/keycloakify/parsedPackageJson.ts b/src/bin/keycloakify/parsedPackageJson.ts index 43478f14..d649adc5 100644 --- a/src/bin/keycloakify/parsedPackageJson.ts +++ b/src/bin/keycloakify/parsedPackageJson.ts @@ -10,7 +10,6 @@ export type ParsedPackageJson = { homepage?: string; keycloakify?: { extraThemeProperties?: string[]; - areAppAndKeycloakServerSharingSameDomain?: boolean; artifactId?: string; groupId?: string; doCreateJar?: boolean; @@ -18,7 +17,6 @@ export type ParsedPackageJson = { reactAppBuildDirPath?: string; keycloakifyBuildDirPath?: string; themeName?: string | string[]; - doBuildRetrocompatAccountTheme?: boolean; }; }; @@ -29,22 +27,20 @@ export const zParsedPackageJson = z.object({ "keycloakify": z .object({ "extraThemeProperties": z.array(z.string()).optional(), - "areAppAndKeycloakServerSharingSameDomain": z.boolean().optional(), "artifactId": z.string().optional(), "groupId": z.string().optional(), "doCreateJar": z.boolean().optional(), "loginThemeResourcesFromKeycloakVersion": z.string().optional(), "reactAppBuildDirPath": z.string().optional(), "keycloakifyBuildDirPath": z.string().optional(), - "themeName": z.union([z.string(), z.array(z.string())]).optional(), - "doBuildRetrocompatAccountTheme": z.boolean().optional() + "themeName": z.union([z.string(), z.array(z.string())]).optional() }) .optional() }); assert, ParsedPackageJson>>(); -let parsedPackageJson: undefined | ReturnType<(typeof zParsedPackageJson)["parse"]>; +let parsedPackageJson: undefined | ParsedPackageJson; export function getParsedPackageJson(params: { reactAppRootDirPath: string }) { const { reactAppRootDirPath } = params; if (parsedPackageJson) { diff --git a/src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts b/src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts deleted file mode 100644 index 150ffff0..00000000 --- a/src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts +++ /dev/null @@ -1,65 +0,0 @@ -import { ftlValuesGlobalName } from "../ftlValuesGlobalName"; - -export function replaceImportsFromStaticInJsCode(params: { jsCode: string; bundler: "vite" | "webpack" }): { fixedJsCode: string } { - const { jsCode } = params; - - const { fixedJsCode } = (() => { - switch (params.bundler) { - case "vite": - return replaceImportsFromStaticInJsCode_vite({ jsCode }); - case "webpack": - return replaceImportsFromStaticInJsCode_webpack({ jsCode }); - } - })(); - - return { fixedJsCode }; -} - -export function replaceImportsFromStaticInJsCode_vite(params: { jsCode: string }): { fixedJsCode: string } { - const { jsCode } = params; - - const fixedJsCode = jsCode.replace( - /\.viteFileDeps = \[(.*)\]/g, - (...args) => `.viteFileDeps = [${args[1]}].map(viteFileDep => window.kcContext.url.resourcesPath.substring(1) + "/build/" + viteFileDep)` - ); - - return { fixedJsCode }; -} - -export function replaceImportsFromStaticInJsCode_webpack(params: { jsCode: string }): { fixedJsCode: string } { - const { jsCode } = params; - - const getReplaceArgs = (language: "js" | "css"): Parameters => [ - new RegExp(`([a-zA-Z_]+)\\.([a-zA-Z]+)=(function\\(([a-z]+)\\){return|([a-z]+)=>)"static\\/${language}\\/"`, "g"), - (...[, n, u, matchedFunction, eForFunction]) => { - const isArrowFunction = matchedFunction.includes("=>"); - const e = isArrowFunction ? matchedFunction.replace("=>", "").trim() : eForFunction; - - return ` - ${n}[(function(){ - var pd = Object.getOwnPropertyDescriptor(${n}, "p"); - if( pd === undefined || pd.configurable ){ - Object.defineProperty(${n}, "p", { - get: function() { return window.${ftlValuesGlobalName}.url.resourcesPath; }, - set: function() {} - }); - } - return "${u}"; - })()] = ${isArrowFunction ? `${e} =>` : `function(${e}) { return `} "/build/static/${language}/"` - .replace(/\s+/g, " ") - .trim(); - } - ]; - - const fixedJsCode = jsCode - .replace(...getReplaceArgs("js")) - .replace(...getReplaceArgs("css")) - .replace(/[a-zA-Z]+\.[a-zA-Z]+\+"static\//g, `window.${ftlValuesGlobalName}.url.resourcesPath + "/build/static/`) - //TODO: Write a test case for this - .replace( - /".chunk.css",([a-zA-Z])+=[a-zA-Z]+\.[a-zA-Z]+\+([a-zA-Z]+),/, - (...[, group1, group2]) => `".chunk.css",${group1} = window.${ftlValuesGlobalName}.url.resourcesPath + "/build/" + ${group2},` - ); - - return { fixedJsCode }; -} diff --git a/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts b/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts index de53e6f9..3cf192a4 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts @@ -1,6 +1,7 @@ import * as crypto from "crypto"; import type { BuildOptions } from "../BuildOptions"; import { assert } from "tsafe/assert"; +import { basenameOfTheKeycloakifyResourcesDir } from "../../constants"; export type BuildOptionsLike = { urlPathname: string | undefined; @@ -45,7 +46,7 @@ export function generateCssCodeToDefineGlobals(params: { cssGlobalsToDefine: Rec `--${cssVariableName}:`, cssGlobalsToDefine[cssVariableName].replace( new RegExp(`url\\(${(buildOptions.urlPathname ?? "/").replace(/\//g, "\\/")}`, "g"), - "url(${url.resourcesPath}/build/" + `url(\${url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/` ) ].join(" ") ) diff --git a/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts b/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts index 88b3e0e8..e8e980bd 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts @@ -1,5 +1,6 @@ import type { BuildOptions } from "../BuildOptions"; import { assert } from "tsafe/assert"; +import { basenameOfTheKeycloakifyResourcesDir } from "../../constants"; export type BuildOptionsLike = { urlPathname: string | undefined; @@ -16,7 +17,7 @@ export function replaceImportsInInlineCssCode(params: { cssCode: string; buildOp buildOptions.urlPathname === undefined ? /url\(["']?\/([^/][^)"']+)["']?\)/g : new RegExp(`url\\(["']?${buildOptions.urlPathname}([^)"']+)["']?\\)`, "g"), - (...[, group]) => `url(\${url.resourcesPath}/build/${group})` + (...[, group]) => `url(\${url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/${group})` ); return { fixedCssCode }; diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/index.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/index.ts new file mode 100644 index 00000000..93784124 --- /dev/null +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/index.ts @@ -0,0 +1 @@ +export * from "./replaceImportsInJsCode"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts new file mode 100644 index 00000000..4d53fc65 --- /dev/null +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts @@ -0,0 +1,85 @@ +import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants"; +import { assert } from "tsafe/assert"; +import type { BuildOptions } from "../../BuildOptions"; +import * as nodePath from "path"; +import { replaceAll } from "../../../tools/String.prototype.replaceAll"; + +export type BuildOptionsLike = { + reactAppBuildDirPath: string; + assetsDirPath: string; + urlPathname: string | undefined; +}; + +assert(); + +export function replaceImportsInJsCode_vite(params: { + jsCode: string; + buildOptions: BuildOptionsLike; + basenameOfAssetsFiles: string[]; + systemType?: "posix" | "win32"; +}): { + fixedJsCode: string; +} { + const { jsCode, buildOptions, basenameOfAssetsFiles, systemType = nodePath.sep === "/" ? "posix" : "win32" } = params; + + const { relative: pathRelative, sep: pathSep } = nodePath[systemType]; + + let fixedJsCode = jsCode; + + replace_base_javacript_import: { + if (buildOptions.urlPathname === undefined) { + break replace_base_javacript_import; + } + // Optimization + if (!jsCode.includes(buildOptions.urlPathname)) { + break replace_base_javacript_import; + } + + // Replace `Hv=function(e){return"/abcde12345/"+e}` by `Hv=function(e){return"/"+e}` + fixedJsCode = fixedJsCode.replace( + new RegExp( + `([\\w\\$][\\w\\d\\$]*)=function\\(([\\w\\$][\\w\\d\\$]*)\\)\\{return"${replaceAll(buildOptions.urlPathname, "/", "\\/")}"\\+\\2\\}`, + "g" + ), + (...[, funcName, paramName]) => `${funcName}=function(${paramName}){return"/"+${paramName}}` + ); + } + + replace_javascript_relatives_import_paths: { + // Example: "assets/ or "foo/bar/" + const staticDir = (() => { + let out = pathRelative(buildOptions.reactAppBuildDirPath, buildOptions.assetsDirPath); + + out = replaceAll(out, pathSep, "/") + "/"; + + if (out === "/") { + throw new Error(`The assetsDirPath must be a subdirectory of reactAppBuildDirPath`); + } + + return out; + })(); + + // Optimization + if (!jsCode.includes(staticDir)) { + break replace_javascript_relatives_import_paths; + } + + basenameOfAssetsFiles + .map(basenameOfAssetsFile => `${staticDir}${basenameOfAssetsFile}`) + .forEach(relativePathOfAssetFile => { + fixedJsCode = replaceAll( + fixedJsCode, + `"${relativePathOfAssetFile}"`, + `(window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/${relativePathOfAssetFile}")` + ); + + fixedJsCode = replaceAll( + fixedJsCode, + `"${buildOptions.urlPathname ?? "/"}${relativePathOfAssetFile}"`, + `(window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/${relativePathOfAssetFile}")` + ); + }); + } + + return { fixedJsCode }; +} diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts new file mode 100644 index 00000000..5648cab7 --- /dev/null +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts @@ -0,0 +1,94 @@ +import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants"; +import { assert } from "tsafe/assert"; +import type { BuildOptions } from "../../BuildOptions"; +import { relative as pathRelative, sep as pathSep } from "path"; +import { replaceAll } from "../../../tools/String.prototype.replaceAll"; + +export type BuildOptionsLike = { + reactAppBuildDirPath: string; + assetsDirPath: string; + urlPathname: string | undefined; +}; + +assert(); + +export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOptions: BuildOptionsLike }): { fixedJsCode: string } { + const { jsCode, buildOptions } = params; + + let fixedJsCode = jsCode; + + // "__esModule",{value:!0})},n.p="/",function(){if("undefined" -> n.p="/abcde12345/" + + // d={NODE_ENV:"production",PUBLIC_URL:"/abcde12345",WDS_SOCKET_HOST + // d={NODE_ENV:"production",PUBLIC_URL:"",WDS_SOCKET_HOST + // -> + // PUBLIC_URL:"${window.${nameOfTheGlobal}.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}"` + + if (buildOptions.urlPathname !== undefined) { + fixedJsCode = fixedJsCode.replace( + new RegExp(`,([a-zA-Z]\\.[a-zA-Z])="${replaceAll(buildOptions.urlPathname, "/", "\\/")}",`, "g"), + (...[, assignTo]) => `,${assignTo}="/",` + ); + } + + 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); + + out = replaceAll(out, pathSep, "/") + "/"; + + if (out === "/") { + throw new Error(`The assetsDirPath must be a subdirectory of reactAppBuildDirPath`); + } + + return out; + })(); + + const getReplaceArgs = (language: "js" | "css"): Parameters => [ + new RegExp(`([a-zA-Z_]+)\\.([a-zA-Z]+)=(function\\(([a-z]+)\\){return|([a-z]+)=>)"${staticDir.replace(/\//g, "\\/")}${language}\\/"`, "g"), + (...[, n, u, matchedFunction, eForFunction]) => { + const isArrowFunction = matchedFunction.includes("=>"); + const e = isArrowFunction ? matchedFunction.replace("=>", "").trim() : eForFunction; + + return ` + ${n}[(function(){ + var pd = Object.getOwnPropertyDescriptor(${n}, "p"); + if( pd === undefined || pd.configurable ){ + Object.defineProperty(${n}, "p", { + get: function() { return window.${nameOfTheGlobal}.url.resourcesPath; }, + set: function() {} + }); + } + return "${u}"; + })()] = ${isArrowFunction ? `${e} =>` : `function(${e}) { return `} "/${basenameOfTheKeycloakifyResourcesDir}/${staticDir}${language}/"` + .replace(/\s+/g, " ") + .trim(); + } + ]; + + fixedJsCode = fixedJsCode + .replace(...getReplaceArgs("js")) + .replace(...getReplaceArgs("css")) + .replace( + new RegExp(`[a-zA-Z]+\\.[a-zA-Z]+\\+"${staticDir.replace(/\//g, "\\/")}"`, "g"), + `window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/${staticDir}` + ) + //TODO: Write a test case for this + .replace( + /".chunk.css",([a-zA-Z])+=[a-zA-Z]+\.[a-zA-Z]+\+([a-zA-Z]+),/, + (...[, group1, group2]) => + `".chunk.css",${group1} = window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/" + ${group2},` + ); + + return { fixedJsCode }; +} diff --git a/src/bin/tools/OptionalIfCanBeUndefined.ts b/src/bin/tools/OptionalIfCanBeUndefined.ts new file mode 100644 index 00000000..eef4d10a --- /dev/null +++ b/src/bin/tools/OptionalIfCanBeUndefined.ts @@ -0,0 +1,12 @@ +type PropertiesThatCanBeUndefined> = { + [Key in keyof T]: undefined extends T[Key] ? Key : never; +}[keyof T]; + +/** + * OptionalIfCanBeUndefined<{ p1: string | undefined; p2: string; }> + * is + * { p1?: string | undefined; p2: string } + */ +export type OptionalIfCanBeUndefined> = { + [K in PropertiesThatCanBeUndefined]?: T[K]; +} & { [K in Exclude>]: T[K] }; diff --git a/src/bin/tools/String.prototype.replaceAll.ts b/src/bin/tools/String.prototype.replaceAll.ts new file mode 100644 index 00000000..7fc1ebb8 --- /dev/null +++ b/src/bin/tools/String.prototype.replaceAll.ts @@ -0,0 +1,30 @@ +export function replaceAll(string: string, searchValue: string | RegExp, replaceValue: string): string { + if ((string as any).replaceAll !== undefined) { + return (string as any).replaceAll(searchValue, replaceValue); + } + + // If the searchValue is a string + if (typeof searchValue === "string") { + // Escape special characters in the string to be used in a regex + var escapedSearchValue = searchValue.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"); + var regex = new RegExp(escapedSearchValue, "g"); + + return string.replace(regex, replaceValue); + } + + // If the searchValue is a global RegExp, use it directly + if (searchValue instanceof RegExp && searchValue.global) { + return string.replace(searchValue, replaceValue); + } + + // If the searchValue is a non-global RegExp, throw an error + if (searchValue instanceof RegExp) { + throw new TypeError("replaceAll must be called with a global RegExp"); + } + + // Convert searchValue to string if it's not a string or RegExp + var searchString = String(searchValue); + var regexFromString = new RegExp(searchString.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), "g"); + + return string.replace(regexFromString, replaceValue); +} diff --git a/src/vite-plugin/config.json b/src/vite-plugin/config.json new file mode 100644 index 00000000..3dad4b82 --- /dev/null +++ b/src/vite-plugin/config.json @@ -0,0 +1,232 @@ +{ + "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 + } +} diff --git a/src/vite-plugin/tsconfig.json b/src/vite-plugin/tsconfig.json index 8023c2a4..cb7242ca 100644 --- a/src/vite-plugin/tsconfig.json +++ b/src/vite-plugin/tsconfig.json @@ -2,11 +2,16 @@ "extends": "../../tsproject.json", "compilerOptions": { "module": "CommonJS", - "target": "ES5", + "target": "ES2019", "esModuleInterop": true, - "lib": ["es2015", "ES2019.Object"], + "lib": ["es2019", "es2020.bigint", "es2020.string", "es2020.symbol.wellknown"], "outDir": "../../dist/vite-plugin", "rootDir": ".", "skipLibCheck": true - } + }, + "references": [ + { + "path": "../bin" + } + ] } diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index 1d60b6a4..3ac1c990 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -1,31 +1,127 @@ -// index.ts - -import type { Plugin, ResolvedConfig } from "vite"; +import { join as pathJoin, sep as pathSep } from "path"; +import { getParsedPackageJson } from "../bin/keycloakify/parsedPackageJson"; +import type { Plugin } from "vite"; +import { assert } from "tsafe/assert"; +import { getAbsoluteAndInOsFormatPath } from "../bin/tools/getAbsoluteAndInOsFormatPath"; import * as fs from "fs"; - -console.log("Hello world!"); +import { keycloakifyViteConfigJsonBasename, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../bin/constants"; +import type { ParsedKeycloakifyViteConfig } from "../bin/keycloakify/parsedKeycloakifyViteConfig"; +import { replaceAll } from "../bin/tools/String.prototype.replaceAll"; export function keycloakify(): Plugin { - let config: ResolvedConfig; + let keycloakifyViteConfig: ParsedKeycloakifyViteConfig | undefined = undefined; return { "name": "keycloakify", - "configResolved": resolvedConfig => { - // Store the resolved config - config = resolvedConfig; + const reactAppRootDirPath = resolvedConfig.root; + const reactAppBuildDirPath = pathJoin(reactAppRootDirPath, resolvedConfig.build.outDir); - console.log("========> configResolved", config); + keycloakifyViteConfig = { + reactAppRootDirPath, + "publicDirPath": resolvedConfig.publicDir, + "assetsDirPath": pathJoin(reactAppBuildDirPath, resolvedConfig.build.assetsDir), + reactAppBuildDirPath, + "urlPathname": (() => { + let out = resolvedConfig.env.BASE_URL; - fs.writeFileSync("/Users/joseph/github/keycloakify-starter/log.txt", Buffer.from("Hello World", "utf8")); + if (out === undefined) { + return undefined; + } + + if (!out.startsWith("/")) { + out = "/" + out; + } + + if (!out.endsWith("/")) { + out += "/"; + } + + return out; + })() + }; + + const parsedPackageJson = getParsedPackageJson({ reactAppRootDirPath }); + + if (parsedPackageJson.keycloakify?.reactAppBuildDirPath !== undefined) { + throw new Error( + [ + "Please do not use the keycloakify.reactAppBuildDirPath option in your package.json.", + "In Vite setups it's inferred automatically from the vite config." + ].join(" ") + ); + } + + const keycloakifyBuildDirPath = (() => { + const { keycloakifyBuildDirPath } = parsedPackageJson.keycloakify ?? {}; + + if (keycloakifyBuildDirPath !== undefined) { + return getAbsoluteAndInOsFormatPath({ + "pathIsh": keycloakifyBuildDirPath, + "cwd": reactAppRootDirPath + }); + } + + return pathJoin(reactAppRootDirPath, "build_keycloak"); + })(); + + if (!fs.existsSync(keycloakifyBuildDirPath)) { + fs.mkdirSync(keycloakifyBuildDirPath); + } + + fs.writeFileSync( + pathJoin(keycloakifyBuildDirPath, keycloakifyViteConfigJsonBasename), + Buffer.from(JSON.stringify(keycloakifyViteConfig, null, 2), "utf8") + ); }, + "transform": (code, id) => { + assert(keycloakifyViteConfig !== undefined); - "buildStart": () => { - console.log("Public Directory:", config.publicDir); // Path to the public directory - console.log("Dist Directory:", config.build.outDir); // Path to the dist directory - console.log("Assets Directory:", config.build.assetsDir); // Path to the assets directory within outDir + let transformedCode: string | undefined = undefined; + + replace_import_meta_env_base_url_in_source_code: { + { + const isWithinSourceDirectory = id.startsWith(pathJoin(keycloakifyViteConfig.publicDirPath, "src") + pathSep); + + if (!isWithinSourceDirectory) { + break replace_import_meta_env_base_url_in_source_code; + } + } + + const isJavascriptFile = id.endsWith(".js") || id.endsWith(".jsx"); + + { + const isTypeScriptFile = id.endsWith(".ts") || id.endsWith(".tsx"); + + if (!isTypeScriptFile && !isJavascriptFile) { + break replace_import_meta_env_base_url_in_source_code; + } + } + + const windowToken = isJavascriptFile ? "window" : "(window as any)"; + + if (transformedCode === undefined) { + transformedCode = code; + } + + transformedCode = replaceAll( + transformedCode, + "import.meta.env.BASE_URL", + [ + `(`, + `(${windowToken}.${nameOfTheGlobal} === undefined || import.meta.env.MODE === "development") ?`, + ` "${keycloakifyViteConfig.urlPathname ?? "/"}" :`, + ` \`\${${windowToken}.${nameOfTheGlobal}.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/\``, + `)` + ].join("") + ); + } + + if (transformedCode !== undefined) { + return { + "code": transformedCode + }; + } } - - // ... other hooks }; } diff --git a/test/bin/replaceImportFromStatic.spec.ts b/test/bin/replaceImportFromStatic.spec.ts index 34d912a1..bfe9cc22 100644 --- a/test/bin/replaceImportFromStatic.spec.ts +++ b/test/bin/replaceImportFromStatic.spec.ts @@ -1,15 +1,56 @@ -import { replaceImportsFromStaticInJsCode } from "keycloakify/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode"; +import { replaceImportsInJsCode_vite } from "keycloakify/bin/keycloakify/replacers/replaceImportsInJsCode/vite"; import { generateCssCodeToDefineGlobals, replaceImportsInCssCode } from "keycloakify/bin/keycloakify/replacers/replaceImportsInCssCode"; import { replaceImportsInInlineCssCode } from "keycloakify/bin/keycloakify/replacers/replaceImportsInInlineCssCode"; import { same } from "evt/tools/inDepth/same"; import { expect, it, describe } from "vitest"; - import { isSameCode } from "../tools/isSameCode"; +import { basenameOfTheKeycloakifyResourcesDir, nameOfTheGlobal } from "keycloakify/bin/constants"; -describe("bin/js-transforms", () => { - // Vite - { +describe("bin/js-transforms - vite", () => { + it("replaceImportsInJsCode_vite - 1", () => { + const before = `Uv="modulepreload",`; + const after = `,Wc={},`; + const jsCodeUntransformed = `${before}Hv=function(e){return"/foo-bar-baz/"+e}${after}`; + + const { fixedJsCode } = replaceImportsInJsCode_vite({ + "jsCode": jsCodeUntransformed, + "basenameOfAssetsFiles": [], + "buildOptions": { + "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/dist/", + "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/assets/", + "urlPathname": "/foo-bar-baz/" + } + }); + + const fixedJsCodeExpected = `${before}Hv=function(e){return"/"+e}${after}`; + + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + }); + + it("replaceImportsInJsCode_vite - 2", () => { + const before = `Uv="modulepreload",`; + const after = `,Wc={},`; + const jsCodeUntransformed = `${before}Hv=function(e){return"/foo/bar/baz/"+e}${after}`; + + const { fixedJsCode } = replaceImportsInJsCode_vite({ + "jsCode": jsCodeUntransformed, + "basenameOfAssetsFiles": [], + "buildOptions": { + "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/dist/", + "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/assets/", + "urlPathname": "/foo/bar/baz/" + } + }); + + const fixedJsCodeExpected = `${before}Hv=function(e){return"/"+e}${after}`; + + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + }); + + it("replaceImportsInJsCode_vite - 3", () => { const jsCodeUntransformed = ` + S="/assets/keycloakify-logo-mqjydaoZ.png",H=(()=>{ + function __vite__mapDeps(indexes) { if (!__vite__mapDeps.viteFileDeps) { __vite__mapDeps.viteFileDeps = ["assets/Login-dJpPRzM4.js", "assets/index-XwzrZ5Gu.js"] @@ -17,28 +58,157 @@ describe("bin/js-transforms", () => { return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) } `; - it("Correctly replace import path in Vite dist/static/xxx.js files", () => { - const { fixedJsCode } = replaceImportsFromStaticInJsCode({ + + for (const { reactAppBuildDirPath, assetsDirPath, systemType } of [ + { + "systemType": "posix", + "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/dist", + "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/assets" + }, + { + "systemType": "win32", + "reactAppBuildDirPath": "C:\\\\Users\\someone\\github\\keycloakify-starter\\dist", + "assetsDirPath": "C:\\\\Users\\someone\\github\\keycloakify-starter\\dist\\assets" + } + ] as const) { + const { fixedJsCode } = replaceImportsInJsCode_vite({ "jsCode": jsCodeUntransformed, - "bundler": "vite" + "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js"], + "buildOptions": { + reactAppBuildDirPath, + assetsDirPath, + "urlPathname": undefined + }, + systemType }); const fixedJsCodeExpected = ` - function __vite__mapDeps(indexes) { - if (!__vite__mapDeps.viteFileDeps) { - __vite__mapDeps.viteFileDeps = ["assets/Login-dJpPRzM4.js", "assets/index-XwzrZ5Gu.js"].map(viteFileDep => window.kcContext.url.resourcesPath.substring(1) + "/build/" + viteFileDep) + S=(window.${nameOfTheGlobal}.url + "/${basenameOfTheKeycloakifyResourcesDir}/assets/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ + + function __vite__mapDeps(indexes) { + if (!__vite__mapDeps.viteFileDeps) { + __vite__mapDeps.viteFileDeps = [ + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/Login-dJpPRzM4.js)", + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/index-XwzrZ5Gu.js)" + ] + } + return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) } - return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) - } - `; + `; expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); - }); - } + } + }); - // Webpack - { + it("replaceImportsInJsCode_vite - 4", () => { const jsCodeUntransformed = ` + S="/assets/keycloakify-logo-mqjydaoZ.png",H=(()=>{ + + function __vite__mapDeps(indexes) { + if (!__vite__mapDeps.viteFileDeps) { + __vite__mapDeps.viteFileDeps = ["assets/Login-dJpPRzM4.js", "assets/index-XwzrZ5Gu.js"] + } + return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) + } + `; + + for (const { reactAppBuildDirPath, assetsDirPath, systemType } of [ + { + "systemType": "posix", + "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/dist", + "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/foo/bar" + }, + { + "systemType": "win32", + "reactAppBuildDirPath": "C:\\\\Users\\someone\\github\\keycloakify-starter\\dist", + "assetsDirPath": "C:\\\\Users\\someone\\github\\keycloakify-starter\\dist\\foo\\bar" + } + ] as const) { + const { fixedJsCode } = replaceImportsInJsCode_vite({ + "jsCode": jsCodeUntransformed, + "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js"], + "buildOptions": { + reactAppBuildDirPath, + assetsDirPath, + "urlPathname": undefined + }, + systemType + }); + + const fixedJsCodeExpected = ` + S=(window.${nameOfTheGlobal}.url + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ + + function __vite__mapDeps(indexes) { + if (!__vite__mapDeps.viteFileDeps) { + __vite__mapDeps.viteFileDeps = [ + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/Login-dJpPRzM4.js)", + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/index-XwzrZ5Gu.js)" + ] + } + return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) + } + `; + + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + } + }); + + it("replaceImportsInJsCode_vite - 5", () => { + const jsCodeUntransformed = ` + S="/foo-bar-baz/assets/keycloakify-logo-mqjydaoZ.png",H=(()=>{ + + function __vite__mapDeps(indexes) { + if (!__vite__mapDeps.viteFileDeps) { + __vite__mapDeps.viteFileDeps = ["assets/Login-dJpPRzM4.js", "assets/index-XwzrZ5Gu.js"] + } + return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) + } + `; + + for (const { reactAppBuildDirPath, assetsDirPath, systemType } of [ + { + "systemType": "posix", + "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/dist", + "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/assets" + }, + { + "systemType": "win32", + "reactAppBuildDirPath": "C:\\\\Users\\someone\\github\\keycloakify-starter\\dist", + "assetsDirPath": "C:\\\\Users\\someone\\github\\keycloakify-starter\\dist\\assets" + } + ] as const) { + const { fixedJsCode } = replaceImportsInJsCode_vite({ + "jsCode": jsCodeUntransformed, + "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js"], + "buildOptions": { + reactAppBuildDirPath, + assetsDirPath, + "urlPathname": "/foo-bar-baz/" + }, + systemType + }); + + const fixedJsCodeExpected = ` + S=(window.${nameOfTheGlobal}.url + "/${basenameOfTheKeycloakifyResourcesDir}/assets/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ + + function __vite__mapDeps(indexes) { + if (!__vite__mapDeps.viteFileDeps) { + __vite__mapDeps.viteFileDeps = [ + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/Login-dJpPRzM4.js)", + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/index-XwzrZ5Gu.js)" + ] + } + return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) + } + `; + + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + } + }); +}); + +describe("bin/js-transforms - webpack", () => { + const jsCodeUntransformed = ` function f() { return a.p+"static/js/" + ({}[e] || e) + "." + { 3: "0664cdc0" @@ -68,13 +238,13 @@ describe("bin/js-transforms", () => { t.miniCssF=e=>"static/css/"+e+"."+{164:"dcfd7749",908:"67c9ed2c"}[e]+".chunk.css" `; - it("Correctly replace import path in Webpack build/static/js/xxx.js files", () => { - const { fixedJsCode } = replaceImportsFromStaticInJsCode({ - "jsCode": jsCodeUntransformed, - "bundler": "webpack" - }); + it("Correctly replace import path in Webpack build/static/js/xxx.js files", () => { + const { fixedJsCode } = replaceImportsFromStaticInJsCode({ + "jsCode": jsCodeUntransformed, + "bundler": "webpack" + }); - const fixedJsCodeExpected = ` + const fixedJsCodeExpected = ` function f() { return window.kcContext.url.resourcesPath + "/build/static/js/" + ({}[e] || e) + "." + { 3: "0664cdc0" @@ -143,9 +313,8 @@ describe("bin/js-transforms", () => { })()] = e => "/build/static/css/"+e+"."+{164:"dcfd7749",908:"67c9ed2c"}[e]+".chunk.css" `; - expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); - }); - } + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + }); }); describe("bin/css-transforms", () => { From f55d61bf0bb773b8e1048269b8824b3d5efac2cf Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 00:10:59 +0100 Subject: [PATCH 05/83] Rename test case file --- .../replacers/replaceImportsInJsCode/webpack.ts | 10 +++++++--- ...placeImportFromStatic.spec.ts => replacers.spec.ts} | 8 ++++---- 2 files changed, 11 insertions(+), 7 deletions(-) rename test/bin/{replaceImportFromStatic.spec.ts => replacers.spec.ts} (99%) diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts index 5648cab7..5a7d91dd 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts @@ -1,7 +1,7 @@ import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants"; import { assert } from "tsafe/assert"; import type { BuildOptions } from "../../BuildOptions"; -import { relative as pathRelative, sep as pathSep } from "path"; +import * as nodePath from "path"; import { replaceAll } from "../../../tools/String.prototype.replaceAll"; export type BuildOptionsLike = { @@ -12,8 +12,12 @@ export type BuildOptionsLike = { assert(); -export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOptions: BuildOptionsLike }): { fixedJsCode: string } { - const { jsCode, buildOptions } = params; +export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOptions: BuildOptionsLike; systemType?: "posix" | "win32" }): { + fixedJsCode: string; +} { + const { jsCode, buildOptions, systemType = nodePath.sep === "/" ? "posix" : "win32" } = params; + + const { relative: pathRelative, sep: pathSep } = nodePath[systemType]; let fixedJsCode = jsCode; diff --git a/test/bin/replaceImportFromStatic.spec.ts b/test/bin/replacers.spec.ts similarity index 99% rename from test/bin/replaceImportFromStatic.spec.ts rename to test/bin/replacers.spec.ts index bfe9cc22..4c5771c3 100644 --- a/test/bin/replaceImportFromStatic.spec.ts +++ b/test/bin/replacers.spec.ts @@ -6,7 +6,7 @@ import { expect, it, describe } from "vitest"; import { isSameCode } from "../tools/isSameCode"; import { basenameOfTheKeycloakifyResourcesDir, nameOfTheGlobal } from "keycloakify/bin/constants"; -describe("bin/js-transforms - vite", () => { +describe("js replacer - vite", () => { it("replaceImportsInJsCode_vite - 1", () => { const before = `Uv="modulepreload",`; const after = `,Wc={},`; @@ -207,7 +207,7 @@ describe("bin/js-transforms - vite", () => { }); }); -describe("bin/js-transforms - webpack", () => { +describe("js replacer - webpack", () => { const jsCodeUntransformed = ` function f() { return a.p+"static/js/" + ({}[e] || e) + "." + { @@ -317,7 +317,7 @@ describe("bin/js-transforms - webpack", () => { }); }); -describe("bin/css-transforms", () => { +describe("css replacer", () => { it("transforms absolute urls to css globals properly with no urlPathname", () => { const { fixedCssCode, cssGlobalsToDefine } = replaceImportsInCssCode({ "cssCode": ` @@ -432,7 +432,7 @@ describe("bin/css-transforms", () => { }); }); -describe("bin/css-inline-transforms", () => { +describe("inline css replacer", () => { describe("no url pathName", () => { const cssCode = ` @font-face { From 1eb6b154f7465ba2c83f7467a5e0fdef80913e22 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 00:15:08 +0100 Subject: [PATCH 06/83] Rearenge test case --- test/bin/replacers.spec.ts | 62 +++++++++++++++++++++----------------- 1 file changed, 34 insertions(+), 28 deletions(-) diff --git a/test/bin/replacers.spec.ts b/test/bin/replacers.spec.ts index 4c5771c3..bb7d846a 100644 --- a/test/bin/replacers.spec.ts +++ b/test/bin/replacers.spec.ts @@ -1,4 +1,5 @@ import { replaceImportsInJsCode_vite } from "keycloakify/bin/keycloakify/replacers/replaceImportsInJsCode/vite"; +import { replaceImportsInJsCode_webpack } from "keycloakify/bin/keycloakify/replacers/replaceImportsInJsCode/webpack"; import { generateCssCodeToDefineGlobals, replaceImportsInCssCode } from "keycloakify/bin/keycloakify/replacers/replaceImportsInCssCode"; import { replaceImportsInInlineCssCode } from "keycloakify/bin/keycloakify/replacers/replaceImportsInInlineCssCode"; import { same } from "evt/tools/inDepth/same"; @@ -208,40 +209,45 @@ describe("js replacer - vite", () => { }); describe("js replacer - webpack", () => { - const jsCodeUntransformed = ` - function f() { - return a.p+"static/js/" + ({}[e] || e) + "." + { - 3: "0664cdc0" - }[e] + ".chunk.js" - } + it("replaceImportsInJsCode_webpack - 1", () => { + const jsCodeUntransformed = ` + function f() { + return a.p+"static/js/" + ({}[e] || e) + "." + { + 3: "0664cdc0" + }[e] + ".chunk.js" + } - function sameAsF() { - return a.p+"static/js/" + ({}[e] || e) + "." + { - 3: "0664cdc0" - }[e] + ".chunk.js" - } + function sameAsF() { + return a.p+"static/js/" + ({}[e] || e) + "." + { + 3: "0664cdc0" + }[e] + ".chunk.js" + } - __webpack_require__.u=function(e){return"static/js/" + e + "." + { - 147: "6c5cee76", - 787: "8da10fcf", - 922: "be170a73" - } [e] + ".chunk.js" - } + __webpack_require__.u=function(e){return"static/js/" + e + "." + { + 147: "6c5cee76", + 787: "8da10fcf", + 922: "be170a73" + } [e] + ".chunk.js" + } - t.miniCssF=function(e){return"static/css/"+e+"."+{ - 164:"dcfd7749", - 908:"67c9ed2c" - }[e]+".chunk.css" - } + t.miniCssF=function(e){return"static/css/"+e+"."+{ + 164:"dcfd7749", + 908:"67c9ed2c" + }[e]+".chunk.css" + } - n.u=e=>"static/js/"+e+"."+{69:"4f205f87",128:"49264537",453:"b2fed72e",482:"f0106901"}[e]+".chunk.js" + n.u=e=>"static/js/"+e+"."+{69:"4f205f87",128:"49264537",453:"b2fed72e",482:"f0106901"}[e]+".chunk.js" - t.miniCssF=e=>"static/css/"+e+"."+{164:"dcfd7749",908:"67c9ed2c"}[e]+".chunk.css" - `; - it("Correctly replace import path in Webpack build/static/js/xxx.js files", () => { - const { fixedJsCode } = replaceImportsFromStaticInJsCode({ + t.miniCssF=e=>"static/css/"+e+"."+{164:"dcfd7749",908:"67c9ed2c"}[e]+".chunk.css" + `; + + const { fixedJsCode } = replaceImportsInJsCode_webpack({ "jsCode": jsCodeUntransformed, - "bundler": "webpack" + "buildOptions": { + "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/build", + "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/build/static", + "urlPathname": undefined + } }); const fixedJsCodeExpected = ` From 7267d2ef3838b25b5344fa655f4068aad0919681 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 00:37:30 +0100 Subject: [PATCH 07/83] Add a test case for the code that enable the import to work in webpack if base isn't / --- .../replaceImportsInJsCode/webpack.ts | 12 +++--- test/bin/replacers.spec.ts | 40 +++++++++++++++++++ 2 files changed, 45 insertions(+), 7 deletions(-) diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts index 5a7d91dd..dcbefdf6 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts @@ -21,20 +21,18 @@ export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOp let fixedJsCode = jsCode; - // "__esModule",{value:!0})},n.p="/",function(){if("undefined" -> n.p="/abcde12345/" - - // d={NODE_ENV:"production",PUBLIC_URL:"/abcde12345",WDS_SOCKET_HOST - // d={NODE_ENV:"production",PUBLIC_URL:"",WDS_SOCKET_HOST - // -> - // PUBLIC_URL:"${window.${nameOfTheGlobal}.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}"` - if (buildOptions.urlPathname !== undefined) { + // "__esModule",{value:!0})},n.p="/foo-bar/",function(){if("undefined" -> ... n.p="/" ... fixedJsCode = fixedJsCode.replace( new RegExp(`,([a-zA-Z]\\.[a-zA-Z])="${replaceAll(buildOptions.urlPathname, "/", "\\/")}",`, "g"), (...[, assignTo]) => `,${assignTo}="/",` ); } + // d={NODE_ENV:"production",PUBLIC_URL:"/abcde12345",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:"${ diff --git a/test/bin/replacers.spec.ts b/test/bin/replacers.spec.ts index bb7d846a..a006c438 100644 --- a/test/bin/replacers.spec.ts +++ b/test/bin/replacers.spec.ts @@ -321,6 +321,46 @@ describe("js replacer - webpack", () => { expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); }); + + it("replaceImportsInJsCode_webpack - 2", () => { + const before = `"__esModule",{value:!0})}`; + const after = `function(){if("undefined"`; + + const jsCodeUntransformed = `${before},n.p="/foo-bar/",${after}`; + + 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 = `${before},n.p="/",${after}`; + + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + }); + + it("replaceImportsInJsCode_webpack - 3", () => { + const before = `"__esModule",{value:!0})}`; + const after = `function(){if("undefined"`; + + const jsCodeUntransformed = `${before},n.p="/foo/bar/",${after}`; + + 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 = `${before},n.p="/",${after}`; + + expect(isSameCode(fixedJsCode, fixedJsCodeExpected)).toBe(true); + }); }); describe("css replacer", () => { From 4c2e01a7a89da2060a45a04e0ad0cf9e88b65cc0 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 00:56:47 +0100 Subject: [PATCH 08/83] Done with implementation of webpack js replacer test case for support of non root base --- .../replaceImportsInJsCode/webpack.ts | 8 ++--- test/bin/replacers.spec.ts | 34 +++++++++++++++++++ 2 files changed, 38 insertions(+), 4 deletions(-) diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts index dcbefdf6..5d49cb77 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts @@ -29,18 +29,18 @@ export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOp ); } - // d={NODE_ENV:"production",PUBLIC_URL:"/abcde12345",WDS_SOCKET_HOST + // 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"` + // ... 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}",` + `NODE_ENV:"production",PUBLIC_URL:window.${nameOfTheGlobal}.url.resourcesPath+"/${basenameOfTheKeycloakifyResourcesDir}"` ); // Example: "static/ or "foo/bar/" diff --git a/test/bin/replacers.spec.ts b/test/bin/replacers.spec.ts index a006c438..d0dc1cb9 100644 --- a/test/bin/replacers.spec.ts +++ b/test/bin/replacers.spec.ts @@ -361,6 +361,40 @@ 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", () => { From 2799a52d0c22b53b54773084fd3fa811ac25121d Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 01:24:44 +0100 Subject: [PATCH 09/83] Implement router for js remplacer depending of the bundle (vite or webpack) --- .../replaceImportsInJsCode.ts | 66 +++++++++++++++++++ 1 file changed, 66 insertions(+) diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts index e69de29b..5ba54b5b 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts @@ -0,0 +1,66 @@ +import { assert } from "tsafe/assert"; +import type { BuildOptions } from "../../BuildOptions"; +import { replaceImportsInJsCode_vite } from "./vite"; +import { replaceImportsInJsCode_webpack } from "./webpack"; +import * as fs from "fs"; + +export type BuildOptionsLike = { + reactAppBuildDirPath: string; + assetsDirPath: string; + urlPathname: string | undefined; + bundler: "vite" | "webpack"; +}; + +assert(); + +export function replaceImportsInJsCode(params: { jsCode: string; buildOptions: BuildOptionsLike }) { + const { jsCode, buildOptions } = params; + + const { fixedJsCode } = (() => { + switch (buildOptions.bundler) { + case "vite": + return replaceImportsInJsCode_vite({ + jsCode, + buildOptions, + "basenameOfAssetsFiles": readAssetsDirSync({ + "assetsDirPath": params.buildOptions.assetsDirPath + }) + }); + case "webpack": + return replaceImportsInJsCode_webpack({ + jsCode, + buildOptions + }); + } + })(); + + return { fixedJsCode }; +} + +const { readAssetsDirSync } = (() => { + let cache: + | { + assetsDirPath: string; + basenameOfAssetsFiles: string[]; + } + | undefined = undefined; + + function readAssetsDirSync(params: { assetsDirPath: string }): string[] { + const { assetsDirPath } = params; + + if (cache !== undefined && cache.assetsDirPath === assetsDirPath) { + return cache.basenameOfAssetsFiles; + } + + const basenameOfAssetsFiles = fs.readdirSync(assetsDirPath); + + cache = { + assetsDirPath, + basenameOfAssetsFiles + }; + + return basenameOfAssetsFiles; + } + + return { readAssetsDirSync }; +})(); From 22fa1411bf92eef8b2faac1ca9dac649112b7c47 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 05:54:36 +0100 Subject: [PATCH 10/83] Moving on --- src/bin/keycloakify/BuildOptions.ts | 121 ++++++++---------- .../parsedKeycloakifyViteConfig.ts | 81 ++++++++---- src/bin/keycloakify/parsedPackageJson.ts | 2 +- src/bin/tools/getAbsoluteAndInOsFormatPath.ts | 2 + src/vite-plugin/vite-plugin.ts | 106 +++++++-------- 5 files changed, 166 insertions(+), 146 deletions(-) diff --git a/src/bin/keycloakify/BuildOptions.ts b/src/bin/keycloakify/BuildOptions.ts index e5f76d8f..2c537482 100644 --- a/src/bin/keycloakify/BuildOptions.ts +++ b/src/bin/keycloakify/BuildOptions.ts @@ -4,9 +4,11 @@ import { join as pathJoin } from "path"; import parseArgv from "minimist"; import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath"; import * as fs from "fs"; +import { getParsedKeycloakifyViteConfig, getKeycloakifyBuildDirPath } from "./parsedKeycloakifyViteConfig"; /** Consolidated build option gathered form CLI arguments and config in package.json */ export type BuildOptions = { + bundler: "vite" | "webpack"; isSilent: boolean; themeVersion: string; themeNames: string[]; @@ -25,113 +27,102 @@ export type BuildOptions = { * In this case the urlPathname will be "/my-app/" */ urlPathname: string | undefined; assetsDirPath: string; - bundler: "vite" | "webpack"; }; export function readBuildOptions(params: { reactAppRootDirPath: string; processArgv: string[] }): BuildOptions { const { reactAppRootDirPath, processArgv } = params; - const { isSilentCliParamProvided } = (() => { - const argv = parseArgv(processArgv); - - return { - "isSilentCliParamProvided": typeof argv["silent"] === "boolean" ? argv["silent"] : false - }; - })(); - const parsedPackageJson = getParsedPackageJson({ reactAppRootDirPath }); - const { name, keycloakify = {}, version, homepage } = parsedPackageJson; - - const { extraThemeProperties, groupId, artifactId, doCreateJar, loginThemeResourcesFromKeycloakVersion } = keycloakify ?? {}; + const { parsedKeycloakifyViteConfig } = + getParsedKeycloakifyViteConfig({ + "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": parsedPackageJson.keycloakify?.keycloakifyBuildDirPath, + reactAppRootDirPath + }) ?? {}; const themeNames = (() => { - if (keycloakify.themeName === undefined) { + if (parsedPackageJson.keycloakify?.themeName === undefined) { return [ - name + parsedPackageJson.name .replace(/^@(.*)/, "$1") .split("/") .join("-") ]; } - if (typeof keycloakify.themeName === "string") { - return [keycloakify.themeName]; + if (typeof parsedPackageJson.keycloakify.themeName === "string") { + return [parsedPackageJson.keycloakify.themeName]; } - return keycloakify.themeName; + return parsedPackageJson.keycloakify.themeName; })(); - return { + const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({ + "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": parsedPackageJson.keycloakify?.keycloakifyBuildDirPath, reactAppRootDirPath, + "bundler": parsedKeycloakifyViteConfig !== undefined ? "vite" : "webpack" + }); + //const keycloakifyBuildDirPath = keycloakifyBuildDirPath_vite ?? pathJoin(reactAppRootDirPath, "build_keycloak"); + + return { + "bundler": parsedKeycloakifyViteConfig !== undefined ? "vite" : "webpack", + "isSilent": (() => { + const argv = parseArgv(processArgv); + + return typeof argv["silent"] === "boolean" ? argv["silent"] : false; + })(), + "themeVersion": process.env.KEYCLOAKIFY_THEME_VERSION ?? parsedPackageJson.version ?? "0.0.0", themeNames, - "doCreateJar": doCreateJar ?? true, - "artifactId": process.env.KEYCLOAKIFY_ARTIFACT_ID ?? artifactId ?? `${themeNames[0]}-keycloak-theme`, + "extraThemeProperties": parsedPackageJson.keycloakify?.extraThemeProperties, "groupId": (() => { const fallbackGroupId = `${themeNames[0]}.keycloak`; return ( process.env.KEYCLOAKIFY_GROUP_ID ?? - groupId ?? - (!homepage + parsedPackageJson.keycloakify?.groupId ?? + (parsedPackageJson.homepage === undefined ? fallbackGroupId - : urlParse(homepage) + : urlParse(parsedPackageJson.homepage) .host?.replace(/:[0-9]+$/, "") ?.split(".") .reverse() .join(".") ?? fallbackGroupId) + ".keycloak" ); })(), - "themeVersion": process.env.KEYCLOAKIFY_THEME_VERSION ?? process.env.KEYCLOAKIFY_VERSION ?? version ?? "0.0.0", - extraThemeProperties, - "isSilent": isSilentCliParamProvided, - "loginThemeResourcesFromKeycloakVersion": loginThemeResourcesFromKeycloakVersion ?? "11.0.3", - "publicDirPath": (() => { - let { PUBLIC_DIR_PATH } = process.env; + "artifactId": process.env.KEYCLOAKIFY_ARTIFACT_ID ?? parsedPackageJson.keycloakify?.artifactId ?? `${themeNames[0]}-keycloak-theme`, + "doCreateJar": parsedPackageJson.keycloakify?.doCreateJar ?? true, + "loginThemeResourcesFromKeycloakVersion": parsedPackageJson.keycloakify?.loginThemeResourcesFromKeycloakVersion ?? "11.0.3", + reactAppRootDirPath, + "reactAppBuildDirPath": (() => { + if (parsedKeycloakifyViteConfig !== undefined) { + return pathJoin(reactAppRootDirPath, parsedKeycloakifyViteConfig.buildDir); + } - if (PUBLIC_DIR_PATH !== undefined) { + if (parsedPackageJson.keycloakify?.reactAppBuildDirPath !== undefined) { return getAbsoluteAndInOsFormatPath({ - "pathIsh": PUBLIC_DIR_PATH, + "pathIsh": parsedPackageJson.keycloakify?.reactAppBuildDirPath, + "cwd": reactAppRootDirPath + }); + } + + return pathJoin(reactAppRootDirPath, "build"); + })(), + + "publicDirPath": (() => { + if (parsedKeycloakifyViteConfig !== undefined) { + return parsedKeycloakifyViteConfig.publicDirPath; + } + + if (process.env.PUBLIC_DIR_PATH !== undefined) { + return getAbsoluteAndInOsFormatPath({ + "pathIsh": process.env.PUBLIC_DIR_PATH, "cwd": reactAppRootDirPath }); } return pathJoin(reactAppRootDirPath, "public"); })(), - "reactAppBuildDirPath": (() => { - const { reactAppBuildDirPath } = parsedPackageJson.keycloakify ?? {}; - - if (reactAppBuildDirPath !== undefined) { - return getAbsoluteAndInOsFormatPath({ - "pathIsh": reactAppBuildDirPath, - "cwd": reactAppRootDirPath - }); - } - - for (const name of ["build", "dist"]) { - const out = pathJoin(reactAppRootDirPath, name); - - if (!fs.existsSync(out)) { - continue; - } - - return out; - } - - throw new Error("Please use the reactAppBuildDirPath option to specify the build directory of your react app"); - })(), - "keycloakifyBuildDirPath": (() => { - const { keycloakifyBuildDirPath } = parsedPackageJson.keycloakify ?? {}; - - if (keycloakifyBuildDirPath !== undefined) { - return getAbsoluteAndInOsFormatPath({ - "pathIsh": keycloakifyBuildDirPath, - "cwd": reactAppRootDirPath - }); - } - - return pathJoin(reactAppRootDirPath, "build_keycloak"); - })(), + keycloakifyBuildDirPath, "cacheDirPath": pathJoin( (() => { let { XDG_CACHE_HOME } = process.env; diff --git a/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts b/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts index 504fb92e..1de01b06 100644 --- a/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts +++ b/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts @@ -5,20 +5,19 @@ import { z } from "zod"; import { pathJoin } from "../tools/pathJoin"; import { keycloakifyViteConfigJsonBasename } from "../constants"; import type { OptionalIfCanBeUndefined } from "../tools/OptionalIfCanBeUndefined"; +import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath"; export type ParsedKeycloakifyViteConfig = { - reactAppRootDirPath: string; - publicDirPath: string; - assetsDirPath: string; - reactAppBuildDirPath: string; + buildDir: string; + publicDir: string; + assetsDir: string; urlPathname: string | undefined; }; -export const zParsedKeycloakifyViteConfig = z.object({ - "reactAppRootDirPath": z.string(), - "publicDirPath": z.string(), - "assetsDirPath": z.string(), - "reactAppBuildDirPath": z.string(), +const zParsedKeycloakifyViteConfig = z.object({ + "buildDir": z.string(), + "publicDir": z.string(), + "assetsDir": z.string(), "urlPathname": z.string().optional() }); @@ -29,20 +28,33 @@ export const zParsedKeycloakifyViteConfig = z.object({ assert>(); } -let cache: { parsedKeycloakifyViteConfig: ParsedKeycloakifyViteConfig | undefined } | undefined = undefined; +export function getParsedKeycloakifyViteConfig(params: { + reactAppRootDirPath: string; + parsedPackageJson_keycloakify_keycloakifyBuildDirPath: string | undefined; +}): + | { + parsedKeycloakifyViteConfig: ParsedKeycloakifyViteConfig; + } + | undefined { + const { reactAppRootDirPath, parsedPackageJson_keycloakify_keycloakifyBuildDirPath } = params; -export function getParsedKeycloakifyViteConfig(params: { keycloakifyBuildDirPath: string }): ParsedKeycloakifyViteConfig | undefined { - const { keycloakifyBuildDirPath } = params; + const viteConfigTsFilePath = pathJoin(reactAppRootDirPath, "vite.config.ts"); - if (cache !== undefined) { - return cache.parsedKeycloakifyViteConfig; + if (!fs.existsSync(viteConfigTsFilePath)) { + return undefined; } + const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({ + reactAppRootDirPath, + parsedPackageJson_keycloakify_keycloakifyBuildDirPath, + "bundler": "vite" + }); + const parsedKeycloakifyViteConfig = (() => { const keycloakifyViteConfigJsonFilePath = pathJoin(keycloakifyBuildDirPath, keycloakifyViteConfigJsonBasename); if (!fs.existsSync(keycloakifyViteConfigJsonFilePath)) { - return undefined; + throw new Error("Missing Keycloakify Vite plugin output."); } let out: ParsedKeycloakifyViteConfig; @@ -69,11 +81,36 @@ export function getParsedKeycloakifyViteConfig(params: { keycloakifyBuildDirPath return out; })(); - if (parsedKeycloakifyViteConfig === undefined && fs.existsSync(pathJoin(keycloakifyBuildDirPath, "vite.config.ts"))) { - throw new Error("Make sure you have enabled the Keycloakiy plugin in your vite.config.ts"); - } - - cache = { parsedKeycloakifyViteConfig }; - - return parsedKeycloakifyViteConfig; + return { parsedKeycloakifyViteConfig }; +} + +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 }; } diff --git a/src/bin/keycloakify/parsedPackageJson.ts b/src/bin/keycloakify/parsedPackageJson.ts index d649adc5..52905de1 100644 --- a/src/bin/keycloakify/parsedPackageJson.ts +++ b/src/bin/keycloakify/parsedPackageJson.ts @@ -20,7 +20,7 @@ export type ParsedPackageJson = { }; }; -export const zParsedPackageJson = z.object({ +const zParsedPackageJson = z.object({ "name": z.string(), "version": z.string().optional(), "homepage": z.string().optional(), diff --git a/src/bin/tools/getAbsoluteAndInOsFormatPath.ts b/src/bin/tools/getAbsoluteAndInOsFormatPath.ts index 5b64edeb..dd686204 100644 --- a/src/bin/tools/getAbsoluteAndInOsFormatPath.ts +++ b/src/bin/tools/getAbsoluteAndInOsFormatPath.ts @@ -7,6 +7,8 @@ export function getAbsoluteAndInOsFormatPath(params: { pathIsh: string; cwd: str pathOut = pathOut.replace(/\//g, pathSep); + pathOut = pathOut.endsWith(pathSep) ? pathOut.slice(0, -1) : pathOut; + if (!pathIsAbsolute(pathOut)) { pathOut = pathJoin(cwd, pathOut); } diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index 3ac1c990..22a54b86 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -1,87 +1,75 @@ -import { join as pathJoin, sep as pathSep } from "path"; +import { join as pathJoin, relative as pathRelative, sep as pathSep } from "path"; import { getParsedPackageJson } from "../bin/keycloakify/parsedPackageJson"; import type { Plugin } from "vite"; import { assert } from "tsafe/assert"; -import { getAbsoluteAndInOsFormatPath } from "../bin/tools/getAbsoluteAndInOsFormatPath"; import * as fs from "fs"; import { keycloakifyViteConfigJsonBasename, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../bin/constants"; -import type { ParsedKeycloakifyViteConfig } from "../bin/keycloakify/parsedKeycloakifyViteConfig"; +import { type ParsedKeycloakifyViteConfig, getKeycloakifyBuildDirPath } from "../bin/keycloakify/parsedKeycloakifyViteConfig"; import { replaceAll } from "../bin/tools/String.prototype.replaceAll"; +import { id } from "tsafe/id"; export function keycloakify(): Plugin { - let keycloakifyViteConfig: ParsedKeycloakifyViteConfig | undefined = undefined; + let reactAppRootDirPath: string | undefined = undefined; + let urlPathname: string | undefined = undefined; return { "name": "keycloakify", "configResolved": resolvedConfig => { - const reactAppRootDirPath = resolvedConfig.root; - const reactAppBuildDirPath = pathJoin(reactAppRootDirPath, resolvedConfig.build.outDir); + reactAppRootDirPath = resolvedConfig.root; + urlPathname = (() => { + let out = resolvedConfig.env.BASE_URL; - keycloakifyViteConfig = { - reactAppRootDirPath, - "publicDirPath": resolvedConfig.publicDir, - "assetsDirPath": pathJoin(reactAppBuildDirPath, resolvedConfig.build.assetsDir), - reactAppBuildDirPath, - "urlPathname": (() => { - let out = resolvedConfig.env.BASE_URL; - - if (out === undefined) { - return undefined; - } - - if (!out.startsWith("/")) { - out = "/" + out; - } - - if (!out.endsWith("/")) { - out += "/"; - } - - return out; - })() - }; - - const parsedPackageJson = getParsedPackageJson({ reactAppRootDirPath }); - - if (parsedPackageJson.keycloakify?.reactAppBuildDirPath !== undefined) { - throw new Error( - [ - "Please do not use the keycloakify.reactAppBuildDirPath option in your package.json.", - "In Vite setups it's inferred automatically from the vite config." - ].join(" ") - ); - } - - const keycloakifyBuildDirPath = (() => { - const { keycloakifyBuildDirPath } = parsedPackageJson.keycloakify ?? {}; - - if (keycloakifyBuildDirPath !== undefined) { - return getAbsoluteAndInOsFormatPath({ - "pathIsh": keycloakifyBuildDirPath, - "cwd": reactAppRootDirPath - }); + if (out === undefined) { + return undefined; } - return pathJoin(reactAppRootDirPath, "build_keycloak"); + if (!out.startsWith("/")) { + out = "/" + out; + } + + if (!out.endsWith("/")) { + out += "/"; + } + + return out; })(); + const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({ + "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": getParsedPackageJson({ reactAppRootDirPath }).keycloakify + ?.keycloakifyBuildDirPath, + reactAppRootDirPath, + "bundler": "vite" + }); + if (!fs.existsSync(keycloakifyBuildDirPath)) { fs.mkdirSync(keycloakifyBuildDirPath); } fs.writeFileSync( pathJoin(keycloakifyBuildDirPath, keycloakifyViteConfigJsonBasename), - Buffer.from(JSON.stringify(keycloakifyViteConfig, null, 2), "utf8") + Buffer.from( + JSON.stringify( + id({ + "publicDir": pathRelative(reactAppRootDirPath, resolvedConfig.publicDir), + "assetsDir": resolvedConfig.build.assetsDir, + "buildDir": resolvedConfig.build.outDir, + urlPathname + }), + null, + 2 + ), + "utf8" + ) ); }, "transform": (code, id) => { - assert(keycloakifyViteConfig !== undefined); + assert(reactAppRootDirPath !== undefined); let transformedCode: string | undefined = undefined; replace_import_meta_env_base_url_in_source_code: { { - const isWithinSourceDirectory = id.startsWith(pathJoin(keycloakifyViteConfig.publicDirPath, "src") + pathSep); + const isWithinSourceDirectory = id.startsWith(pathJoin(reactAppRootDirPath, "src") + pathSep); if (!isWithinSourceDirectory) { break replace_import_meta_env_base_url_in_source_code; @@ -110,18 +98,20 @@ export function keycloakify(): Plugin { [ `(`, `(${windowToken}.${nameOfTheGlobal} === undefined || import.meta.env.MODE === "development") ?`, - ` "${keycloakifyViteConfig.urlPathname ?? "/"}" :`, + ` "${urlPathname ?? "/"}" :`, ` \`\${${windowToken}.${nameOfTheGlobal}.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/\``, `)` ].join("") ); } - if (transformedCode !== undefined) { - return { - "code": transformedCode - }; + if (transformedCode === undefined) { + return; } + + return { + "code": transformedCode + }; } }; } From 8b24e23721f423899d4b73a2d2e53838a0a79297 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 06:04:05 +0100 Subject: [PATCH 11/83] refactor --- src/bin/constants.ts | 2 +- src/bin/keycloakify/BuildOptions.ts | 19 ++++++------- ...ifyViteConfig.ts => resolvedViteConfig.ts} | 28 +++++++++---------- src/vite-plugin/vite-plugin.ts | 8 +++--- 4 files changed, 28 insertions(+), 29 deletions(-) rename src/bin/keycloakify/{parsedKeycloakifyViteConfig.ts => resolvedViteConfig.ts} (75%) diff --git a/src/bin/constants.ts b/src/bin/constants.ts index 91694c3f..a3ab98e3 100644 --- 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 keycloakifyViteConfigJsonBasename = ".keycloakifyViteConfig.json"; +export const resolvedViteConfigJsonBasename = ".keycloakifyViteConfig.json"; export const basenameOfTheKeycloakifyResourcesDir = "build"; export const themeTypes = ["login", "account"] as const; diff --git a/src/bin/keycloakify/BuildOptions.ts b/src/bin/keycloakify/BuildOptions.ts index 2c537482..0ff6268d 100644 --- a/src/bin/keycloakify/BuildOptions.ts +++ b/src/bin/keycloakify/BuildOptions.ts @@ -3,8 +3,7 @@ import { getParsedPackageJson } from "./parsedPackageJson"; import { join as pathJoin } from "path"; import parseArgv from "minimist"; import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath"; -import * as fs from "fs"; -import { getParsedKeycloakifyViteConfig, getKeycloakifyBuildDirPath } from "./parsedKeycloakifyViteConfig"; +import { readResolvedViteConfig, getKeycloakifyBuildDirPath } from "./resolvedViteConfig"; /** Consolidated build option gathered form CLI arguments and config in package.json */ export type BuildOptions = { @@ -34,8 +33,8 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA const parsedPackageJson = getParsedPackageJson({ reactAppRootDirPath }); - const { parsedKeycloakifyViteConfig } = - getParsedKeycloakifyViteConfig({ + const { resolvedViteConfig } = + readResolvedViteConfig({ "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": parsedPackageJson.keycloakify?.keycloakifyBuildDirPath, reactAppRootDirPath }) ?? {}; @@ -60,12 +59,12 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({ "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": parsedPackageJson.keycloakify?.keycloakifyBuildDirPath, reactAppRootDirPath, - "bundler": parsedKeycloakifyViteConfig !== undefined ? "vite" : "webpack" + "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack" }); //const keycloakifyBuildDirPath = keycloakifyBuildDirPath_vite ?? pathJoin(reactAppRootDirPath, "build_keycloak"); return { - "bundler": parsedKeycloakifyViteConfig !== undefined ? "vite" : "webpack", + "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack", "isSilent": (() => { const argv = parseArgv(processArgv); @@ -94,8 +93,8 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA "loginThemeResourcesFromKeycloakVersion": parsedPackageJson.keycloakify?.loginThemeResourcesFromKeycloakVersion ?? "11.0.3", reactAppRootDirPath, "reactAppBuildDirPath": (() => { - if (parsedKeycloakifyViteConfig !== undefined) { - return pathJoin(reactAppRootDirPath, parsedKeycloakifyViteConfig.buildDir); + if (resolvedViteConfig !== undefined) { + return pathJoin(reactAppRootDirPath, resolvedViteConfig.buildDir); } if (parsedPackageJson.keycloakify?.reactAppBuildDirPath !== undefined) { @@ -109,8 +108,8 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA })(), "publicDirPath": (() => { - if (parsedKeycloakifyViteConfig !== undefined) { - return parsedKeycloakifyViteConfig.publicDirPath; + if (resolvedViteConfig !== undefined) { + return resolvedViteConfig.publicDirPath; } if (process.env.PUBLIC_DIR_PATH !== undefined) { diff --git a/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts b/src/bin/keycloakify/resolvedViteConfig.ts similarity index 75% rename from src/bin/keycloakify/parsedKeycloakifyViteConfig.ts rename to src/bin/keycloakify/resolvedViteConfig.ts index 1de01b06..4f422909 100644 --- a/src/bin/keycloakify/parsedKeycloakifyViteConfig.ts +++ b/src/bin/keycloakify/resolvedViteConfig.ts @@ -3,18 +3,18 @@ import { assert } from "tsafe"; import type { Equals } from "tsafe"; import { z } from "zod"; import { pathJoin } from "../tools/pathJoin"; -import { keycloakifyViteConfigJsonBasename } from "../constants"; +import { resolvedViteConfigJsonBasename } from "../constants"; import type { OptionalIfCanBeUndefined } from "../tools/OptionalIfCanBeUndefined"; import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath"; -export type ParsedKeycloakifyViteConfig = { +export type ResolvedViteConfig = { buildDir: string; publicDir: string; assetsDir: string; urlPathname: string | undefined; }; -const zParsedKeycloakifyViteConfig = z.object({ +const zResolvedViteConfig = z.object({ "buildDir": z.string(), "publicDir": z.string(), "assetsDir": z.string(), @@ -22,18 +22,18 @@ const zParsedKeycloakifyViteConfig = z.object({ }); { - type Got = ReturnType<(typeof zParsedKeycloakifyViteConfig)["parse"]>; - type Expected = OptionalIfCanBeUndefined; + type Got = ReturnType<(typeof zResolvedViteConfig)["parse"]>; + type Expected = OptionalIfCanBeUndefined; assert>(); } -export function getParsedKeycloakifyViteConfig(params: { +export function readResolvedViteConfig(params: { reactAppRootDirPath: string; parsedPackageJson_keycloakify_keycloakifyBuildDirPath: string | undefined; }): | { - parsedKeycloakifyViteConfig: ParsedKeycloakifyViteConfig; + resolvedViteConfig: ResolvedViteConfig; } | undefined { const { reactAppRootDirPath, parsedPackageJson_keycloakify_keycloakifyBuildDirPath } = params; @@ -50,23 +50,23 @@ export function getParsedKeycloakifyViteConfig(params: { "bundler": "vite" }); - const parsedKeycloakifyViteConfig = (() => { - const keycloakifyViteConfigJsonFilePath = pathJoin(keycloakifyBuildDirPath, keycloakifyViteConfigJsonBasename); + const resolvedViteConfig = (() => { + const resolvedViteConfigJsonFilePath = pathJoin(keycloakifyBuildDirPath, resolvedViteConfigJsonBasename); - if (!fs.existsSync(keycloakifyViteConfigJsonFilePath)) { + if (!fs.existsSync(resolvedViteConfigJsonFilePath)) { throw new Error("Missing Keycloakify Vite plugin output."); } - let out: ParsedKeycloakifyViteConfig; + let out: ResolvedViteConfig; try { - out = JSON.parse(fs.readFileSync(keycloakifyViteConfigJsonFilePath).toString("utf8")); + out = JSON.parse(fs.readFileSync(resolvedViteConfigJsonFilePath).toString("utf8")); } catch { throw new Error("The output of the Keycloakify Vite plugin is not a valid JSON."); } try { - const zodParseReturn = zParsedKeycloakifyViteConfig.parse(out); + const zodParseReturn = zResolvedViteConfig.parse(out); // So that objectKeys from tsafe return the expected result no matter what. Object.keys(zodParseReturn) @@ -81,7 +81,7 @@ export function getParsedKeycloakifyViteConfig(params: { return out; })(); - return { parsedKeycloakifyViteConfig }; + return { resolvedViteConfig }; } export function getKeycloakifyBuildDirPath(params: { diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index 22a54b86..5fb033d9 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -3,8 +3,8 @@ import { getParsedPackageJson } from "../bin/keycloakify/parsedPackageJson"; import type { Plugin } from "vite"; import { assert } from "tsafe/assert"; import * as fs from "fs"; -import { keycloakifyViteConfigJsonBasename, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../bin/constants"; -import { type ParsedKeycloakifyViteConfig, getKeycloakifyBuildDirPath } from "../bin/keycloakify/parsedKeycloakifyViteConfig"; +import { resolvedViteConfigJsonBasename, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../bin/constants"; +import { type ResolvedViteConfig, getKeycloakifyBuildDirPath } from "../bin/keycloakify/resolvedViteConfig"; import { replaceAll } from "../bin/tools/String.prototype.replaceAll"; import { id } from "tsafe/id"; @@ -46,10 +46,10 @@ export function keycloakify(): Plugin { } fs.writeFileSync( - pathJoin(keycloakifyBuildDirPath, keycloakifyViteConfigJsonBasename), + pathJoin(keycloakifyBuildDirPath, resolvedViteConfigJsonBasename), Buffer.from( JSON.stringify( - id({ + id({ "publicDir": pathRelative(reactAppRootDirPath, resolvedConfig.publicDir), "assetsDir": resolvedConfig.build.assetsDir, "buildDir": resolvedConfig.build.outDir, From cd278f4ab53a2b91c3f259be5290d4ea68a6f291 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 06:37:49 +0100 Subject: [PATCH 12/83] Refactor --- src/bin/copy-keycloak-resources-to-public.ts | 2 +- src/bin/download-builtin-keycloak-theme.ts | 3 +-- src/bin/eject-keycloak-page.ts | 2 +- src/bin/{getSrcDirPath.ts => getThemeSrcDirPath.ts} | 0 src/bin/initialize-email-theme.ts | 4 ++-- .../{BuildOptions.ts => buildOptions2/buildOptions2.ts} | 2 +- src/bin/keycloakify/buildOptions2/index.ts | 1 + .../keycloakify/{ => buildOptions2}/parsedPackageJson.ts | 2 +- .../keycloakify/{ => buildOptions2}/resolvedViteConfig.ts | 8 ++++---- src/bin/keycloakify/ftlValuesGlobalName.ts | 0 src/bin/keycloakify/generateFtl/generateFtl.ts | 2 +- .../generateJavaStackFiles/bringInAccountV1.ts | 2 +- .../generateJavaStackFiles/generateJavaStackFiles.ts | 2 +- .../keycloakify/generateStartKeycloakTestingContainer.ts | 2 +- .../generateTheme/downloadKeycloakStaticResources.ts | 2 +- src/bin/keycloakify/generateTheme/generateTheme.ts | 2 +- src/bin/keycloakify/keycloakify.ts | 4 ++-- src/bin/keycloakify/replacers/replaceImportsInCssCode.ts | 2 +- .../replacers/replaceImportsInInlineCssCode.ts | 2 +- .../replaceImportsInJsCode/replaceImportsInJsCode.ts | 2 +- .../keycloakify/replacers/replaceImportsInJsCode/vite.ts | 2 +- .../replacers/replaceImportsInJsCode/webpack.ts | 2 +- 22 files changed, 25 insertions(+), 25 deletions(-) rename src/bin/{getSrcDirPath.ts => getThemeSrcDirPath.ts} (100%) rename src/bin/keycloakify/{BuildOptions.ts => buildOptions2/buildOptions2.ts} (98%) create mode 100644 src/bin/keycloakify/buildOptions2/index.ts rename src/bin/keycloakify/{ => buildOptions2}/parsedPackageJson.ts (97%) rename src/bin/keycloakify/{ => buildOptions2}/resolvedViteConfig.ts (92%) delete mode 100644 src/bin/keycloakify/ftlValuesGlobalName.ts diff --git a/src/bin/copy-keycloak-resources-to-public.ts b/src/bin/copy-keycloak-resources-to-public.ts index f90e2fd1..939c3239 100644 --- a/src/bin/copy-keycloak-resources-to-public.ts +++ b/src/bin/copy-keycloak-resources-to-public.ts @@ -2,7 +2,7 @@ import { downloadKeycloakStaticResources } from "./keycloakify/generateTheme/downloadKeycloakStaticResources"; import { join as pathJoin, relative as pathRelative } from "path"; -import { readBuildOptions } from "./keycloakify/BuildOptions"; +import { readBuildOptions } from "./keycloakify/buildOptions2"; import { themeTypes, keycloak_resources, lastKeycloakVersionWithAccountV1 } from "./constants"; import * as fs from "fs"; diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index ab257e92..2bb68c72 100644 --- a/src/bin/download-builtin-keycloak-theme.ts +++ b/src/bin/download-builtin-keycloak-theme.ts @@ -3,9 +3,8 @@ import { join as pathJoin } from "path"; import { downloadAndUnzip } from "./tools/downloadAndUnzip"; import { promptKeycloakVersion } from "./promptKeycloakVersion"; import { getLogger } from "./tools/logger"; -import { readBuildOptions } from "./keycloakify/BuildOptions"; +import { readBuildOptions, type BuildOptions } from "./keycloakify/buildOptions2"; import { assert } from "tsafe/assert"; -import type { BuildOptions } from "./keycloakify/BuildOptions"; import * as child_process from "child_process"; import * as fs from "fs"; diff --git a/src/bin/eject-keycloak-page.ts b/src/bin/eject-keycloak-page.ts index e82ff9c7..71d70483 100644 --- a/src/bin/eject-keycloak-page.ts +++ b/src/bin/eject-keycloak-page.ts @@ -9,7 +9,7 @@ import { existsSync } from "fs"; import { join as pathJoin, relative as pathRelative } from "path"; import { kebabCaseToCamelCase } from "./tools/kebabCaseToSnakeCase"; import { assert, Equals } from "tsafe/assert"; -import { getThemeSrcDirPath } from "./getSrcDirPath"; +import { getThemeSrcDirPath } from "./getThemeSrcDirPath"; import { themeTypes, type ThemeType } from "./constants"; (async () => { diff --git a/src/bin/getSrcDirPath.ts b/src/bin/getThemeSrcDirPath.ts similarity index 100% rename from src/bin/getSrcDirPath.ts rename to src/bin/getThemeSrcDirPath.ts diff --git a/src/bin/initialize-email-theme.ts b/src/bin/initialize-email-theme.ts index 14f44d6e..165add5d 100644 --- a/src/bin/initialize-email-theme.ts +++ b/src/bin/initialize-email-theme.ts @@ -4,10 +4,10 @@ import { downloadBuiltinKeycloakTheme } from "./download-builtin-keycloak-theme" import { join as pathJoin, relative as pathRelative } from "path"; import { transformCodebase } from "./tools/transformCodebase"; import { promptKeycloakVersion } from "./promptKeycloakVersion"; -import { readBuildOptions } from "./keycloakify/BuildOptions"; +import { readBuildOptions } from "./keycloakify/buildOptions2"; import * as fs from "fs"; import { getLogger } from "./tools/logger"; -import { getThemeSrcDirPath } from "./getSrcDirPath"; +import { getThemeSrcDirPath } from "./getThemeSrcDirPath"; export async function main() { const reactAppRootDirPath = process.cwd(); diff --git a/src/bin/keycloakify/BuildOptions.ts b/src/bin/keycloakify/buildOptions2/buildOptions2.ts similarity index 98% rename from src/bin/keycloakify/BuildOptions.ts rename to src/bin/keycloakify/buildOptions2/buildOptions2.ts index 0ff6268d..3de46600 100644 --- a/src/bin/keycloakify/BuildOptions.ts +++ b/src/bin/keycloakify/buildOptions2/buildOptions2.ts @@ -2,7 +2,7 @@ import { parse as urlParse } from "url"; import { getParsedPackageJson } from "./parsedPackageJson"; import { join as pathJoin } from "path"; import parseArgv from "minimist"; -import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath"; +import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath"; import { readResolvedViteConfig, getKeycloakifyBuildDirPath } from "./resolvedViteConfig"; /** Consolidated build option gathered form CLI arguments and config in package.json */ diff --git a/src/bin/keycloakify/buildOptions2/index.ts b/src/bin/keycloakify/buildOptions2/index.ts new file mode 100644 index 00000000..ff784b36 --- /dev/null +++ b/src/bin/keycloakify/buildOptions2/index.ts @@ -0,0 +1 @@ +export * from "./buildOptions2"; diff --git a/src/bin/keycloakify/parsedPackageJson.ts b/src/bin/keycloakify/buildOptions2/parsedPackageJson.ts similarity index 97% rename from src/bin/keycloakify/parsedPackageJson.ts rename to src/bin/keycloakify/buildOptions2/parsedPackageJson.ts index 52905de1..59308e48 100644 --- a/src/bin/keycloakify/parsedPackageJson.ts +++ b/src/bin/keycloakify/buildOptions2/parsedPackageJson.ts @@ -2,7 +2,7 @@ import * as fs from "fs"; import { assert } from "tsafe"; import type { Equals } from "tsafe"; import { z } from "zod"; -import { pathJoin } from "../tools/pathJoin"; +import { join as pathJoin } from "path"; export type ParsedPackageJson = { name: string; diff --git a/src/bin/keycloakify/resolvedViteConfig.ts b/src/bin/keycloakify/buildOptions2/resolvedViteConfig.ts similarity index 92% rename from src/bin/keycloakify/resolvedViteConfig.ts rename to src/bin/keycloakify/buildOptions2/resolvedViteConfig.ts index 4f422909..7f62b92a 100644 --- a/src/bin/keycloakify/resolvedViteConfig.ts +++ b/src/bin/keycloakify/buildOptions2/resolvedViteConfig.ts @@ -2,10 +2,10 @@ import * as fs from "fs"; import { assert } from "tsafe"; import type { Equals } from "tsafe"; import { z } from "zod"; -import { pathJoin } from "../tools/pathJoin"; -import { resolvedViteConfigJsonBasename } from "../constants"; -import type { OptionalIfCanBeUndefined } from "../tools/OptionalIfCanBeUndefined"; -import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath"; +import { join as pathJoin } from "path"; +import { resolvedViteConfigJsonBasename } from "../../constants"; +import type { OptionalIfCanBeUndefined } from "../../tools/OptionalIfCanBeUndefined"; +import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath"; export type ResolvedViteConfig = { buildDir: string; diff --git a/src/bin/keycloakify/ftlValuesGlobalName.ts b/src/bin/keycloakify/ftlValuesGlobalName.ts deleted file mode 100644 index e69de29b..00000000 diff --git a/src/bin/keycloakify/generateFtl/generateFtl.ts b/src/bin/keycloakify/generateFtl/generateFtl.ts index 04392ed6..15be1210 100644 --- a/src/bin/keycloakify/generateFtl/generateFtl.ts +++ b/src/bin/keycloakify/generateFtl/generateFtl.ts @@ -5,7 +5,7 @@ import { replaceImportsInInlineCssCode } from "../replacers/replaceImportsInInli import * as fs from "fs"; import { join as pathJoin } from "path"; import { objectKeys } from "tsafe/objectKeys"; -import type { BuildOptions } from "../BuildOptions"; +import type { BuildOptions } from "../buildOptions2"; import { assert } from "tsafe/assert"; import { type ThemeType, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../constants"; diff --git a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts index 4b8c26ea..2d65df7c 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts @@ -2,7 +2,7 @@ import * as fs from "fs"; import { join as pathJoin, dirname as pathDirname } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; -import type { BuildOptions } from "../BuildOptions"; +import type { BuildOptions } from "../buildOptions2"; import { resources_common, lastKeycloakVersionWithAccountV1, accountV1ThemeName } from "../../constants"; import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme"; import { transformCodebase } from "../../tools/transformCodebase"; diff --git a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts index a8d781f7..48709155 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts @@ -2,7 +2,7 @@ import * as fs from "fs"; import { join as pathJoin, dirname as pathDirname } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; -import type { BuildOptions } from "../BuildOptions"; +import type { BuildOptions } from "../buildOptions2"; import { type ThemeType, accountV1ThemeName } from "../../constants"; import { bringInAccountV1 } from "./bringInAccountV1"; diff --git a/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts b/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts index a14bfe49..9c5702c1 100644 --- a/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts +++ b/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts @@ -2,7 +2,7 @@ import * as fs from "fs"; import { join as pathJoin, relative as pathRelative, basename as pathBasename } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; -import type { BuildOptions } from "./BuildOptions"; +import type { BuildOptions } from "./buildOptions2"; export type BuildOptionsLike = { keycloakifyBuildDirPath: string; diff --git a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts index 7a4f128e..0680e23c 100644 --- a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts +++ b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts @@ -3,7 +3,7 @@ import * as fs from "fs"; import { join as pathJoin, dirname as pathDirname } from "path"; import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme"; import { resources_common, type ThemeType } from "../../constants"; -import { BuildOptions } from "../BuildOptions"; +import { BuildOptions } from "../buildOptions2"; import { assert } from "tsafe/assert"; import * as crypto from "crypto"; diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index 761d8aad..74f22a63 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -13,7 +13,7 @@ import { basenameOfTheKeycloakifyResourcesDir } from "../../constants"; import { isInside } from "../../tools/isInside"; -import type { BuildOptions } from "../BuildOptions"; +import type { BuildOptions } from "../buildOptions2"; import { assert, type Equals } from "tsafe/assert"; import { downloadKeycloakStaticResources } from "./downloadKeycloakStaticResources"; import { readFieldNameUsage } from "./readFieldNameUsage"; diff --git a/src/bin/keycloakify/keycloakify.ts b/src/bin/keycloakify/keycloakify.ts index 3fd541e0..a9c66c14 100644 --- a/src/bin/keycloakify/keycloakify.ts +++ b/src/bin/keycloakify/keycloakify.ts @@ -4,10 +4,10 @@ import { join as pathJoin, relative as pathRelative, basename as pathBasename, d import * as child_process from "child_process"; import { generateStartKeycloakTestingContainer } from "./generateStartKeycloakTestingContainer"; import * as fs from "fs"; -import { readBuildOptions } from "./BuildOptions"; +import { readBuildOptions } from "./buildOptions2"; import { getLogger } from "../tools/logger"; import { assert } from "tsafe/assert"; -import { getThemeSrcDirPath } from "../getSrcDirPath"; +import { getThemeSrcDirPath } from "../getThemeSrcDirPath"; import { getProjectRoot } from "../tools/getProjectRoot"; import { objectKeys } from "tsafe/objectKeys"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts b/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts index 3cf192a4..6d592bd2 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts @@ -1,5 +1,5 @@ import * as crypto from "crypto"; -import type { BuildOptions } from "../BuildOptions"; +import type { BuildOptions } from "../buildOptions2"; import { assert } from "tsafe/assert"; import { basenameOfTheKeycloakifyResourcesDir } from "../../constants"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts b/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts index e8e980bd..9ec2c2c4 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts @@ -1,4 +1,4 @@ -import type { BuildOptions } from "../BuildOptions"; +import type { BuildOptions } from "../buildOptions2"; import { assert } from "tsafe/assert"; import { basenameOfTheKeycloakifyResourcesDir } from "../../constants"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts index 5ba54b5b..6590a2f2 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts @@ -1,5 +1,5 @@ import { assert } from "tsafe/assert"; -import type { BuildOptions } from "../../BuildOptions"; +import type { BuildOptions } from "../../buildOptions2"; import { replaceImportsInJsCode_vite } from "./vite"; import { replaceImportsInJsCode_webpack } from "./webpack"; import * as fs from "fs"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts index 4d53fc65..18863040 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts @@ -1,6 +1,6 @@ import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants"; import { assert } from "tsafe/assert"; -import type { BuildOptions } from "../../BuildOptions"; +import type { BuildOptions } from "../../buildOptions2"; import * as nodePath from "path"; import { replaceAll } from "../../../tools/String.prototype.replaceAll"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts index 5d49cb77..ca5fcf2f 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts @@ -1,6 +1,6 @@ import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants"; import { assert } from "tsafe/assert"; -import type { BuildOptions } from "../../BuildOptions"; +import type { BuildOptions } from "../../buildOptions2"; import * as nodePath from "path"; import { replaceAll } from "../../../tools/String.prototype.replaceAll"; From 5a57bb59e5f2a447d94bad396e507de6c753bbf8 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 06:38:26 +0100 Subject: [PATCH 13/83] Refactor --- src/bin/copy-keycloak-resources-to-public.ts | 2 +- src/bin/download-builtin-keycloak-theme.ts | 2 +- src/bin/initialize-email-theme.ts | 2 +- .../buildOptions2.ts => buildOptions/buildOptions.ts} | 0 src/bin/keycloakify/{buildOptions2 => buildOptions}/index.ts | 0 .../{buildOptions2 => buildOptions}/parsedPackageJson.ts | 0 .../{buildOptions2 => buildOptions}/resolvedViteConfig.ts | 0 src/bin/keycloakify/generateFtl/generateFtl.ts | 2 +- src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts | 2 +- .../generateJavaStackFiles/generateJavaStackFiles.ts | 2 +- src/bin/keycloakify/generateStartKeycloakTestingContainer.ts | 2 +- .../generateTheme/downloadKeycloakStaticResources.ts | 2 +- src/bin/keycloakify/generateTheme/generateTheme.ts | 2 +- src/bin/keycloakify/keycloakify.ts | 2 +- src/bin/keycloakify/replacers/replaceImportsInCssCode.ts | 2 +- src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts | 2 +- .../replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts | 2 +- src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts | 2 +- src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts | 2 +- 19 files changed, 15 insertions(+), 15 deletions(-) rename src/bin/keycloakify/{buildOptions2/buildOptions2.ts => buildOptions/buildOptions.ts} (100%) rename src/bin/keycloakify/{buildOptions2 => buildOptions}/index.ts (100%) rename src/bin/keycloakify/{buildOptions2 => buildOptions}/parsedPackageJson.ts (100%) rename src/bin/keycloakify/{buildOptions2 => buildOptions}/resolvedViteConfig.ts (100%) diff --git a/src/bin/copy-keycloak-resources-to-public.ts b/src/bin/copy-keycloak-resources-to-public.ts index 939c3239..78daf92d 100644 --- a/src/bin/copy-keycloak-resources-to-public.ts +++ b/src/bin/copy-keycloak-resources-to-public.ts @@ -2,7 +2,7 @@ import { downloadKeycloakStaticResources } from "./keycloakify/generateTheme/downloadKeycloakStaticResources"; import { join as pathJoin, relative as pathRelative } from "path"; -import { readBuildOptions } from "./keycloakify/buildOptions2"; +import { readBuildOptions } from "./keycloakify/buildOptions"; import { themeTypes, keycloak_resources, lastKeycloakVersionWithAccountV1 } from "./constants"; import * as fs from "fs"; diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index 2bb68c72..8cf9d600 100644 --- a/src/bin/download-builtin-keycloak-theme.ts +++ b/src/bin/download-builtin-keycloak-theme.ts @@ -3,7 +3,7 @@ import { join as pathJoin } from "path"; import { downloadAndUnzip } from "./tools/downloadAndUnzip"; import { promptKeycloakVersion } from "./promptKeycloakVersion"; import { getLogger } from "./tools/logger"; -import { readBuildOptions, type BuildOptions } from "./keycloakify/buildOptions2"; +import { readBuildOptions, type BuildOptions } from "./keycloakify/buildOptions"; import { assert } from "tsafe/assert"; import * as child_process from "child_process"; import * as fs from "fs"; diff --git a/src/bin/initialize-email-theme.ts b/src/bin/initialize-email-theme.ts index 165add5d..b4afdacc 100644 --- a/src/bin/initialize-email-theme.ts +++ b/src/bin/initialize-email-theme.ts @@ -4,7 +4,7 @@ import { downloadBuiltinKeycloakTheme } from "./download-builtin-keycloak-theme" import { join as pathJoin, relative as pathRelative } from "path"; import { transformCodebase } from "./tools/transformCodebase"; import { promptKeycloakVersion } from "./promptKeycloakVersion"; -import { readBuildOptions } from "./keycloakify/buildOptions2"; +import { readBuildOptions } from "./keycloakify/buildOptions"; import * as fs from "fs"; import { getLogger } from "./tools/logger"; import { getThemeSrcDirPath } from "./getThemeSrcDirPath"; diff --git a/src/bin/keycloakify/buildOptions2/buildOptions2.ts b/src/bin/keycloakify/buildOptions/buildOptions.ts similarity index 100% rename from src/bin/keycloakify/buildOptions2/buildOptions2.ts rename to src/bin/keycloakify/buildOptions/buildOptions.ts diff --git a/src/bin/keycloakify/buildOptions2/index.ts b/src/bin/keycloakify/buildOptions/index.ts similarity index 100% rename from src/bin/keycloakify/buildOptions2/index.ts rename to src/bin/keycloakify/buildOptions/index.ts diff --git a/src/bin/keycloakify/buildOptions2/parsedPackageJson.ts b/src/bin/keycloakify/buildOptions/parsedPackageJson.ts similarity index 100% rename from src/bin/keycloakify/buildOptions2/parsedPackageJson.ts rename to src/bin/keycloakify/buildOptions/parsedPackageJson.ts diff --git a/src/bin/keycloakify/buildOptions2/resolvedViteConfig.ts b/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts similarity index 100% rename from src/bin/keycloakify/buildOptions2/resolvedViteConfig.ts rename to src/bin/keycloakify/buildOptions/resolvedViteConfig.ts diff --git a/src/bin/keycloakify/generateFtl/generateFtl.ts b/src/bin/keycloakify/generateFtl/generateFtl.ts index 15be1210..00b61e5f 100644 --- a/src/bin/keycloakify/generateFtl/generateFtl.ts +++ b/src/bin/keycloakify/generateFtl/generateFtl.ts @@ -5,7 +5,7 @@ import { replaceImportsInInlineCssCode } from "../replacers/replaceImportsInInli import * as fs from "fs"; import { join as pathJoin } from "path"; import { objectKeys } from "tsafe/objectKeys"; -import type { BuildOptions } from "../buildOptions2"; +import type { BuildOptions } from "../buildOptions"; import { assert } from "tsafe/assert"; import { type ThemeType, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../constants"; diff --git a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts index 2d65df7c..9ee96110 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts @@ -2,7 +2,7 @@ import * as fs from "fs"; import { join as pathJoin, dirname as pathDirname } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; -import type { BuildOptions } from "../buildOptions2"; +import type { BuildOptions } from "../buildOptions"; import { resources_common, lastKeycloakVersionWithAccountV1, accountV1ThemeName } from "../../constants"; import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme"; import { transformCodebase } from "../../tools/transformCodebase"; diff --git a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts index 48709155..d31e056f 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts @@ -2,7 +2,7 @@ import * as fs from "fs"; import { join as pathJoin, dirname as pathDirname } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; -import type { BuildOptions } from "../buildOptions2"; +import type { BuildOptions } from "../buildOptions"; import { type ThemeType, accountV1ThemeName } from "../../constants"; import { bringInAccountV1 } from "./bringInAccountV1"; diff --git a/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts b/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts index 9c5702c1..e3fbda9d 100644 --- a/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts +++ b/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts @@ -2,7 +2,7 @@ import * as fs from "fs"; import { join as pathJoin, relative as pathRelative, basename as pathBasename } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; -import type { BuildOptions } from "./buildOptions2"; +import type { BuildOptions } from "./buildOptions"; export type BuildOptionsLike = { keycloakifyBuildDirPath: string; diff --git a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts index 0680e23c..3e0bd985 100644 --- a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts +++ b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts @@ -3,7 +3,7 @@ import * as fs from "fs"; import { join as pathJoin, dirname as pathDirname } from "path"; import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme"; import { resources_common, type ThemeType } from "../../constants"; -import { BuildOptions } from "../buildOptions2"; +import { BuildOptions } from "../buildOptions"; import { assert } from "tsafe/assert"; import * as crypto from "crypto"; diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index 74f22a63..5fcabb00 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -13,7 +13,7 @@ import { basenameOfTheKeycloakifyResourcesDir } from "../../constants"; import { isInside } from "../../tools/isInside"; -import type { BuildOptions } from "../buildOptions2"; +import type { BuildOptions } from "../buildOptions"; import { assert, type Equals } from "tsafe/assert"; import { downloadKeycloakStaticResources } from "./downloadKeycloakStaticResources"; import { readFieldNameUsage } from "./readFieldNameUsage"; diff --git a/src/bin/keycloakify/keycloakify.ts b/src/bin/keycloakify/keycloakify.ts index a9c66c14..5e8f48ea 100644 --- a/src/bin/keycloakify/keycloakify.ts +++ b/src/bin/keycloakify/keycloakify.ts @@ -4,7 +4,7 @@ import { join as pathJoin, relative as pathRelative, basename as pathBasename, d import * as child_process from "child_process"; import { generateStartKeycloakTestingContainer } from "./generateStartKeycloakTestingContainer"; import * as fs from "fs"; -import { readBuildOptions } from "./buildOptions2"; +import { readBuildOptions } from "./buildOptions"; import { getLogger } from "../tools/logger"; import { assert } from "tsafe/assert"; import { getThemeSrcDirPath } from "../getThemeSrcDirPath"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts b/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts index 6d592bd2..ae271970 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts @@ -1,5 +1,5 @@ import * as crypto from "crypto"; -import type { BuildOptions } from "../buildOptions2"; +import type { BuildOptions } from "../buildOptions"; import { assert } from "tsafe/assert"; import { basenameOfTheKeycloakifyResourcesDir } from "../../constants"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts b/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts index 9ec2c2c4..3bb52c12 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts @@ -1,4 +1,4 @@ -import type { BuildOptions } from "../buildOptions2"; +import type { BuildOptions } from "../buildOptions"; import { assert } from "tsafe/assert"; import { basenameOfTheKeycloakifyResourcesDir } from "../../constants"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts index 6590a2f2..30bcad9b 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts @@ -1,5 +1,5 @@ import { assert } from "tsafe/assert"; -import type { BuildOptions } from "../../buildOptions2"; +import type { BuildOptions } from "../../buildOptions"; import { replaceImportsInJsCode_vite } from "./vite"; import { replaceImportsInJsCode_webpack } from "./webpack"; import * as fs from "fs"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts index 18863040..9a60aae2 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts @@ -1,6 +1,6 @@ import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants"; import { assert } from "tsafe/assert"; -import type { BuildOptions } from "../../buildOptions2"; +import type { BuildOptions } from "../../buildOptions"; import * as nodePath from "path"; import { replaceAll } from "../../../tools/String.prototype.replaceAll"; diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts index ca5fcf2f..9105637a 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts @@ -1,6 +1,6 @@ import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants"; import { assert } from "tsafe/assert"; -import type { BuildOptions } from "../../buildOptions2"; +import type { BuildOptions } from "../../buildOptions"; import * as nodePath from "path"; import { replaceAll } from "../../../tools/String.prototype.replaceAll"; From 7c7ce159fe149426673baf85a8fdfaa4aba7b234 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 06:55:26 +0100 Subject: [PATCH 14/83] Complete build option --- .../keycloakify/buildOptions/buildOptions.ts | 116 +++++++++++------- .../getKeycloakifyBuildDirPath.ts | 33 +++++ src/bin/keycloakify/buildOptions/index.ts | 2 +- .../buildOptions/parsedPackageJson.ts | 2 +- .../buildOptions/resolvedViteConfig.ts | 33 +---- src/vite-plugin/vite-plugin.ts | 7 +- 6 files changed, 111 insertions(+), 82 deletions(-) create mode 100644 src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts diff --git a/src/bin/keycloakify/buildOptions/buildOptions.ts b/src/bin/keycloakify/buildOptions/buildOptions.ts index 3de46600..4dab5750 100644 --- a/src/bin/keycloakify/buildOptions/buildOptions.ts +++ b/src/bin/keycloakify/buildOptions/buildOptions.ts @@ -1,9 +1,10 @@ import { parse as urlParse } from "url"; -import { getParsedPackageJson } from "./parsedPackageJson"; +import { readParsedPackageJson } from "./parsedPackageJson"; import { join as pathJoin } from "path"; import parseArgv from "minimist"; import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath"; -import { readResolvedViteConfig, getKeycloakifyBuildDirPath } from "./resolvedViteConfig"; +import { readResolvedViteConfig } from "./resolvedViteConfig"; +import { getKeycloakifyBuildDirPath } from "./getKeycloakifyBuildDirPath"; /** Consolidated build option gathered form CLI arguments and config in package.json */ export type BuildOptions = { @@ -31,7 +32,7 @@ export type BuildOptions = { export function readBuildOptions(params: { reactAppRootDirPath: string; processArgv: string[] }): BuildOptions { const { reactAppRootDirPath, processArgv } = params; - const parsedPackageJson = getParsedPackageJson({ reactAppRootDirPath }); + const parsedPackageJson = readParsedPackageJson({ reactAppRootDirPath }); const { resolvedViteConfig } = readResolvedViteConfig({ @@ -61,7 +62,25 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA reactAppRootDirPath, "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack" }); - //const keycloakifyBuildDirPath = keycloakifyBuildDirPath_vite ?? pathJoin(reactAppRootDirPath, "build_keycloak"); + + 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); + })(); return { "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack", @@ -92,43 +111,31 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA "doCreateJar": parsedPackageJson.keycloakify?.doCreateJar ?? true, "loginThemeResourcesFromKeycloakVersion": parsedPackageJson.keycloakify?.loginThemeResourcesFromKeycloakVersion ?? "11.0.3", reactAppRootDirPath, - "reactAppBuildDirPath": (() => { - if (resolvedViteConfig !== undefined) { - return pathJoin(reactAppRootDirPath, resolvedViteConfig.buildDir); - } - - if (parsedPackageJson.keycloakify?.reactAppBuildDirPath !== undefined) { - return getAbsoluteAndInOsFormatPath({ - "pathIsh": parsedPackageJson.keycloakify?.reactAppBuildDirPath, - "cwd": reactAppRootDirPath - }); - } - - return pathJoin(reactAppRootDirPath, "build"); - })(), - - "publicDirPath": (() => { - if (resolvedViteConfig !== undefined) { - return resolvedViteConfig.publicDirPath; - } - - if (process.env.PUBLIC_DIR_PATH !== undefined) { - return getAbsoluteAndInOsFormatPath({ - "pathIsh": process.env.PUBLIC_DIR_PATH, - "cwd": reactAppRootDirPath - }); - } - - return pathJoin(reactAppRootDirPath, "public"); - })(), + reactAppBuildDirPath, keycloakifyBuildDirPath, + "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": pathJoin( (() => { - let { XDG_CACHE_HOME } = process.env; - - if (XDG_CACHE_HOME !== undefined) { + if (process.env.XDG_CACHE_HOME !== undefined) { return getAbsoluteAndInOsFormatPath({ - "pathIsh": XDG_CACHE_HOME, + "pathIsh": process.env.XDG_CACHE_HOME, "cwd": reactAppRootDirPath }); } @@ -138,20 +145,39 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA "keycloakify" ), "urlPathname": (() => { - const { homepage } = parsedPackageJson; + webpack: { + if (resolvedViteConfig !== undefined) { + break webpack; + } - let url: URL | undefined = undefined; + const { homepage } = parsedPackageJson; - if (homepage !== undefined) { - url = new URL(homepage); + 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; } - if (url === undefined) { - return undefined; + return resolvedViteConfig.urlPathname; + })(), + "assetsDirPath": (() => { + webpack: { + if (resolvedViteConfig !== undefined) { + break webpack; + } + + return pathJoin(reactAppBuildDirPath, "static"); } - const out = url.pathname.replace(/([^/])$/, "$1/"); - return out === "/" ? undefined : out; + return pathJoin(reactAppBuildDirPath, resolvedViteConfig.assetsDir); })() }; } diff --git a/src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts b/src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts new file mode 100644 index 00000000..5246fadb --- /dev/null +++ b/src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts @@ -0,0 +1,33 @@ +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 }; +} diff --git a/src/bin/keycloakify/buildOptions/index.ts b/src/bin/keycloakify/buildOptions/index.ts index ff784b36..0d6efd40 100644 --- a/src/bin/keycloakify/buildOptions/index.ts +++ b/src/bin/keycloakify/buildOptions/index.ts @@ -1 +1 @@ -export * from "./buildOptions2"; +export * from "./buildOptions"; diff --git a/src/bin/keycloakify/buildOptions/parsedPackageJson.ts b/src/bin/keycloakify/buildOptions/parsedPackageJson.ts index 59308e48..e21baf2a 100644 --- a/src/bin/keycloakify/buildOptions/parsedPackageJson.ts +++ b/src/bin/keycloakify/buildOptions/parsedPackageJson.ts @@ -41,7 +41,7 @@ const zParsedPackageJson = z.object({ assert, ParsedPackageJson>>(); let parsedPackageJson: undefined | ParsedPackageJson; -export function getParsedPackageJson(params: { reactAppRootDirPath: string }) { +export function readParsedPackageJson(params: { reactAppRootDirPath: string }) { const { reactAppRootDirPath } = params; if (parsedPackageJson) { return parsedPackageJson; diff --git a/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts b/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts index 7f62b92a..6646b795 100644 --- a/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts +++ b/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts @@ -5,7 +5,7 @@ import { z } from "zod"; import { join as pathJoin } from "path"; import { resolvedViteConfigJsonBasename } from "../../constants"; import type { OptionalIfCanBeUndefined } from "../../tools/OptionalIfCanBeUndefined"; -import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath"; +import { getKeycloakifyBuildDirPath } from "./getKeycloakifyBuildDirPath"; export type ResolvedViteConfig = { buildDir: string; @@ -83,34 +83,3 @@ export function readResolvedViteConfig(params: { return { resolvedViteConfig }; } - -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 }; -} diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index 5fb033d9..7d8fa96c 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -1,10 +1,11 @@ import { join as pathJoin, relative as pathRelative, sep as pathSep } from "path"; -import { getParsedPackageJson } from "../bin/keycloakify/parsedPackageJson"; +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 } from "../bin/constants"; -import { type ResolvedViteConfig, getKeycloakifyBuildDirPath } from "../bin/keycloakify/resolvedViteConfig"; +import type { ResolvedViteConfig } from "../bin/keycloakify/buildOptions/resolvedViteConfig"; +import { getKeycloakifyBuildDirPath } from "../bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath"; import { replaceAll } from "../bin/tools/String.prototype.replaceAll"; import { id } from "tsafe/id"; @@ -35,7 +36,7 @@ export function keycloakify(): Plugin { })(); const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({ - "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": getParsedPackageJson({ reactAppRootDirPath }).keycloakify + "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": readParsedPackageJson({ reactAppRootDirPath }).keycloakify ?.keycloakifyBuildDirPath, reactAppRootDirPath, "bundler": "vite" From fde34be270c520136829dce378c1e84bf0be04bf Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 30 Jan 2024 07:10:53 +0100 Subject: [PATCH 15/83] Compiling build --- src/account/kcContext/getKcContextFromWindow.ts | 4 ++-- src/bin/keycloakify/generateFtl/generateFtl.ts | 7 +++++-- .../generateJavaStackFiles/bringInAccountV1.ts | 2 +- .../generateJavaStackFiles/generateJavaStackFiles.ts | 2 +- src/bin/keycloakify/generateTheme/generateTheme.ts | 9 ++++++--- src/login/kcContext/getKcContextFromWindow.ts | 4 ++-- 6 files changed, 17 insertions(+), 11 deletions(-) diff --git a/src/account/kcContext/getKcContextFromWindow.ts b/src/account/kcContext/getKcContextFromWindow.ts index dc221d39..0c4de775 100644 --- a/src/account/kcContext/getKcContextFromWindow.ts +++ b/src/account/kcContext/getKcContextFromWindow.ts @@ -1,5 +1,5 @@ import type { AndByDiscriminatingKey } from "keycloakify/tools/AndByDiscriminatingKey"; -import { ftlValuesGlobalName } from "keycloakify/bin/keycloakify/ftlValuesGlobalName"; +import { nameOfTheGlobal } from "keycloakify/bin/constants"; import type { KcContext } from "./KcContext"; export type ExtendKcContext = [KcContextExtension] extends [never] @@ -7,5 +7,5 @@ export type ExtendKcContext = [Kc : AndByDiscriminatingKey<"pageId", KcContextExtension & KcContext.Common, KcContext>; export function getKcContextFromWindow(): ExtendKcContext | undefined { - return typeof window === "undefined" ? undefined : (window as any)[ftlValuesGlobalName]; + return typeof window === "undefined" ? undefined : (window as any)[nameOfTheGlobal]; } diff --git a/src/bin/keycloakify/generateFtl/generateFtl.ts b/src/bin/keycloakify/generateFtl/generateFtl.ts index 00b61e5f..6c8b18a3 100644 --- a/src/bin/keycloakify/generateFtl/generateFtl.ts +++ b/src/bin/keycloakify/generateFtl/generateFtl.ts @@ -1,5 +1,5 @@ import cheerio from "cheerio"; -import { replaceImportsFromStaticInJsCode } from "../replacers/replaceImportsFromStaticInJsCode"; +import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode"; import { generateCssCodeToDefineGlobals } from "../replacers/replaceImportsInCssCode"; import { replaceImportsInInlineCssCode } from "../replacers/replaceImportsInInlineCssCode"; import * as fs from "fs"; @@ -10,8 +10,11 @@ import { assert } from "tsafe/assert"; import { type ThemeType, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../constants"; export type BuildOptionsLike = { + bundler: "vite" | "webpack"; themeVersion: string; urlPathname: string | undefined; + reactAppBuildDirPath: string; + assetsDirPath: string; }; assert(); @@ -35,7 +38,7 @@ export function generateFtlFilesCodeFactory(params: { assert(jsCode !== null); - const { fixedJsCode } = replaceImportsFromStaticInJsCode({ jsCode, "bundler": "vite" }); + const { fixedJsCode } = replaceImportsInJsCode({ jsCode, buildOptions }); $(element).text(fixedJsCode); }); diff --git a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts index 9ee96110..3c7e1f1b 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts @@ -7,7 +7,7 @@ import { resources_common, lastKeycloakVersionWithAccountV1, accountV1ThemeName import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme"; import { transformCodebase } from "../../tools/transformCodebase"; -export type BuildOptionsLike = { +type BuildOptionsLike = { keycloakifyBuildDirPath: string; cacheDirPath: string; }; diff --git a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts index d31e056f..845f2c3f 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts @@ -6,7 +6,7 @@ import type { BuildOptions } from "../buildOptions"; import { type ThemeType, accountV1ThemeName } from "../../constants"; import { bringInAccountV1 } from "./bringInAccountV1"; -export type BuildOptionsLike = { +type BuildOptionsLike = { groupId: string; artifactId: string; themeVersion: string; diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index 5fcabb00..a53d9af9 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -1,7 +1,7 @@ import { transformCodebase } from "../../tools/transformCodebase"; import * as fs from "fs"; import { join as pathJoin, resolve as pathResolve } from "path"; -import { replaceImportsFromStaticInJsCode } from "../replacers/replaceImportsFromStaticInJsCode"; +import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode"; import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode"; import { generateFtlFilesCodeFactory, loginThemePageIds, accountThemePageIds } from "../generateFtl"; import { @@ -22,12 +22,15 @@ import { generateMessageProperties } from "./generateMessageProperties"; import { readStaticResourcesUsage } from "./readStaticResourcesUsage"; export type BuildOptionsLike = { + bundler: "vite" | "webpack"; extraThemeProperties: string[] | undefined; themeVersion: string; loginThemeResourcesFromKeycloakVersion: string; keycloakifyBuildDirPath: string; reactAppBuildDirPath: string; cacheDirPath: string; + assetsDirPath: string; + urlPathname: string | undefined; }; assert(); @@ -98,9 +101,9 @@ export async function generateTheme(params: { } if (/\.js?$/i.test(filePath)) { - const { fixedJsCode } = replaceImportsFromStaticInJsCode({ + const { fixedJsCode } = replaceImportsInJsCode({ "jsCode": sourceCode.toString("utf8"), - "bundler": "vite" + buildOptions }); return { "modifiedSourceCode": Buffer.from(fixedJsCode, "utf8") }; diff --git a/src/login/kcContext/getKcContextFromWindow.ts b/src/login/kcContext/getKcContextFromWindow.ts index 799dad34..c3360657 100644 --- a/src/login/kcContext/getKcContextFromWindow.ts +++ b/src/login/kcContext/getKcContextFromWindow.ts @@ -1,11 +1,11 @@ import type { KcContext } from "./KcContext"; import type { AndByDiscriminatingKey } from "keycloakify/tools/AndByDiscriminatingKey"; -import { ftlValuesGlobalName } from "keycloakify/bin/keycloakify/ftlValuesGlobalName"; +import { nameOfTheGlobal } from "keycloakify/bin/constants"; export type ExtendKcContext = [KcContextExtension] extends [never] ? KcContext : AndByDiscriminatingKey<"pageId", KcContextExtension & KcContext.Common, KcContext>; export function getKcContextFromWindow(): ExtendKcContext | undefined { - return typeof window === "undefined" ? undefined : (window as any)[ftlValuesGlobalName]; + return typeof window === "undefined" ? undefined : (window as any)[nameOfTheGlobal]; } From bd25621b2ca146fa25bbc58fed182f0eb94b4549 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Wed, 31 Jan 2024 21:56:46 +0100 Subject: [PATCH 16/83] Remove dead code --- .../generateTheme/generateTheme.ts | 31 ++++++++----------- 1 file changed, 13 insertions(+), 18 deletions(-) diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index a53d9af9..72ddae7e 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -51,8 +51,6 @@ export async function generateTheme(params: { let allCssGlobalsToDefine: Record = {}; - let generateFtlFilesCode_glob: ReturnType["generateFtlFilesCode"] | undefined = undefined; - for (const themeType of themeTypes) { if (!fs.existsSync(pathJoin(themeSrcDirPath, themeType))) { continue; @@ -114,22 +112,19 @@ export async function generateTheme(params: { }); } - const generateFtlFilesCode = - generateFtlFilesCode_glob !== undefined - ? generateFtlFilesCode_glob - : generateFtlFilesCodeFactory({ - themeName, - "indexHtmlCode": fs.readFileSync(pathJoin(buildOptions.reactAppBuildDirPath, "index.html")).toString("utf8"), - "cssGlobalsToDefine": allCssGlobalsToDefine, - buildOptions, - keycloakifyVersion, - themeType, - "fieldNames": readFieldNameUsage({ - keycloakifySrcDirPath, - themeSrcDirPath, - themeType - }) - }).generateFtlFilesCode; + const { generateFtlFilesCode } = generateFtlFilesCodeFactory({ + themeName, + "indexHtmlCode": fs.readFileSync(pathJoin(buildOptions.reactAppBuildDirPath, "index.html")).toString("utf8"), + "cssGlobalsToDefine": allCssGlobalsToDefine, + buildOptions, + keycloakifyVersion, + themeType, + "fieldNames": readFieldNameUsage({ + keycloakifySrcDirPath, + themeSrcDirPath, + themeType + }) + }); [ ...(() => { From 75c54df109720168dde5ec6fb09e302ca95df1e1 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sat, 3 Feb 2024 08:16:16 +0100 Subject: [PATCH 17/83] Fix some errors in base account v1 theme --- src/bin/download-builtin-keycloak-theme.ts | 45 +++++++++++++++++++ .../bringInAccountV1.ts | 21 +++++++-- 2 files changed, 63 insertions(+), 3 deletions(-) diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index 8cf9d600..073aad9c 100644 --- a/src/bin/download-builtin-keycloak-theme.ts +++ b/src/bin/download-builtin-keycloak-theme.ts @@ -26,6 +26,51 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st "preCacheTransform": { "actionCacheId": "npm install and build", "action": async ({ destDirPath }) => { + fix_account_css: { + const accountCssFilePath = pathJoin(destDirPath, "keycloak", "account", "resources", "css", "account.css"); + + if (!fs.existsSync(accountCssFilePath)) { + break fix_account_css; + } + + fs.writeFileSync( + accountCssFilePath, + Buffer.from(fs.readFileSync(accountCssFilePath).toString("utf8").replace("top: -34px;", "top: -34px !important;"), "utf8") + ); + } + + fix_account_topt: { + const totpFtlFilePath = pathJoin(destDirPath, "base", "account", "totp.ftl"); + + if (!fs.existsSync(totpFtlFilePath)) { + break fix_account_topt; + } + + fs.writeFileSync( + totpFtlFilePath, + Buffer.from( + fs + .readFileSync(totpFtlFilePath) + .toString("utf8") + .replace( + [ + " <#list totp.policy.supportedApplications as app>", + "
  • ${app}
    • ", + " " + ].join("\n"), + [ + " <#if totp.policy.supportedApplications?has_content>", + " <#list totp.policy.supportedApplications as app>", + "
  • ${app}
    • ", + " ", + " " + ].join("\n") + ), + "utf8" + ) + ); + } + install_common_node_modules: { const commonResourcesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources"); diff --git a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts index 3c7e1f1b..91aea909 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts @@ -38,7 +38,22 @@ export async function bringInAccountV1(params: { buildOptions: BuildOptionsLike const commonResourceFilePaths = [ "node_modules/patternfly/dist/css/patternfly.min.css", - "node_modules/patternfly/dist/css/patternfly-additions.min.css" + "node_modules/patternfly/dist/css/patternfly-additions.min.css", + "node_modules/patternfly/dist/css/patternfly-additions.min.css", + ...[ + "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(path => `node_modules/patternfly/dist/fonts/${path}`) ]; for (const relativeFilePath of commonResourceFilePaths.map(path => pathJoin(...path.split("/")))) { @@ -49,7 +64,7 @@ export async function bringInAccountV1(params: { buildOptions: BuildOptionsLike fs.cpSync(pathJoin(builtinKeycloakThemeTmpDirPath, "keycloak", "common", "resources", relativeFilePath), destFilePath); } - const resourceFilePaths = ["css/account.css"]; + const resourceFilePaths = ["css/account.css", "img/icon-sidebar-active.png", "img/logo.png"]; for (const relativeFilePath of resourceFilePaths.map(path => pathJoin(...path.split("/")))) { const destFilePath = pathJoin(accountV1DirPath, "resources", relativeFilePath); @@ -69,7 +84,7 @@ export async function bringInAccountV1(params: { buildOptions: BuildOptionsLike "", "locales=ar,ca,cs,da,de,en,es,fr,fi,hu,it,ja,lt,nl,no,pl,pt-BR,ru,sk,sv,tr,zh-CN", "", - "styles=" + [...resourceFilePaths, ...commonResourceFilePaths.map(path => `resources_common/${path}`)].join(" "), + "styles=" + [...resourceFilePaths, ...commonResourceFilePaths.map(path => `resources-common/${path}`)].join(" "), "", "##### css classes for form buttons", "# main class used for all buttons", From a29b6097a48304754db9456fbea6935f6435e881 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 4 Feb 2024 10:25:48 +0100 Subject: [PATCH 18/83] Reintroduce doBuildRetrocompatAccountTheme (for now) --- src/bin/constants.ts | 1 + .../keycloakify/buildOptions/buildOptions.ts | 4 +- .../buildOptions/parsedPackageJson.ts | 4 +- .../generateJavaStackFiles.ts | 13 ++++++- .../generateTheme/generateTheme.ts | 37 +++++++++++++++++-- src/bin/promptKeycloakVersion.ts | 2 + 6 files changed, 53 insertions(+), 8 deletions(-) diff --git a/src/bin/constants.ts b/src/bin/constants.ts index a3ab98e3..279e773a 100644 --- a/src/bin/constants.ts +++ b/src/bin/constants.ts @@ -6,6 +6,7 @@ export const resolvedViteConfigJsonBasename = ".keycloakifyViteConfig.json"; export const basenameOfTheKeycloakifyResourcesDir = "build"; export const themeTypes = ["login", "account"] as const; +export const retrocompatPostfix = "_retrocompat"; export const accountV1ThemeName = "account-v1"; export type ThemeType = (typeof themeTypes)[number]; diff --git a/src/bin/keycloakify/buildOptions/buildOptions.ts b/src/bin/keycloakify/buildOptions/buildOptions.ts index 4dab5750..bb462d59 100644 --- a/src/bin/keycloakify/buildOptions/buildOptions.ts +++ b/src/bin/keycloakify/buildOptions/buildOptions.ts @@ -27,6 +27,7 @@ export type BuildOptions = { * In this case the urlPathname will be "/my-app/" */ urlPathname: string | undefined; assetsDirPath: string; + doBuildRetrocompatAccountTheme: boolean; }; export function readBuildOptions(params: { reactAppRootDirPath: string; processArgv: string[] }): BuildOptions { @@ -178,6 +179,7 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA } return pathJoin(reactAppBuildDirPath, resolvedViteConfig.assetsDir); - })() + })(), + "doBuildRetrocompatAccountTheme": parsedPackageJson.keycloakify?.doBuildRetrocompatAccountTheme ?? true }; } diff --git a/src/bin/keycloakify/buildOptions/parsedPackageJson.ts b/src/bin/keycloakify/buildOptions/parsedPackageJson.ts index e21baf2a..4b2aafff 100644 --- a/src/bin/keycloakify/buildOptions/parsedPackageJson.ts +++ b/src/bin/keycloakify/buildOptions/parsedPackageJson.ts @@ -17,6 +17,7 @@ export type ParsedPackageJson = { reactAppBuildDirPath?: string; keycloakifyBuildDirPath?: string; themeName?: string | string[]; + doBuildRetrocompatAccountTheme?: boolean; }; }; @@ -33,7 +34,8 @@ const zParsedPackageJson = z.object({ "loginThemeResourcesFromKeycloakVersion": z.string().optional(), "reactAppBuildDirPath": z.string().optional(), "keycloakifyBuildDirPath": z.string().optional(), - "themeName": z.union([z.string(), z.array(z.string())]).optional() + "themeName": z.union([z.string(), z.array(z.string())]).optional(), + "doBuildRetrocompatAccountTheme": z.boolean().optional() }) .optional() }); diff --git a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts index 845f2c3f..b6d93f29 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts +++ b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts @@ -3,7 +3,7 @@ import { join as pathJoin, dirname as pathDirname } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; import type { BuildOptions } from "../buildOptions"; -import { type ThemeType, accountV1ThemeName } from "../../constants"; +import { type ThemeType, retrocompatPostfix, accountV1ThemeName } from "../../constants"; import { bringInAccountV1 } from "./bringInAccountV1"; type BuildOptionsLike = { @@ -13,6 +13,7 @@ type BuildOptionsLike = { cacheDirPath: string; keycloakifyBuildDirPath: string; themeNames: string[]; + doBuildRetrocompatAccountTheme: boolean; }; { @@ -113,7 +114,15 @@ export async function generateJavaStackFiles(params: { "types": Object.entries(implementedThemeTypes) .filter(([, isImplemented]) => isImplemented) .map(([themeType]) => themeType) - } + }, + ...(!implementedThemeTypes.account || !buildOptions.doBuildRetrocompatAccountTheme + ? [] + : [ + { + "name": `${themeName}${retrocompatPostfix}`, + "types": ["account"] + } + ]) ]) .flat() ] diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index 72ddae7e..b9b95a74 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -1,6 +1,6 @@ import { transformCodebase } from "../../tools/transformCodebase"; import * as fs from "fs"; -import { join as pathJoin, resolve as pathResolve } from "path"; +import { join as pathJoin, basename as pathBasename, resolve as pathResolve } from "path"; import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode"; import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode"; import { generateFtlFilesCodeFactory, loginThemePageIds, accountThemePageIds } from "../generateFtl"; @@ -9,6 +9,7 @@ import { type ThemeType, lastKeycloakVersionWithAccountV1, keycloak_resources, + retrocompatPostfix, accountV1ThemeName, basenameOfTheKeycloakifyResourcesDir } from "../../constants"; @@ -31,6 +32,7 @@ export type BuildOptionsLike = { cacheDirPath: string; assetsDirPath: string; urlPathname: string | undefined; + doBuildRetrocompatAccountTheme: boolean; }; assert(); @@ -44,9 +46,17 @@ export async function generateTheme(params: { }): Promise { const { themeName, themeSrcDirPath, keycloakifySrcDirPath, buildOptions, keycloakifyVersion } = params; - const getThemeTypeDirPath = (params: { themeType: ThemeType | "email" }) => { - const { themeType } = params; - return pathJoin(buildOptions.keycloakifyBuildDirPath, "src", "main", "resources", "theme", themeName, themeType); + const getThemeTypeDirPath = (params: { themeType: ThemeType | "email"; isRetrocompat?: true }) => { + const { themeType, isRetrocompat = false } = params; + return pathJoin( + buildOptions.keycloakifyBuildDirPath, + "src", + "main", + "resources", + "theme", + `${themeName}${isRetrocompat ? retrocompatPostfix : ""}`, + themeType + ); }; let allCssGlobalsToDefine: Record = {}; @@ -197,6 +207,25 @@ export async function generateTheme(params: { "utf8" ) ); + + if (themeType === "account" && buildOptions.doBuildRetrocompatAccountTheme) { + transformCodebase({ + "srcDirPath": themeTypeDirPath, + "destDirPath": getThemeTypeDirPath({ themeType, "isRetrocompat": true }), + "transformSourceCode": ({ filePath, sourceCode }) => { + if (pathBasename(filePath) === "theme.properties") { + return { + "modifiedSourceCode": Buffer.from( + sourceCode.toString("utf8").replace(`parent=${accountV1ThemeName}`, "parent=keycloak"), + "utf8" + ) + }; + } + + return { "modifiedSourceCode": sourceCode }; + } + }); + } } email: { diff --git a/src/bin/promptKeycloakVersion.ts b/src/bin/promptKeycloakVersion.ts index 276dc90f..63e7b25c 100644 --- a/src/bin/promptKeycloakVersion.ts +++ b/src/bin/promptKeycloakVersion.ts @@ -1,6 +1,7 @@ import { getLatestsSemVersionedTagFactory } from "./tools/octokit-addons/getLatestsSemVersionedTag"; import { Octokit } from "@octokit/rest"; import cliSelect from "cli-select"; +import { lastKeycloakVersionWithAccountV1 } from "./constants"; export async function promptKeycloakVersion() { const { getLatestsSemVersionedTag } = (() => { @@ -26,6 +27,7 @@ export async function promptKeycloakVersion() { "owner": "keycloak", "repo": "keycloak" }).then(arr => arr.map(({ tag }) => tag))), + lastKeycloakVersionWithAccountV1, "11.0.3" ]; From 73a8ec029574adc0323b59a4ee33243dc9b79f87 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 5 Feb 2024 08:52:58 +0100 Subject: [PATCH 19/83] Building version --- src/bin/copy-keycloak-resources-to-public.ts | 3 +- src/bin/download-builtin-keycloak-theme.ts | 141 ++++++++++++------ src/bin/initialize-email-theme.ts | 3 +- .../generateJavaStackFiles.ts | 141 ------------------ .../generateJavaStackFiles/index.ts | 1 - src/bin/keycloakify/generatePom.ts | 70 +++++++++ .../bringInAccountV1.ts | 59 +++----- .../downloadKeycloakStaticResources.ts | 61 ++------ .../generateTheme/generateTheme.ts | 135 +++++++++++++---- .../generateTheme/readStaticResourcesUsage.ts | 76 ---------- src/bin/keycloakify/keycloakify.ts | 59 +------- src/bin/tools/downloadAndUnzip.ts | 3 +- src/bin/tools/fs.rm.ts | 43 ++++++ src/bin/tools/fs.rmSync.ts | 33 ++++ src/bin/tools/transformCodebase.ts | 21 ++- 15 files changed, 410 insertions(+), 439 deletions(-) delete mode 100644 src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts delete mode 100644 src/bin/keycloakify/generateJavaStackFiles/index.ts create mode 100644 src/bin/keycloakify/generatePom.ts rename src/bin/keycloakify/{generateJavaStackFiles => generateTheme}/bringInAccountV1.ts (52%) delete mode 100644 src/bin/keycloakify/generateTheme/readStaticResourcesUsage.ts create mode 100644 src/bin/tools/fs.rm.ts create mode 100644 src/bin/tools/fs.rmSync.ts diff --git a/src/bin/copy-keycloak-resources-to-public.ts b/src/bin/copy-keycloak-resources-to-public.ts index 78daf92d..5c8d276c 100644 --- a/src/bin/copy-keycloak-resources-to-public.ts +++ b/src/bin/copy-keycloak-resources-to-public.ts @@ -28,7 +28,6 @@ import * as fs from "fs"; })(), themeType, "themeDirPath": reservedDirPath, - "usedResources": undefined, buildOptions }); } @@ -44,7 +43,7 @@ import * as fs from "fs"; ) ); - fs.writeFileSync(pathJoin(buildOptions.publicDirPath, "keycloak-resources", ".gitignore"), Buffer.from("*", "utf8")); + fs.writeFileSync(pathJoin(buildOptions.publicDirPath, keycloak_resources, ".gitignore"), Buffer.from("*", "utf8")); console.log(`${pathRelative(reactAppRootDirPath, reservedDirPath)} directory created.`); })(); diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index 073aad9c..8ddd4b68 100644 --- a/src/bin/download-builtin-keycloak-theme.ts +++ b/src/bin/download-builtin-keycloak-theme.ts @@ -7,6 +7,9 @@ import { readBuildOptions, type BuildOptions } from "./keycloakify/buildOptions" import { assert } from "tsafe/assert"; import * as child_process from "child_process"; import * as fs from "fs"; +import { rmSync } from "./tools/fs.rmSync"; +import { lastKeycloakVersionWithAccountV1 } from "./constants"; +import { transformCodebase } from "./tools/transformCodebase"; export type BuildOptionsLike = { cacheDirPath: string; @@ -26,51 +29,6 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st "preCacheTransform": { "actionCacheId": "npm install and build", "action": async ({ destDirPath }) => { - fix_account_css: { - const accountCssFilePath = pathJoin(destDirPath, "keycloak", "account", "resources", "css", "account.css"); - - if (!fs.existsSync(accountCssFilePath)) { - break fix_account_css; - } - - fs.writeFileSync( - accountCssFilePath, - Buffer.from(fs.readFileSync(accountCssFilePath).toString("utf8").replace("top: -34px;", "top: -34px !important;"), "utf8") - ); - } - - fix_account_topt: { - const totpFtlFilePath = pathJoin(destDirPath, "base", "account", "totp.ftl"); - - if (!fs.existsSync(totpFtlFilePath)) { - break fix_account_topt; - } - - fs.writeFileSync( - totpFtlFilePath, - Buffer.from( - fs - .readFileSync(totpFtlFilePath) - .toString("utf8") - .replace( - [ - " <#list totp.policy.supportedApplications as app>", - "
  • ${app}
    • ", - " " - ].join("\n"), - [ - " <#if totp.policy.supportedApplications?has_content>", - " <#list totp.policy.supportedApplications as app>", - "
  • ${app}
    • ", - " ", - " " - ].join("\n") - ), - "utf8" - ) - ); - } - install_common_node_modules: { const commonResourcesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources"); @@ -128,7 +86,98 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st fs.writeFileSync(packageJsonFilePath, packageJsonRaw); - fs.rmSync(pathJoin(accountV2DirSrcDirPath, "node_modules"), { "recursive": true }); + rmSync(pathJoin(accountV2DirSrcDirPath, "node_modules"), { "recursive": true }); + } + + last_account_v1_transformations: { + if (lastKeycloakVersionWithAccountV1 !== keycloakVersion) { + break last_account_v1_transformations; + } + + { + const accountCssFilePath = pathJoin(destDirPath, "keycloak", "account", "resources", "css", "account.css"); + + fs.writeFileSync( + accountCssFilePath, + Buffer.from(fs.readFileSync(accountCssFilePath).toString("utf8").replace("top: -34px;", "top: -34px !important;"), "utf8") + ); + } + + { + const totpFtlFilePath = pathJoin(destDirPath, "base", "account", "totp.ftl"); + + fs.writeFileSync( + totpFtlFilePath, + Buffer.from( + fs + .readFileSync(totpFtlFilePath) + .toString("utf8") + .replace( + [ + " <#list totp.policy.supportedApplications as app>", + "
  • ${app}
    • ", + " " + ].join("\n"), + [ + " <#if totp.policy.supportedApplications?has_content>", + " <#list totp.policy.supportedApplications as app>", + "
  • ${app}
    • ", + " ", + " " + ].join("\n") + ), + "utf8" + ) + ); + } + + // Note, this is an optimization for reducing the size of the jar + { + const defaultThemeCommonResourcesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources"); + + const usedCommonResourceRelativeFilePaths = [ + ...["patternfly.min.css", "patternfly-additions.min.css", "patternfly-additions.min.css"].map(fileBasename => + pathJoin("node_modules", "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("node_modules", "patternfly", "dist", "fonts", fileBasename)) + ]; + + transformCodebase({ + "srcDirPath": defaultThemeCommonResourcesDirPath, + "destDirPath": defaultThemeCommonResourcesDirPath, + "transformSourceCode": ({ sourceCode, fileRelativePath }) => { + if (!usedCommonResourceRelativeFilePaths.includes(fileRelativePath)) { + return undefined; + } + + return { "modifiedSourceCode": sourceCode }; + } + }); + } + + // Other optimization: Remove AngularJS + { + const nodeModuleDirPath = pathJoin(destDirPath, "keycloak", "common", "resources", "node_modules"); + + fs.readdirSync(nodeModuleDirPath) + .filter(basename => basename.startsWith("angular")) + .map(basename => pathJoin(nodeModuleDirPath, basename)) + .filter(dirPath => fs.statSync(dirPath).isDirectory()) + .forEach(dirPath => rmSync(dirPath, { "recursive": true })); + } } } } diff --git a/src/bin/initialize-email-theme.ts b/src/bin/initialize-email-theme.ts index b4afdacc..84dbb93b 100644 --- a/src/bin/initialize-email-theme.ts +++ b/src/bin/initialize-email-theme.ts @@ -8,6 +8,7 @@ import { readBuildOptions } from "./keycloakify/buildOptions"; import * as fs from "fs"; import { getLogger } from "./tools/logger"; import { getThemeSrcDirPath } from "./getThemeSrcDirPath"; +import { rmSync } from "./tools/fs.rmSync"; export async function main() { const reactAppRootDirPath = process.cwd(); @@ -54,7 +55,7 @@ export async function main() { logger.log(`${pathRelative(process.cwd(), emailThemeSrcDirPath)} ready to be customized, feel free to remove every file you do not customize`); - fs.rmSync(builtinKeycloakThemeTmpDirPath, { "recursive": true, "force": true }); + rmSync(builtinKeycloakThemeTmpDirPath, { "recursive": true, "force": true }); } if (require.main === module) { diff --git a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts b/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts deleted file mode 100644 index b6d93f29..00000000 --- a/src/bin/keycloakify/generateJavaStackFiles/generateJavaStackFiles.ts +++ /dev/null @@ -1,141 +0,0 @@ -import * as fs from "fs"; -import { join as pathJoin, dirname as pathDirname } from "path"; -import { assert } from "tsafe/assert"; -import { Reflect } from "tsafe/Reflect"; -import type { BuildOptions } from "../buildOptions"; -import { type ThemeType, retrocompatPostfix, accountV1ThemeName } from "../../constants"; -import { bringInAccountV1 } from "./bringInAccountV1"; - -type BuildOptionsLike = { - groupId: string; - artifactId: string; - themeVersion: string; - cacheDirPath: string; - keycloakifyBuildDirPath: string; - themeNames: string[]; - doBuildRetrocompatAccountTheme: boolean; -}; - -{ - const buildOptions = Reflect(); - - assert(); -} - -export async function generateJavaStackFiles(params: { - implementedThemeTypes: Record; - buildOptions: BuildOptionsLike; -}): Promise<{ - jarFilePath: string; -}> { - const { implementedThemeTypes, buildOptions } = params; - - { - const { pomFileCode } = (function generatePomFileCode(): { - pomFileCode: string; - } { - const pomFileCode = [ - ``, - ``, - ` 4.0.0`, - ` ${buildOptions.groupId}`, - ` ${buildOptions.artifactId}`, - ` ${buildOptions.themeVersion}`, - ` ${buildOptions.artifactId}`, - ` `, - ` jar`, - ` `, - ` UTF-8`, - ` `, - ` `, - ` `, - ` `, - ` org.apache.maven.plugins`, - ` maven-shade-plugin`, - ` 3.5.1`, - ` `, - ` `, - ` package`, - ` `, - ` shade`, - ` `, - ` `, - ` `, - ` `, - ` `, - ` `, - ` `, - ` `, - ` io.phasetwo.keycloak`, - ` keycloak-account-v1`, - ` 0.1`, - ` `, - ` `, - `` - ].join("\n"); - - return { pomFileCode }; - })(); - - fs.writeFileSync(pathJoin(buildOptions.keycloakifyBuildDirPath, "pom.xml"), Buffer.from(pomFileCode, "utf8")); - } - - if (implementedThemeTypes.account) { - await bringInAccountV1({ buildOptions }); - } - - { - const themeManifestFilePath = pathJoin(buildOptions.keycloakifyBuildDirPath, "src", "main", "resources", "META-INF", "keycloak-themes.json"); - - try { - fs.mkdirSync(pathDirname(themeManifestFilePath)); - } catch {} - - fs.writeFileSync( - themeManifestFilePath, - Buffer.from( - JSON.stringify( - { - "themes": [ - ...(!implementedThemeTypes.account - ? [] - : [ - { - "name": accountV1ThemeName, - "types": ["account"] - } - ]), - ...buildOptions.themeNames - .map(themeName => [ - { - "name": themeName, - "types": Object.entries(implementedThemeTypes) - .filter(([, isImplemented]) => isImplemented) - .map(([themeType]) => themeType) - }, - ...(!implementedThemeTypes.account || !buildOptions.doBuildRetrocompatAccountTheme - ? [] - : [ - { - "name": `${themeName}${retrocompatPostfix}`, - "types": ["account"] - } - ]) - ]) - .flat() - ] - }, - null, - 2 - ), - "utf8" - ) - ); - } - - return { - "jarFilePath": pathJoin(buildOptions.keycloakifyBuildDirPath, "target", `${buildOptions.artifactId}-${buildOptions.themeVersion}.jar`) - }; -} diff --git a/src/bin/keycloakify/generateJavaStackFiles/index.ts b/src/bin/keycloakify/generateJavaStackFiles/index.ts deleted file mode 100644 index ea372c91..00000000 --- a/src/bin/keycloakify/generateJavaStackFiles/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./generateJavaStackFiles"; diff --git a/src/bin/keycloakify/generatePom.ts b/src/bin/keycloakify/generatePom.ts new file mode 100644 index 00000000..555382ab --- /dev/null +++ b/src/bin/keycloakify/generatePom.ts @@ -0,0 +1,70 @@ +import { assert } from "tsafe/assert"; +import { Reflect } from "tsafe/Reflect"; +import type { BuildOptions } from "./buildOptions"; + +type BuildOptionsLike = { + groupId: string; + artifactId: string; + themeVersion: string; + keycloakifyBuildDirPath: string; +}; + +{ + const buildOptions = Reflect(); + + assert(); +} + +export function generatePom(params: { buildOptions: BuildOptionsLike }) { + const { buildOptions } = params; + + const { pomFileCode } = (function generatePomFileCode(): { + pomFileCode: string; + } { + const pomFileCode = [ + ``, + ``, + ` 4.0.0`, + ` ${buildOptions.groupId}`, + ` ${buildOptions.artifactId}`, + ` ${buildOptions.themeVersion}`, + ` ${buildOptions.artifactId}`, + ` `, + ` jar`, + ` `, + ` UTF-8`, + ` `, + ` `, + ` `, + ` `, + ` org.apache.maven.plugins`, + ` maven-shade-plugin`, + ` 3.5.1`, + ` `, + ` `, + ` package`, + ` `, + ` shade`, + ` `, + ` `, + ` `, + ` `, + ` `, + ` `, + ` `, + ` `, + ` io.phasetwo.keycloak`, + ` keycloak-account-v1`, + ` 0.1`, + ` `, + ` `, + `` + ].join("\n"); + + return { pomFileCode }; + })(); + + return { pomFileCode }; +} diff --git a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts b/src/bin/keycloakify/generateTheme/bringInAccountV1.ts similarity index 52% rename from src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts rename to src/bin/keycloakify/generateTheme/bringInAccountV1.ts index 91aea909..6caaeabc 100644 --- a/src/bin/keycloakify/generateJavaStackFiles/bringInAccountV1.ts +++ b/src/bin/keycloakify/generateTheme/bringInAccountV1.ts @@ -1,11 +1,12 @@ import * as fs from "fs"; -import { join as pathJoin, dirname as pathDirname } from "path"; +import { join as pathJoin } from "path"; import { assert } from "tsafe/assert"; import { Reflect } from "tsafe/Reflect"; import type { BuildOptions } from "../buildOptions"; import { resources_common, lastKeycloakVersionWithAccountV1, accountV1ThemeName } from "../../constants"; import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme"; import { transformCodebase } from "../../tools/transformCodebase"; +import { rmSync } from "../../tools/fs.rmSync"; type BuildOptionsLike = { keycloakifyBuildDirPath: string; @@ -36,45 +37,17 @@ export async function bringInAccountV1(params: { buildOptions: BuildOptionsLike "destDirPath": accountV1DirPath }); - const commonResourceFilePaths = [ - "node_modules/patternfly/dist/css/patternfly.min.css", - "node_modules/patternfly/dist/css/patternfly-additions.min.css", - "node_modules/patternfly/dist/css/patternfly-additions.min.css", - ...[ - "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(path => `node_modules/patternfly/dist/fonts/${path}`) - ]; + transformCodebase({ + "srcDirPath": pathJoin(builtinKeycloakThemeTmpDirPath, "keycloak", "account", "resources"), + "destDirPath": pathJoin(accountV1DirPath, "resources") + }); - for (const relativeFilePath of commonResourceFilePaths.map(path => pathJoin(...path.split("/")))) { - const destFilePath = pathJoin(accountV1DirPath, "resources", resources_common, relativeFilePath); + transformCodebase({ + "srcDirPath": pathJoin(builtinKeycloakThemeTmpDirPath, "keycloak", "common", "resources"), + "destDirPath": pathJoin(accountV1DirPath, "resources", resources_common) + }); - fs.mkdirSync(pathDirname(destFilePath), { "recursive": true }); - - fs.cpSync(pathJoin(builtinKeycloakThemeTmpDirPath, "keycloak", "common", "resources", relativeFilePath), destFilePath); - } - - const resourceFilePaths = ["css/account.css", "img/icon-sidebar-active.png", "img/logo.png"]; - - for (const relativeFilePath of resourceFilePaths.map(path => pathJoin(...path.split("/")))) { - const destFilePath = pathJoin(accountV1DirPath, "resources", relativeFilePath); - - fs.mkdirSync(pathDirname(destFilePath), { "recursive": true }); - - fs.cpSync(pathJoin(builtinKeycloakThemeTmpDirPath, "keycloak", "account", "resources", relativeFilePath), destFilePath); - } - - fs.rmSync(builtinKeycloakThemeTmpDirPath, { "recursive": true }); + rmSync(builtinKeycloakThemeTmpDirPath, { "recursive": true }); fs.writeFileSync( pathJoin(accountV1DirPath, "theme.properties"), @@ -84,7 +57,15 @@ export async function bringInAccountV1(params: { buildOptions: BuildOptionsLike "", "locales=ar,ca,cs,da,de,en,es,fr,fi,hu,it,ja,lt,nl,no,pl,pt-BR,ru,sk,sv,tr,zh-CN", "", - "styles=" + [...resourceFilePaths, ...commonResourceFilePaths.map(path => `resources-common/${path}`)].join(" "), + "styles=" + + [ + "css/account.css", + "img/icon-sidebar-active.png", + "img/logo.png", + ...["patternfly.min.css", "patternfly-additions.min.css", "patternfly-additions.min.css"].map( + fileBasename => `${resources_common}/node_modules/patternfly/dist/css/${fileBasename}` + ) + ].join(" "), "", "##### css classes for form buttons", "# main class used for all buttons", diff --git a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts index 3e0bd985..8cc0c3f0 100644 --- a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts +++ b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts @@ -1,11 +1,11 @@ import { transformCodebase } from "../../tools/transformCodebase"; -import * as fs from "fs"; -import { join as pathJoin, dirname as pathDirname } from "path"; +import { join as pathJoin } from "path"; import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme"; import { resources_common, type ThemeType } from "../../constants"; import { BuildOptions } from "../buildOptions"; import { assert } from "tsafe/assert"; import * as crypto from "crypto"; +import { rmSync } from "../../tools/fs.rmSync"; export type BuildOptionsLike = { cacheDirPath: string; @@ -13,45 +13,14 @@ export type BuildOptionsLike = { assert(); -export async function downloadKeycloakStaticResources( - // prettier-ignore - params: { - themeType: ThemeType; - themeDirPath: string; - keycloakVersion: string; - usedResources: { - resourcesCommonFilePaths: string[]; - } | undefined; - buildOptions: BuildOptionsLike; - } -) { +export async function downloadKeycloakStaticResources(params: { + themeType: ThemeType; + themeDirPath: string; + keycloakVersion: string; + buildOptions: BuildOptionsLike; +}) { const { themeType, themeDirPath, keycloakVersion, buildOptions } = params; - // NOTE: Hack for 427 - const usedResources = (() => { - const { usedResources } = params; - - if (usedResources === undefined) { - return undefined; - } - - assert(usedResources !== undefined); - - return { - "resourcesCommonDirPaths": usedResources.resourcesCommonFilePaths.map(filePath => { - { - const splitArg = "/dist/"; - - if (filePath.includes(splitArg)) { - return filePath.split(splitArg)[0] + splitArg; - } - } - - return pathDirname(filePath); - }) - }; - })(); - const tmpDirPath = pathJoin( themeDirPath, `tmp_suLeKsxId_${crypto.createHash("sha256").update(`${themeType}-${keycloakVersion}`).digest("hex").slice(0, 8)}` @@ -72,18 +41,8 @@ export async function downloadKeycloakStaticResources( transformCodebase({ "srcDirPath": pathJoin(tmpDirPath, "keycloak", "common", "resources"), - "destDirPath": pathJoin(resourcesPath, resources_common), - "transformSourceCode": - usedResources === undefined - ? undefined - : ({ fileRelativePath, sourceCode }) => { - if (usedResources.resourcesCommonDirPaths.find(dirPath => fileRelativePath.startsWith(dirPath)) === undefined) { - return undefined; - } - - return { "modifiedSourceCode": sourceCode }; - } + "destDirPath": pathJoin(resourcesPath, resources_common) }); - fs.rmSync(tmpDirPath, { "recursive": true, "force": true }); + rmSync(tmpDirPath, { "recursive": true, "force": true }); } diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index b9b95a74..3ff03e79 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -1,11 +1,10 @@ import { transformCodebase } from "../../tools/transformCodebase"; import * as fs from "fs"; -import { join as pathJoin, basename as pathBasename, resolve as pathResolve } from "path"; +import { join as pathJoin, basename as pathBasename, resolve as pathResolve, dirname as pathDirname } from "path"; import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode"; import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode"; import { generateFtlFilesCodeFactory, loginThemePageIds, accountThemePageIds } from "../generateFtl"; import { - themeTypes, type ThemeType, lastKeycloakVersionWithAccountV1, keycloak_resources, @@ -20,7 +19,7 @@ import { downloadKeycloakStaticResources } from "./downloadKeycloakStaticResourc import { readFieldNameUsage } from "./readFieldNameUsage"; import { readExtraPagesNames } from "./readExtraPageNames"; import { generateMessageProperties } from "./generateMessageProperties"; -import { readStaticResourcesUsage } from "./readStaticResourcesUsage"; +import { bringInAccountV1 } from "./bringInAccountV1"; export type BuildOptionsLike = { bundler: "vite" | "webpack"; @@ -33,6 +32,7 @@ export type BuildOptionsLike = { assetsDirPath: string; urlPathname: string | undefined; doBuildRetrocompatAccountTheme: boolean; + themeNames: string[]; }; assert(); @@ -59,27 +59,47 @@ export async function generateTheme(params: { ); }; - let allCssGlobalsToDefine: Record = {}; + const cssGlobalsToDefine: Record = {}; - for (const themeType of themeTypes) { + const implementedThemeTypes: Record = { + "login": false, + "account": false, + "email": false + }; + + for (const themeType of ["login", "account"] as const) { if (!fs.existsSync(pathJoin(themeSrcDirPath, themeType))) { continue; } + implementedThemeTypes[themeType] = true; + const themeTypeDirPath = getThemeTypeDirPath({ themeType }); - copy_app_resources_to_theme_path: { - const isFirstPass = themeType.indexOf(themeType) === 0; + apply_replacers_and_move_to_theme_resources: { + if (themeType === "account" && implementedThemeTypes.login) { + // NOTE: We prevend doing it twice, it has been done for the login theme. - if (!isFirstPass) { - break copy_app_resources_to_theme_path; + transformCodebase({ + "srcDirPath": pathJoin( + getThemeTypeDirPath({ + "themeType": "login" + }), + "resources", + basenameOfTheKeycloakifyResourcesDir + ), + "destDirPath": pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir) + }); + + break apply_replacers_and_move_to_theme_resources; } transformCodebase({ - "destDirPath": pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir), "srcDirPath": buildOptions.reactAppBuildDirPath, + "destDirPath": pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir), "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. if ( isInside({ "dirPath": pathJoin(buildOptions.reactAppBuildDirPath, keycloak_resources), @@ -90,20 +110,13 @@ export async function generateTheme(params: { } if (/\.css?$/i.test(filePath)) { - const { cssGlobalsToDefine, fixedCssCode } = replaceImportsInCssCode({ + const { cssGlobalsToDefine: cssGlobalsToDefineForThisFile, fixedCssCode } = replaceImportsInCssCode({ "cssCode": sourceCode.toString("utf8") }); - register_css_variables: { - if (!isFirstPass) { - break register_css_variables; - } - - allCssGlobalsToDefine = { - ...allCssGlobalsToDefine, - ...cssGlobalsToDefine - }; - } + Object.entries(cssGlobalsToDefineForThisFile).forEach(([key, value]) => { + cssGlobalsToDefine[key] = value; + }); return { "modifiedSourceCode": Buffer.from(fixedCssCode, "utf8") }; } @@ -125,7 +138,7 @@ export async function generateTheme(params: { const { generateFtlFilesCode } = generateFtlFilesCodeFactory({ themeName, "indexHtmlCode": fs.readFileSync(pathJoin(buildOptions.reactAppBuildDirPath, "index.html")).toString("utf8"), - "cssGlobalsToDefine": allCssGlobalsToDefine, + cssGlobalsToDefine, buildOptions, keycloakifyVersion, themeType, @@ -181,11 +194,6 @@ export async function generateTheme(params: { })(), "themeDirPath": pathResolve(pathJoin(themeTypeDirPath, "..")), themeType, - "usedResources": readStaticResourcesUsage({ - keycloakifySrcDirPath, - themeSrcDirPath, - themeType - }), buildOptions }); @@ -235,9 +243,82 @@ export async function generateTheme(params: { break email; } + implementedThemeTypes.email = true; + transformCodebase({ "srcDirPath": emailThemeSrcDirPath, "destDirPath": getThemeTypeDirPath({ "themeType": "email" }) }); } + + const parsedKeycloakThemeJson: { themes: { name: string; types: string[] }[] } = { "themes": [] }; + + buildOptions.themeNames.forEach(themeName => + parsedKeycloakThemeJson.themes.push({ + "name": themeName, + "types": Object.entries(implementedThemeTypes) + .filter(([, isImplemented]) => isImplemented) + .map(([themeType]) => themeType) + }) + ); + + account_specific_extra_work: { + if (!implementedThemeTypes.account) { + break account_specific_extra_work; + } + + await bringInAccountV1({ buildOptions }); + + parsedKeycloakThemeJson.themes.push({ + "name": accountV1ThemeName, + "types": ["account"] + }); + + add_retrocompat_account_theme: { + if (!buildOptions.doBuildRetrocompatAccountTheme) { + break add_retrocompat_account_theme; + } + + transformCodebase({ + "srcDirPath": getThemeTypeDirPath({ "themeType": "account" }), + "destDirPath": getThemeTypeDirPath({ "themeType": "account", "isRetrocompat": true }), + "transformSourceCode": ({ filePath, sourceCode }) => { + if (pathBasename(filePath) === "theme.properties") { + return { + "modifiedSourceCode": Buffer.from( + sourceCode.toString("utf8").replace(`parent=${accountV1ThemeName}`, "parent=keycloak"), + "utf8" + ) + }; + } + + return { "modifiedSourceCode": sourceCode }; + } + }); + + buildOptions.themeNames.forEach(themeName => + parsedKeycloakThemeJson.themes.push({ + "name": `${themeName}${retrocompatPostfix}`, + "types": ["account"] + }) + ); + } + } + + { + const keycloakThemeJsonFilePath = pathJoin( + buildOptions.keycloakifyBuildDirPath, + "src", + "main", + "resources", + "META-INF", + "keycloak-themes.json" + ); + + try { + fs.mkdirSync(pathDirname(keycloakThemeJsonFilePath)); + } catch {} + + fs.writeFileSync(keycloakThemeJsonFilePath, Buffer.from(JSON.stringify(parsedKeycloakThemeJson, null, 2), "utf8")); + } } diff --git a/src/bin/keycloakify/generateTheme/readStaticResourcesUsage.ts b/src/bin/keycloakify/generateTheme/readStaticResourcesUsage.ts deleted file mode 100644 index ea62bff6..00000000 --- a/src/bin/keycloakify/generateTheme/readStaticResourcesUsage.ts +++ /dev/null @@ -1,76 +0,0 @@ -import { crawl } from "../../tools/crawl"; -import { join as pathJoin, sep as pathSep } from "path"; -import * as fs from "fs"; -import type { ThemeType } from "../../constants"; - -/** Assumes the theme type exists */ -export function readStaticResourcesUsage(params: { keycloakifySrcDirPath: string; themeSrcDirPath: string; themeType: ThemeType }): { - resourcesCommonFilePaths: string[]; -} { - const { keycloakifySrcDirPath, themeSrcDirPath, themeType } = params; - - const resourcesCommonFilePaths = new Set(); - - for (const srcDirPath of [pathJoin(keycloakifySrcDirPath, themeType), pathJoin(themeSrcDirPath, themeType)]) { - const filePaths = crawl({ "dirPath": srcDirPath, "returnedPathsType": "absolute" }).filter(filePath => /\.(ts|tsx|js|jsx)$/.test(filePath)); - - for (const filePath of filePaths) { - const rawSourceFile = fs.readFileSync(filePath).toString("utf8"); - - if (!rawSourceFile.includes("resourcesCommonPath") && !rawSourceFile.includes("resourcesPath")) { - continue; - } - - const wrap = readPaths({ rawSourceFile }); - - wrap.resourcesCommonFilePaths.forEach(filePath => resourcesCommonFilePaths.add(filePath)); - } - } - - return { - "resourcesCommonFilePaths": Array.from(resourcesCommonFilePaths) - }; -} - -/** Exported for testing purpose */ -export function readPaths(params: { rawSourceFile: string }): { - resourcesCommonFilePaths: string[]; -} { - const { rawSourceFile } = params; - - const resourcesCommonFilePaths = new Set(); - - { - const regexp = new RegExp(`resourcesCommonPath\\s*}([^\`]+)\``, "g"); - - const matches = [...rawSourceFile.matchAll(regexp)]; - - for (const match of matches) { - const filePath = match[1]; - - resourcesCommonFilePaths.add(filePath); - } - } - - { - const regexp = new RegExp(`resourcesCommonPath\\s*[+,]\\s*["']([^"'\`]+)["'\`]`, "g"); - - const matches = [...rawSourceFile.matchAll(regexp)]; - - for (const match of matches) { - const filePath = match[1]; - - resourcesCommonFilePaths.add(filePath); - } - } - - const normalizePath = (filePath: string) => { - filePath = filePath.startsWith("/") ? filePath.slice(1) : filePath; - filePath = filePath.replace(/\//g, pathSep); - return filePath; - }; - - return { - "resourcesCommonFilePaths": Array.from(resourcesCommonFilePaths).map(normalizePath) - }; -} diff --git a/src/bin/keycloakify/keycloakify.ts b/src/bin/keycloakify/keycloakify.ts index 5e8f48ea..d8c2ffda 100644 --- a/src/bin/keycloakify/keycloakify.ts +++ b/src/bin/keycloakify/keycloakify.ts @@ -1,5 +1,5 @@ import { generateTheme } from "./generateTheme"; -import { generateJavaStackFiles } from "./generateJavaStackFiles"; +import { generatePom } from "./generatePom"; import { join as pathJoin, relative as pathRelative, basename as pathBasename, dirname as pathDirname, sep as pathSep } from "path"; import * as child_process from "child_process"; import { generateStartKeycloakTestingContainer } from "./generateStartKeycloakTestingContainer"; @@ -9,7 +9,6 @@ import { getLogger } from "../tools/logger"; import { assert } from "tsafe/assert"; import { getThemeSrcDirPath } from "../getThemeSrcDirPath"; import { getProjectRoot } from "../tools/getProjectRoot"; -import { objectKeys } from "tsafe/objectKeys"; export async function main() { const reactAppRootDirPath = process.cwd(); @@ -42,25 +41,13 @@ export async function main() { }); } - const { jarFilePath } = await generateJavaStackFiles({ - "implementedThemeTypes": (() => { - const implementedThemeTypes = { - "login": false, - "account": false, - "email": false - }; + { + const { pomFileCode } = generatePom({ buildOptions }); - for (const themeType of objectKeys(implementedThemeTypes)) { - if (!fs.existsSync(pathJoin(themeSrcDirPath, themeType))) { - continue; - } - implementedThemeTypes[themeType] = true; - } + fs.writeFileSync(pathJoin(buildOptions.keycloakifyBuildDirPath, "pom.xml"), Buffer.from(pomFileCode, "utf8")); + } - return implementedThemeTypes; - })(), - buildOptions - }); + const jarFilePath = pathJoin(buildOptions.keycloakifyBuildDirPath, "target", `${buildOptions.artifactId}-${buildOptions.themeVersion}.jar`); if (buildOptions.doCreateJar) { child_process.execSync("mvn clean install", { "cwd": buildOptions.keycloakifyBuildDirPath }); @@ -96,48 +83,16 @@ export async function main() { "", ...(!buildOptions.doCreateJar ? [] - : [ - `✅ Your keycloak theme has been generated and bundled into .${pathSep}${pathRelative(reactAppRootDirPath, jarFilePath)} 🚀`, - `It is to be placed in "/opt/keycloak/providers" in the container running a quay.io/keycloak/keycloak Docker image.`, - "" - ]), + : [`✅ Your keycloak theme has been generated and bundled into .${pathSep}${pathRelative(reactAppRootDirPath, jarFilePath)} 🚀`]), //TODO: Restore when we find a good Helm chart for Keycloak. //"Using Helm (https://github.com/codecentric/helm-charts), edit to reflect:", "", - "value.yaml: ", - " extraInitContainers: |", - " - name: realm-ext-provider", - " image: curlimages/curl", - " imagePullPolicy: IfNotPresent", - " command:", - " - sh", - " args:", - " - -c", - ` - curl -L -f -S -o /extensions/${pathBasename(jarFilePath)} https://AN.URL.FOR/${pathBasename(jarFilePath)}`, - " volumeMounts:", - " - name: extensions", - " mountPath: /extensions", - " ", - " extraVolumeMounts: |", - " - name: extensions", - " mountPath: /opt/keycloak/providers", - " extraEnv: |", - " - name: KEYCLOAK_USER", - " value: admin", - " - name: KEYCLOAK_PASSWORD", - " value: xxxxxxxxx", - " - name: JAVA_OPTS", - " value: -Dkeycloak.profile=preview", - "", - "", `To test your theme locally you can spin up a Keycloak ${containerKeycloakVersion} container image with the theme pre loaded by running:`, "", `👉 $ .${pathSep}${pathRelative( reactAppRootDirPath, pathJoin(buildOptions.keycloakifyBuildDirPath, generateStartKeycloakTestingContainer.basename) )} 👈`, - "", - `Test with different Keycloak versions by editing the .sh file. see available versions here: https://quay.io/repository/keycloak/keycloak?tab=tags`, ``, `Once your container is up and running: `, "- Log into the admin console 👉 http://localhost:8080/admin username: admin, password: admin 👈", diff --git a/src/bin/tools/downloadAndUnzip.ts b/src/bin/tools/downloadAndUnzip.ts index 4bff442b..d5c82015 100644 --- a/src/bin/tools/downloadAndUnzip.ts +++ b/src/bin/tools/downloadAndUnzip.ts @@ -1,12 +1,13 @@ import { exec as execCallback } from "child_process"; import { createHash } from "crypto"; -import { mkdir, readFile, stat, writeFile, unlink, rm } from "fs/promises"; +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 } 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"; const exec = promisify(execCallback); diff --git a/src/bin/tools/fs.rm.ts b/src/bin/tools/fs.rm.ts new file mode 100644 index 00000000..d7d41f50 --- /dev/null +++ b/src/bin/tools/fs.rm.ts @@ -0,0 +1,43 @@ +import * as fs from "fs/promises"; +import { join as pathJoin } from "path"; +import { NpmModuleVersion } from "./NpmModuleVersion"; + +/** + * Polyfill of fs.rm(dirPath, { "recursive": true }) + * For older version of Node + */ +export async function rm(dirPath: string, options: { recursive: true; force?: true }) { + if (NpmModuleVersion.compare(NpmModuleVersion.parse(process.version), NpmModuleVersion.parse("14.14.0")) > 0) { + return fs.rm(dirPath, options); + } + + const { force = true } = options; + + if (force && !(await checkDirExists(dirPath))) { + return; + } + + const removeDir_rec = async (dirPath: string) => + Promise.all( + (await fs.readdir(dirPath)).map(async basename => { + const fileOrDirpath = pathJoin(dirPath, basename); + + if ((await fs.lstat(fileOrDirpath)).isDirectory()) { + await removeDir_rec(fileOrDirpath); + } else { + await fs.unlink(fileOrDirpath); + } + }) + ); + + await removeDir_rec(dirPath); +} + +async function checkDirExists(dirPath: string) { + try { + await fs.access(dirPath, fs.constants.F_OK); + return true; + } catch { + return false; + } +} diff --git a/src/bin/tools/fs.rmSync.ts b/src/bin/tools/fs.rmSync.ts new file mode 100644 index 00000000..ff7f5ff8 --- /dev/null +++ b/src/bin/tools/fs.rmSync.ts @@ -0,0 +1,33 @@ +import * as fs from "fs"; +import { join as pathJoin } from "path"; +import { NpmModuleVersion } from "./NpmModuleVersion"; + +/** + * Polyfill of fs.rmSync(dirPath, { "recursive": true }) + * For older version of Node + */ +export function rmSync(dirPath: string, options: { recursive: true; force?: true }) { + if (NpmModuleVersion.compare(NpmModuleVersion.parse(process.version), NpmModuleVersion.parse("14.14.0")) > 0) { + fs.rmSync(dirPath, options); + } + + const { force = true } = options; + + if (force && !fs.existsSync(dirPath)) { + return; + } + + const removeDir_rec = (dirPath: string) => + fs.readdirSync(dirPath).forEach(basename => { + const fileOrDirpath = pathJoin(dirPath, basename); + + if (fs.lstatSync(fileOrDirpath).isDirectory()) { + removeDir_rec(fileOrDirpath); + return; + } else { + fs.unlinkSync(fileOrDirpath); + } + }); + + removeDir_rec(dirPath); +} diff --git a/src/bin/tools/transformCodebase.ts b/src/bin/tools/transformCodebase.ts index 2064fe7d..5b59978e 100644 --- a/src/bin/tools/transformCodebase.ts +++ b/src/bin/tools/transformCodebase.ts @@ -2,6 +2,7 @@ import * as fs from "fs"; import * as path from "path"; import { crawl } from "./crawl"; import { id } from "tsafe/id"; +import { rmSync } from "../tools/fs.rmSync"; type TransformSourceCode = (params: { sourceCode: Buffer; filePath: string; fileRelativePath: string }) => | { @@ -10,15 +11,25 @@ type TransformSourceCode = (params: { sourceCode: Buffer; filePath: string; file } | undefined; -/** Apply a transformation function to every file of directory */ +/** + * Apply a transformation function to every file of directory + * If source and destination are the same this function can be used to apply the transformation in place + * like filtering out some files or modifying them. + * */ export function transformCodebase(params: { srcDirPath: string; destDirPath: string; transformSourceCode?: TransformSourceCode }) { const { srcDirPath, - destDirPath, transformSourceCode = id(({ sourceCode }) => ({ "modifiedSourceCode": sourceCode })) } = params; + let { destDirPath } = params; + + const isTargetSameAsSource = path.relative(srcDirPath, destDirPath) === ""; + + if (isTargetSameAsSource) { + destDirPath = path.join(srcDirPath, "..", "tmp_xOsPdkPsTdzPs34sOkHs"); + } for (const fileRelativePath of crawl({ "dirPath": srcDirPath, "returnedPathsType": "relative to dirPath" })) { const filePath = path.join(srcDirPath, fileRelativePath); @@ -44,4 +55,10 @@ export function transformCodebase(params: { srcDirPath: string; destDirPath: str modifiedSourceCode ); } + + if (isTargetSameAsSource) { + rmSync(srcDirPath, { "recursive": true }); + + fs.renameSync(destDirPath, srcDirPath); + } } From 884b701fc691f226aad731439f6d892a7c8b6dad Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 5 Feb 2024 09:26:54 +0100 Subject: [PATCH 20/83] Removing keycloak-resources dir from dist dir after build --- src/vite-plugin/vite-plugin.ts | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index 7d8fa96c..6bec4d71 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -3,18 +3,21 @@ import { readParsedPackageJson } from "../bin/keycloakify/buildOptions/parsedPac import type { Plugin } from "vite"; import { assert } from "tsafe/assert"; import * as fs from "fs"; -import { resolvedViteConfigJsonBasename, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../bin/constants"; +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 { replaceAll } from "../bin/tools/String.prototype.replaceAll"; import { id } from "tsafe/id"; +import { rm } from "../bin/tools/fs.rm"; export function keycloakify(): Plugin { let reactAppRootDirPath: string | undefined = undefined; let urlPathname: string | undefined = undefined; + let buildDirPath: string | undefined = undefined; return { "name": "keycloakify", + "apply": "build", "configResolved": resolvedConfig => { reactAppRootDirPath = resolvedConfig.root; urlPathname = (() => { @@ -35,6 +38,8 @@ export function keycloakify(): Plugin { return out; })(); + buildDirPath = pathJoin(reactAppRootDirPath, resolvedConfig.build.outDir); + const { keycloakifyBuildDirPath } = getKeycloakifyBuildDirPath({ "parsedPackageJson_keycloakify_keycloakifyBuildDirPath": readParsedPackageJson({ reactAppRootDirPath }).keycloakify ?.keycloakifyBuildDirPath, @@ -113,6 +118,11 @@ export function keycloakify(): Plugin { return { "code": transformedCode }; + }, + "buildEnd": async () => { + assert(buildDirPath !== undefined); + + await rm(pathJoin(buildDirPath, keycloak_resources), { "recursive": true, "force": true }); } }; } From 5076c1e93f12654dd95766f68203798f46854ce7 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 6 Feb 2024 07:28:03 +0100 Subject: [PATCH 21/83] Unit test passing --- package.json | 2 +- .../replaceImportsInJsCode/webpack.ts | 2 +- test/bin/readStaticResourcesUsage.spec.ts | 104 ------------------ test/bin/replacers.spec.ts | 32 +++--- ... setupSampleReactProject.spec.ts.disabled} | 0 5 files changed, 18 insertions(+), 122 deletions(-) delete mode 100644 test/bin/readStaticResourcesUsage.spec.ts rename test/bin/{setupSampleReactProject.spec.ts => setupSampleReactProject.spec.ts.disabled} (100%) diff --git a/package.json b/package.json index 38bf22fe..52f2f788 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,7 @@ "generate:json-schema": "ts-node scripts/generate-json-schema.ts", "grant-exec-perms": "node dist/bin/tools/grant-exec-perms.js", "copy-files": "copyfiles -u 1 src/**/*.ftl src/**/*.java", - "test": "echo 'yarn test:types && vitest run'", + "test": "yarn test:types && vitest run", "test:keycloakify-starter": "ts-node scripts/test-keycloakify-starter", "test:types": "tsc -p test/tsconfig.json --noEmit", "_format": "prettier '**/*.{ts,tsx,json,md}'", diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts index 9105637a..a40f79e7 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts @@ -82,7 +82,7 @@ export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOp .replace(...getReplaceArgs("js")) .replace(...getReplaceArgs("css")) .replace( - new RegExp(`[a-zA-Z]+\\.[a-zA-Z]+\\+"${staticDir.replace(/\//g, "\\/")}"`, "g"), + new RegExp(`[a-zA-Z]+\\.[a-zA-Z]+\\+"${staticDir.replace(/\//g, "\\/")}`, "g"), `window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/${staticDir}` ) //TODO: Write a test case for this diff --git a/test/bin/readStaticResourcesUsage.spec.ts b/test/bin/readStaticResourcesUsage.spec.ts deleted file mode 100644 index 1cd0296e..00000000 --- a/test/bin/readStaticResourcesUsage.spec.ts +++ /dev/null @@ -1,104 +0,0 @@ -import { readPaths } from "keycloakify/bin/keycloakify/generateTheme/readStaticResourcesUsage"; -import { same } from "evt/tools/inDepth/same"; -import { expect, it, describe } from "vitest"; - -describe("Ensure it's able to extract used Keycloak resources", () => { - const expectedPaths = { - "resourcesCommonFilePaths": [ - "node_modules/patternfly/dist/css/patternfly.min.css", - "node_modules/patternfly/dist/css/patternfly-additions.min.css", - "lib/zocial/zocial.css", - "node_modules/jquery/dist/jquery.min.js" - ] - }; - - it("works with coding style n°1", () => { - const paths = readPaths({ - "rawSourceFile": ` - const { isReady } = usePrepareTemplate({ - "doFetchDefaultThemeResources": doUseDefaultCss, - "styles": [ - \`\${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly.min.css\`, - \`\${ - url.resourcesCommonPath - }/node_modules/patternfly/dist/css/patternfly-additions.min.css\`, - \`\${resourcesCommonPath }/lib/zocial/zocial.css\`, - \`\${url.resourcesPath}/css/login.css\` - ], - "htmlClassName": getClassName("kcHtmlClass"), - "bodyClassName": undefined - }); - - const { prLoaded, remove } = headInsert({ - "type": "javascript", - "src": \`\${kcContext.url.resourcesCommonPath}/node_modules/jquery/dist/jquery.min.js\` - }); - - ` - }); - - expect(same(paths, expectedPaths)).toBe(true); - }); - - it("works with coding style n°2", () => { - const paths = readPaths({ - "rawSourceFile": ` - - const { isReady } = usePrepareTemplate({ - "doFetchDefaultThemeResources": doUseDefaultCss, - "styles": [ - url.resourcesCommonPath + "/node_modules/patternfly/dist/css/patternfly.min.css", - url.resourcesCommonPath + '/node_modules/patternfly/dist/css/patternfly-additions.min.css', - url.resourcesCommonPath - + "/lib/zocial/zocial.css", - url.resourcesPath + - '/css/login.css' - ], - "htmlClassName": getClassName("kcHtmlClass"), - "bodyClassName": undefined - }); - - const { prLoaded, remove } = headInsert({ - "type": "javascript", - "src": kcContext.url.resourcesCommonPath + "/node_modules/jquery/dist/jquery.min.js\" - }); - - - ` - }); - - expect(same(paths, expectedPaths)).toBe(true); - }); - - it("works with coding style n°3", () => { - const paths = readPaths({ - "rawSourceFile": ` - - const { isReady } = usePrepareTemplate({ - "doFetchDefaultThemeResources": doUseDefaultCss, - "styles": [ - path.join(resourcesCommonPath,"/node_modules/patternfly/dist/css/patternfly.min.css"), - path.join(url.resourcesCommonPath, '/node_modules/patternfly/dist/css/patternfly-additions.min.css'), - path.join(url.resourcesCommonPath, - "/lib/zocial/zocial.css"), - pathJoin( - url.resourcesPath, - 'css/login.css' - ) - ], - "htmlClassName": getClassName("kcHtmlClass"), - "bodyClassName": undefined - }); - - const { prLoaded, remove } = headInsert({ - "type": "javascript", - "src": path.join(kcContext.url.resourcesCommonPath, "/node_modules/jquery/dist/jquery.min.js") - }); - - - ` - }); - - expect(same(paths, expectedPaths)).toBe(true); - }); -}); diff --git a/test/bin/replacers.spec.ts b/test/bin/replacers.spec.ts index d0dc1cb9..2390ea3f 100644 --- a/test/bin/replacers.spec.ts +++ b/test/bin/replacers.spec.ts @@ -74,7 +74,7 @@ describe("js replacer - vite", () => { ] as const) { const { fixedJsCode } = replaceImportsInJsCode_vite({ "jsCode": jsCodeUntransformed, - "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js"], + "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js", "keycloakify-logo-mqjydaoZ.png"], "buildOptions": { reactAppBuildDirPath, assetsDirPath, @@ -84,13 +84,13 @@ describe("js replacer - vite", () => { }); const fixedJsCodeExpected = ` - S=(window.${nameOfTheGlobal}.url + "/${basenameOfTheKeycloakifyResourcesDir}/assets/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ + S=(window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/assets/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ function __vite__mapDeps(indexes) { if (!__vite__mapDeps.viteFileDeps) { __vite__mapDeps.viteFileDeps = [ - (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/Login-dJpPRzM4.js)", - (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/index-XwzrZ5Gu.js)" + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/Login-dJpPRzM4.js"), + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/index-XwzrZ5Gu.js") ] } return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) @@ -103,11 +103,11 @@ describe("js replacer - vite", () => { it("replaceImportsInJsCode_vite - 4", () => { const jsCodeUntransformed = ` - S="/assets/keycloakify-logo-mqjydaoZ.png",H=(()=>{ + S="/foo/bar/keycloakify-logo-mqjydaoZ.png",H=(()=>{ function __vite__mapDeps(indexes) { if (!__vite__mapDeps.viteFileDeps) { - __vite__mapDeps.viteFileDeps = ["assets/Login-dJpPRzM4.js", "assets/index-XwzrZ5Gu.js"] + __vite__mapDeps.viteFileDeps = ["foo/bar/Login-dJpPRzM4.js", "foo/bar/index-XwzrZ5Gu.js"] } return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) } @@ -127,7 +127,7 @@ describe("js replacer - vite", () => { ] as const) { const { fixedJsCode } = replaceImportsInJsCode_vite({ "jsCode": jsCodeUntransformed, - "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js"], + "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js", "keycloakify-logo-mqjydaoZ.png"], "buildOptions": { reactAppBuildDirPath, assetsDirPath, @@ -137,13 +137,13 @@ describe("js replacer - vite", () => { }); const fixedJsCodeExpected = ` - S=(window.${nameOfTheGlobal}.url + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ + S=(window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ function __vite__mapDeps(indexes) { if (!__vite__mapDeps.viteFileDeps) { __vite__mapDeps.viteFileDeps = [ - (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/Login-dJpPRzM4.js)", - (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/index-XwzrZ5Gu.js)" + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/Login-dJpPRzM4.js"), + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/foo/bar/index-XwzrZ5Gu.js") ] } return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) @@ -180,7 +180,7 @@ describe("js replacer - vite", () => { ] as const) { const { fixedJsCode } = replaceImportsInJsCode_vite({ "jsCode": jsCodeUntransformed, - "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js"], + "basenameOfAssetsFiles": ["Login-dJpPRzM4.js", "index-XwzrZ5Gu.js", "keycloakify-logo-mqjydaoZ.png"], "buildOptions": { reactAppBuildDirPath, assetsDirPath, @@ -190,13 +190,13 @@ describe("js replacer - vite", () => { }); const fixedJsCodeExpected = ` - S=(window.${nameOfTheGlobal}.url + "/${basenameOfTheKeycloakifyResourcesDir}/assets/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ + S=(window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/assets/keycloakify-logo-mqjydaoZ.png"),H=(()=>{ function __vite__mapDeps(indexes) { if (!__vite__mapDeps.viteFileDeps) { __vite__mapDeps.viteFileDeps = [ - (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/Login-dJpPRzM4.js)", - (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/index-XwzrZ5Gu.js)" + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/Login-dJpPRzM4.js"), + (window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/assets/index-XwzrZ5Gu.js") ] } return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) @@ -245,7 +245,7 @@ describe("js replacer - webpack", () => { "jsCode": jsCodeUntransformed, "buildOptions": { "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/build", - "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/build/static", + "assetsDirPath": "/Users/someone/github/keycloakify-starter/build/static", "urlPathname": undefined } }); @@ -332,7 +332,7 @@ describe("js replacer - webpack", () => { "jsCode": jsCodeUntransformed, "buildOptions": { "reactAppBuildDirPath": "/Users/someone/github/keycloakify-starter/build", - "assetsDirPath": "/Users/someone/github/keycloakify-starter/dist/build/static", + "assetsDirPath": "/Users/someone/github/keycloakify-starter/build/static", "urlPathname": "/foo-bar/" } }); diff --git a/test/bin/setupSampleReactProject.spec.ts b/test/bin/setupSampleReactProject.spec.ts.disabled similarity index 100% rename from test/bin/setupSampleReactProject.spec.ts rename to test/bin/setupSampleReactProject.spec.ts.disabled From 4290cd23b2c8c4916fe6c9d75c9a0afa41098e5f Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 6 Feb 2024 07:29:48 +0100 Subject: [PATCH 22/83] Remove what seems to be dead code (not used in the starter nor in onyxia, besite, looks fishy) '//TODO: Write a test case for this' for ref and .chunk.css", --- .../keycloakify/replacers/replaceImportsInJsCode/webpack.ts | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts index a40f79e7..6adf4193 100644 --- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts +++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts @@ -84,12 +84,6 @@ export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOp .replace( new RegExp(`[a-zA-Z]+\\.[a-zA-Z]+\\+"${staticDir.replace(/\//g, "\\/")}`, "g"), `window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/${staticDir}` - ) - //TODO: Write a test case for this - .replace( - /".chunk.css",([a-zA-Z])+=[a-zA-Z]+\.[a-zA-Z]+\+([a-zA-Z]+),/, - (...[, group1, group2]) => - `".chunk.css",${group1} = window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/" + ${group2},` ); return { fixedJsCode }; From 6c622b15804a66062d8debd4929a57db90786306 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 6 Feb 2024 07:55:32 +0100 Subject: [PATCH 23/83] Remove TODO comment --- src/bin/keycloakify/keycloakify.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/bin/keycloakify/keycloakify.ts b/src/bin/keycloakify/keycloakify.ts index d8c2ffda..69b2e256 100644 --- a/src/bin/keycloakify/keycloakify.ts +++ b/src/bin/keycloakify/keycloakify.ts @@ -84,8 +84,6 @@ export async function main() { ...(!buildOptions.doCreateJar ? [] : [`✅ Your keycloak theme has been generated and bundled into .${pathSep}${pathRelative(reactAppRootDirPath, jarFilePath)} 🚀`]), - //TODO: Restore when we find a good Helm chart for Keycloak. - //"Using Helm (https://github.com/codecentric/helm-charts), edit to reflect:", "", `To test your theme locally you can spin up a Keycloak ${containerKeycloakVersion} container image with the theme pre loaded by running:`, "", From 18900d20e169583944307671db6db09a3b90fd8f Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 6 Feb 2024 07:56:06 +0100 Subject: [PATCH 24/83] Update All contributors --- README.md | 12 +----------- 1 file changed, 1 insertion(+), 11 deletions(-) diff --git a/README.md b/README.md index 0acfb895..fcd5d23b 100644 --- a/README.md +++ b/README.md @@ -114,6 +114,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d Markus Siemens
    Markus Siemens
    💻 Rlok
    Rlok
    💻 Moulyy
    Moulyy
    💻 + giorgoslytos
    giorgoslytos
    💻 @@ -125,17 +126,6 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d # Changelog highlights -## 9.2 - -Remove the `_retrocompat` option in the account theme dropdown and the `doBuildRetrocompatAccountTheme` build option. -`_retrocompat` was useless because `` works fine even on older Keycloak version. - -What you have to remember is that: - -- If you have no account theme: You can use the `retrocompat_*.jar` it will work on any Keycloak version. -- If you have an Account theme: Use `retrocompat_*.jar` only if your Keycloak is in a version prior to 23. - Keycloak 22 is not supported (Only login themes works in Keycloak 22). - ## 9.0 Bring back support for account themes in Keycloak v23 and up! [See issue](https://github.com/keycloakify/keycloakify/issues/389). From c091089830efb97f3d8899cc3d982cfe1562e90b Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 6 Feb 2024 07:59:21 +0100 Subject: [PATCH 25/83] Apply #502 from main --- src/login/lib/useGetClassName.ts | 2 +- src/login/pages/LoginOtp.tsx | 160 +++++++++++++------------------ 2 files changed, 66 insertions(+), 96 deletions(-) diff --git a/src/login/lib/useGetClassName.ts b/src/login/lib/useGetClassName.ts index 2692cfb5..25bb6572 100644 --- a/src/login/lib/useGetClassName.ts +++ b/src/login/lib/useGetClassName.ts @@ -94,7 +94,7 @@ export const { useGetClassName } = createUseClassName({ "kcAuthenticatorWebAuthnPasswordlessClass": "fa fa-key list-view-pf-icon-lg", //css classes for the OTP Login Form - "kcSelectOTPListClass": "card-pf card-pf-view card-pf-view-select card-pf-view-single-select", + "kcSelectOTPListClass": "card-pf card-pf-view card-pf-view-select card-pf-view-single-select col-xs-12", "kcSelectOTPListItemClass": "card-pf-body card-pf-top-element", "kcAuthenticatorOtpCircleClass": "fa fa-mobile card-pf-icon-circle", "kcSelectOTPItemHeadingClass": "card-pf-title text-center", diff --git a/src/login/pages/LoginOtp.tsx b/src/login/pages/LoginOtp.tsx index f4e99d34..3dc8419b 100644 --- a/src/login/pages/LoginOtp.tsx +++ b/src/login/pages/LoginOtp.tsx @@ -1,5 +1,3 @@ -import { useEffect } from "react"; -import { headInsert } from "keycloakify/tools/headInsert"; import { clsx } from "keycloakify/tools/clsx"; import type { PageProps } from "keycloakify/login/pages/PageProps"; import { useGetClassName } from "keycloakify/login/lib/useGetClassName"; @@ -18,105 +16,77 @@ export default function LoginOtp(props: PageProps { - let isCleanedUp = false; - - const { prLoaded, remove } = headInsert({ - "type": "javascript", - "src": `${kcContext.url.resourcesCommonPath}/node_modules/jquery/dist/jquery.min.js` - }); - - (async () => { - await prLoaded; - - if (isCleanedUp) { - return; - } - - evaluateInlineScript(); - })(); - - return () => { - isCleanedUp = true; - remove(); - }; - }, []); - return ( - + ); } - -declare const $: any; - -function evaluateInlineScript() { - $(document).ready(function () { - // Card Single Select - $(".card-pf-view-single-select").click(function (this: any) { - if ($(this).hasClass("active")) { - $(this).removeClass("active"); - $(this).children().removeAttr("name"); - } else { - $(".card-pf-view-single-select").removeClass("active"); - $(".card-pf-view-single-select").children().removeAttr("name"); - $(this).addClass("active"); - $(this).children().attr("name", "selectedCredentialId"); - } - }); - - var defaultCred = $(".card-pf-view-single-select")[0]; - if (defaultCred) { - defaultCred.click(); - } - }); -} From f642a56eaa0ef6b1dd6407abc6da76633531a1a1 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 6 Feb 2024 08:00:07 +0100 Subject: [PATCH 26/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 52f2f788..818517e4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.3.0-rc.0", + "version": "9.4.0-rc.0", "description": "Create Keycloak themes using React", "repository": { "type": "git", From e1b52e743951380cec90b3ebdd1f7dd47763ade7 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Wed, 7 Feb 2024 21:14:03 +0100 Subject: [PATCH 27/83] Implement remote caching mechanism to prevent full download of the Keycloak sources --- scripts/generate-i18n-messages.ts | 1 - src/bin/tools/downloadAndUnzip.ts | 88 +++++++++++++++++++++++++------ 2 files changed, 73 insertions(+), 16 deletions(-) diff --git a/scripts/generate-i18n-messages.ts b/scripts/generate-i18n-messages.ts index 6775835b..823fb1e8 100644 --- a/scripts/generate-i18n-messages.ts +++ b/scripts/generate-i18n-messages.ts @@ -5,7 +5,6 @@ import { crawl } from "../src/bin/tools/crawl"; import { downloadBuiltinKeycloakTheme } from "../src/bin/download-builtin-keycloak-theme"; import { getProjectRoot } from "../src/bin/tools/getProjectRoot"; import { getLogger } from "../src/bin/tools/logger"; -import { rmSync } from "../src/bin/tools/fs.rmSync"; // NOTE: To run without argument when we want to generate src/i18n/generated_kcMessages files, // update the version array for generating for newer version. diff --git a/src/bin/tools/downloadAndUnzip.ts b/src/bin/tools/downloadAndUnzip.ts index 7f131454..1a530a45 100644 --- a/src/bin/tools/downloadAndUnzip.ts +++ b/src/bin/tools/downloadAndUnzip.ts @@ -2,12 +2,13 @@ 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 } from "path"; +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); @@ -188,10 +189,31 @@ export async function downloadAndUnzip( const zipFilePath = pathJoin(cacheDirPath, `${zipFileBasename}.zip`); const extractDirPath = pathJoin(cacheDirPath, `tmp_unzip_${zipFileBasename}`); - if (!(await exists(zipFilePath))) { + download_zip_and_transform: { + if (await exists(zipFilePath)) { + break download_zip_and_transform; + } + const opts = await getFetchOptions(); - const response = await fetch(url, opts); + + 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.) @@ -201,26 +223,62 @@ export async function downloadAndUnzip( */ response.body?.setMaxListeners(Number.MAX_VALUE); assert(typeof response.body !== "undefined" && response.body != null); + await writeFile(zipFilePath, response.body); - if (specificDirsToExtract !== undefined || preCacheTransform !== undefined) { - await unzip(zipFilePath, extractDirPath, specificDirsToExtract); + if (isFromRemoteCache) { + break download_zip_and_transform; + } - try { - await preCacheTransform?.action({ - "destDirPath": extractDirPath - }); - } catch (error) { - await Promise.all([rm(extractDirPath, { "recursive": true }), unlink(zipFilePath)]); + if (specificDirsToExtract === undefined && preCacheTransform === undefined) { + break download_zip_and_transform; + } - throw error; + 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; } - await unlink(zipFilePath); + console.log("uploading to remote cache"); - await zip(extractDirPath, zipFilePath); + try { + child_process.execSync(`which putasset`); + } catch { + child_process.execSync(`npm install -g putasset`); + } - await rm(extractDirPath, { "recursive": true }); + child_process.execFileSync("putasset", [ + "--owner", + "keycloakify", + "--repo", + "keycloakify", + "--tag", + "v0.0.1", + "--filename", + zipFilePath, + "--token", + githubToken + ]); } } From 4ad7183d7e579d9ecad92297247c5d23fe119e59 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Wed, 7 Feb 2024 21:22:58 +0100 Subject: [PATCH 28/83] Prevent crashing when github is not up to date yet --- scripts/generate-i18n-messages.ts | 2 +- src/bin/tools/downloadAndUnzip.ts | 28 ++++++++++++++++------------ 2 files changed, 17 insertions(+), 13 deletions(-) diff --git a/scripts/generate-i18n-messages.ts b/scripts/generate-i18n-messages.ts index 823fb1e8..9888c048 100644 --- a/scripts/generate-i18n-messages.ts +++ b/scripts/generate-i18n-messages.ts @@ -17,7 +17,7 @@ const isSilent = true; const logger = getLogger({ isSilent }); async function main() { - const keycloakVersion = "23.0.4"; + const keycloakVersion = "11.0.3"; const tmpDirPath = pathJoin(getProjectRoot(), "tmp_xImOef9dOd44"); diff --git a/src/bin/tools/downloadAndUnzip.ts b/src/bin/tools/downloadAndUnzip.ts index 1a530a45..2ea775f4 100644 --- a/src/bin/tools/downloadAndUnzip.ts +++ b/src/bin/tools/downloadAndUnzip.ts @@ -267,18 +267,22 @@ export async function downloadAndUnzip( child_process.execSync(`npm install -g putasset`); } - child_process.execFileSync("putasset", [ - "--owner", - "keycloakify", - "--repo", - "keycloakify", - "--tag", - "v0.0.1", - "--filename", - zipFilePath, - "--token", - githubToken - ]); + 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"); + } } } From cd1cc37916f6a246fc5d2f2370961f64cf7f3fae Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 00:12:10 +0100 Subject: [PATCH 29/83] Explicitely exclude a number of node deps from Keycloak commons for bundle size --- scripts/generate-i18n-messages.ts | 2 +- src/bin/download-builtin-keycloak-theme.ts | 136 +++++++++++++-------- 2 files changed, 89 insertions(+), 49 deletions(-) diff --git a/scripts/generate-i18n-messages.ts b/scripts/generate-i18n-messages.ts index 9888c048..823fb1e8 100644 --- a/scripts/generate-i18n-messages.ts +++ b/scripts/generate-i18n-messages.ts @@ -17,7 +17,7 @@ const isSilent = true; const logger = getLogger({ isSilent }); async function main() { - const keycloakVersion = "11.0.3"; + const keycloakVersion = "23.0.4"; const tmpDirPath = pathJoin(getProjectRoot(), "tmp_xImOef9dOd44"); diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index 8ddd4b68..8108943e 100644 --- a/src/bin/download-builtin-keycloak-theme.ts +++ b/src/bin/download-builtin-keycloak-theme.ts @@ -50,43 +50,94 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st }); } - install_and_move_to_common_resources_generated_in_keycloak_v2: { - const accountV2DirSrcDirPath = pathJoin(destDirPath, "keycloak.v2", "account", "src"); + remove_keycloak_v2: { + const keycloakV2DirPath = pathJoin(destDirPath, "keycloak.v2"); - if (!fs.existsSync(accountV2DirSrcDirPath)) { - break install_and_move_to_common_resources_generated_in_keycloak_v2; + if (!fs.existsSync(keycloakV2DirPath)) { + break remove_keycloak_v2; } - const packageManager = fs.existsSync(pathJoin(accountV2DirSrcDirPath, "pnpm-lock.yaml")) ? "pnpm" : "npm"; + rmSync(keycloakV2DirPath, { "recursive": true }); + } - if (packageManager === "pnpm") { - try { - child_process.execSync(`which pnpm`); - } catch { - console.log(`Installing pnpm globally`); - child_process.execSync(`npm install -g pnpm`); + // 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"); + + if (!fs.existsSync(pathOfNodeModules)) { + break remove_unused_node_modules; + } + + const toDeletePerfixes = [ + "angular", + "bootstrap", + "rcue", + "font-awesome", + "ng-file-upload", + pathJoin("patternfly", "dist", "sass"), + pathJoin("patternfly", "dist", "less"), + pathJoin("patternfly", "dist", "js"), + "d3", + pathJoin("jquery", "src"), + "c3", + "core-js", + "eonasdan-bootstrap-datetimepicker", + "moment", + "react", + "patternfly-bootstrap-treeview", + "popper.js", + "tippy.js", + "jquery-match-height", + "google-code-prettify", + "patternfly-bootstrap-combobox", + "focus-trap", + "tabbable", + "scheduler", + "@types", + "datatables.net", + "datatables.net-colreorder", + "tslib", + "prop-types", + "file-selector", + "datatables.net-colreorder-bs", + "object-assign", + "warning", + "js-tokens", + "loose-envify", + "prop-types-extra", + "attr-accept", + "datatables.net-select", + "drmonty-datatables-colvis", + "datatables.net-bs", + pathJoin("@patternfly", "react"), + pathJoin("@patternfly", "patternfly", "docs") + ]; + + transformCodebase({ + "srcDirPath": pathOfNodeModules, + "destDirPath": pathOfNodeModules, + "transformSourceCode": ({ sourceCode, fileRelativePath }) => { + if (fileRelativePath.endsWith(".map")) { + return undefined; + } + + if (toDeletePerfixes.find(prefix => fileRelativePath.startsWith(prefix)) !== undefined) { + return undefined; + } + + if (fileRelativePath.startsWith(pathJoin("patternfly", "dist", "fonts"))) { + if ( + !fileRelativePath.endsWith(".woff2") && + !fileRelativePath.endsWith(".woff") && + !fileRelativePath.endsWith(".ttf") + ) { + return undefined; + } + } + + return { "modifiedSourceCode": sourceCode }; } - } - - child_process.execSync(`${packageManager} install`, { "cwd": accountV2DirSrcDirPath, "stdio": "ignore" }); - - const packageJsonFilePath = pathJoin(accountV2DirSrcDirPath, "package.json"); - - const packageJsonRaw = fs.readFileSync(packageJsonFilePath); - - const parsedPackageJson = JSON.parse(packageJsonRaw.toString("utf8")); - - parsedPackageJson.scripts.build = parsedPackageJson.scripts.build - .replace(`${packageManager} run check-types`, "true") - .replace(`${packageManager} run babel`, "true"); - - fs.writeFileSync(packageJsonFilePath, Buffer.from(JSON.stringify(parsedPackageJson, null, 2), "utf8")); - - child_process.execSync(`${packageManager} run build`, { "cwd": accountV2DirSrcDirPath, "stdio": "ignore" }); - - fs.writeFileSync(packageJsonFilePath, packageJsonRaw); - - rmSync(pathJoin(accountV2DirSrcDirPath, "node_modules"), { "recursive": true }); + }); } last_account_v1_transformations: { @@ -133,11 +184,11 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st // Note, this is an optimization for reducing the size of the jar { - const defaultThemeCommonResourcesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources"); + const nodeModulesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources"); const usedCommonResourceRelativeFilePaths = [ ...["patternfly.min.css", "patternfly-additions.min.css", "patternfly-additions.min.css"].map(fileBasename => - pathJoin("node_modules", "patternfly", "dist", "css", fileBasename) + pathJoin("patternfly", "dist", "css", fileBasename) ), ...[ "OpenSans-Light-webfont.woff2", @@ -152,12 +203,12 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st "OpenSans-Light-webfont.ttf", "OpenSans-Semibold-webfont.ttf", "OpenSans-Bold-webfont.ttf" - ].map(fileBasename => pathJoin("node_modules", "patternfly", "dist", "fonts", fileBasename)) + ].map(fileBasename => pathJoin("patternfly", "dist", "fonts", fileBasename)) ]; transformCodebase({ - "srcDirPath": defaultThemeCommonResourcesDirPath, - "destDirPath": defaultThemeCommonResourcesDirPath, + "srcDirPath": nodeModulesDirPath, + "destDirPath": nodeModulesDirPath, "transformSourceCode": ({ sourceCode, fileRelativePath }) => { if (!usedCommonResourceRelativeFilePaths.includes(fileRelativePath)) { return undefined; @@ -167,17 +218,6 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st } }); } - - // Other optimization: Remove AngularJS - { - const nodeModuleDirPath = pathJoin(destDirPath, "keycloak", "common", "resources", "node_modules"); - - fs.readdirSync(nodeModuleDirPath) - .filter(basename => basename.startsWith("angular")) - .map(basename => pathJoin(nodeModuleDirPath, basename)) - .filter(dirPath => fs.statSync(dirPath).isDirectory()) - .forEach(dirPath => rmSync(dirPath, { "recursive": true })); - } } } } From 3e336f4937efb46d7aa7582bde2108749871319a Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 00:12:50 +0100 Subject: [PATCH 30/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 818517e4..867ae040 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.0", + "version": "9.4.0-rc.1", "description": "Create Keycloak themes using React", "repository": { "type": "git", From 5bf905723c6ca0fd49ba0006d504a7a064e5c9fc Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 00:56:33 +0100 Subject: [PATCH 31/83] Feature -p or --project option for ease of use in monorepo setups #449 --- src/bin/copy-keycloak-resources-to-public.ts | 5 +--- src/bin/download-builtin-keycloak-theme.ts | 1 - src/bin/initialize-email-theme.ts | 5 +--- .../keycloakify/buildOptions/buildOptions.ts | 25 +++++++++++++------ src/bin/keycloakify/keycloakify.ts | 14 ++++++----- 5 files changed, 28 insertions(+), 22 deletions(-) diff --git a/src/bin/copy-keycloak-resources-to-public.ts b/src/bin/copy-keycloak-resources-to-public.ts index 5c8d276c..b4e9db67 100644 --- a/src/bin/copy-keycloak-resources-to-public.ts +++ b/src/bin/copy-keycloak-resources-to-public.ts @@ -7,10 +7,7 @@ import { themeTypes, keycloak_resources, lastKeycloakVersionWithAccountV1 } from import * as fs from "fs"; (async () => { - const reactAppRootDirPath = process.cwd(); - const buildOptions = readBuildOptions({ - reactAppRootDirPath, "processArgv": process.argv.slice(2) }); @@ -45,5 +42,5 @@ import * as fs from "fs"; fs.writeFileSync(pathJoin(buildOptions.publicDirPath, keycloak_resources, ".gitignore"), Buffer.from("*", "utf8")); - console.log(`${pathRelative(reactAppRootDirPath, reservedDirPath)} directory created.`); + console.log(`${pathRelative(buildOptions.reactAppRootDirPath, reservedDirPath)} directory created.`); })(); diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index 8108943e..d6e8d6ba 100644 --- a/src/bin/download-builtin-keycloak-theme.ts +++ b/src/bin/download-builtin-keycloak-theme.ts @@ -226,7 +226,6 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st async function main() { const buildOptions = readBuildOptions({ - "reactAppRootDirPath": process.cwd(), "processArgv": process.argv.slice(2) }); diff --git a/src/bin/initialize-email-theme.ts b/src/bin/initialize-email-theme.ts index 84dbb93b..4e2be98f 100644 --- a/src/bin/initialize-email-theme.ts +++ b/src/bin/initialize-email-theme.ts @@ -11,17 +11,14 @@ import { getThemeSrcDirPath } from "./getThemeSrcDirPath"; import { rmSync } from "./tools/fs.rmSync"; export async function main() { - const reactAppRootDirPath = process.cwd(); - const buildOptions = readBuildOptions({ - reactAppRootDirPath, "processArgv": process.argv.slice(2) }); const logger = getLogger({ "isSilent": buildOptions.isSilent }); const { themeSrcDirPath } = getThemeSrcDirPath({ - reactAppRootDirPath + "reactAppRootDirPath": buildOptions.reactAppRootDirPath }); const emailThemeSrcDirPath = pathJoin(themeSrcDirPath, "email"); diff --git a/src/bin/keycloakify/buildOptions/buildOptions.ts b/src/bin/keycloakify/buildOptions/buildOptions.ts index bb462d59..6045721a 100644 --- a/src/bin/keycloakify/buildOptions/buildOptions.ts +++ b/src/bin/keycloakify/buildOptions/buildOptions.ts @@ -30,8 +30,23 @@ export type BuildOptions = { doBuildRetrocompatAccountTheme: boolean; }; -export function readBuildOptions(params: { reactAppRootDirPath: string; processArgv: string[] }): BuildOptions { - const { reactAppRootDirPath, processArgv } = params; +export function readBuildOptions(params: { processArgv: string[] }): BuildOptions { + 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() + }); + })(); const parsedPackageJson = readParsedPackageJson({ reactAppRootDirPath }); @@ -85,11 +100,7 @@ export function readBuildOptions(params: { reactAppRootDirPath: string; processA return { "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack", - "isSilent": (() => { - const argv = parseArgv(processArgv); - - return typeof argv["silent"] === "boolean" ? argv["silent"] : false; - })(), + "isSilent": typeof argv["silent"] === "boolean" ? argv["silent"] : false, "themeVersion": process.env.KEYCLOAKIFY_THEME_VERSION ?? parsedPackageJson.version ?? "0.0.0", themeNames, "extraThemeProperties": parsedPackageJson.keycloakify?.extraThemeProperties, diff --git a/src/bin/keycloakify/keycloakify.ts b/src/bin/keycloakify/keycloakify.ts index 69b2e256..f5209b16 100644 --- a/src/bin/keycloakify/keycloakify.ts +++ b/src/bin/keycloakify/keycloakify.ts @@ -11,10 +11,7 @@ import { getThemeSrcDirPath } from "../getThemeSrcDirPath"; import { getProjectRoot } from "../tools/getProjectRoot"; export async function main() { - const reactAppRootDirPath = process.cwd(); - const buildOptions = readBuildOptions({ - reactAppRootDirPath, "processArgv": process.argv.slice(2) }); @@ -23,7 +20,7 @@ export async function main() { const keycloakifyDirPath = getProjectRoot(); - const { themeSrcDirPath } = getThemeSrcDirPath({ reactAppRootDirPath }); + const { themeSrcDirPath } = getThemeSrcDirPath({ "reactAppRootDirPath": buildOptions.reactAppRootDirPath }); for (const themeName of buildOptions.themeNames) { await generateTheme({ @@ -83,12 +80,17 @@ export async function main() { "", ...(!buildOptions.doCreateJar ? [] - : [`✅ Your keycloak theme has been generated and bundled into .${pathSep}${pathRelative(reactAppRootDirPath, jarFilePath)} 🚀`]), + : [ + `✅ Your keycloak theme has been generated and bundled into .${pathSep}${pathRelative( + buildOptions.reactAppRootDirPath, + jarFilePath + )} 🚀` + ]), "", `To test your theme locally you can spin up a Keycloak ${containerKeycloakVersion} container image with the theme pre loaded by running:`, "", `👉 $ .${pathSep}${pathRelative( - reactAppRootDirPath, + buildOptions.reactAppRootDirPath, pathJoin(buildOptions.keycloakifyBuildDirPath, generateStartKeycloakTestingContainer.basename) )} 👈`, ``, From 8255ce1158f227b82e582b298515a46b58f43d23 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 00:56:55 +0100 Subject: [PATCH 32/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 867ae040..b0571e04 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.1", + "version": "9.4.0-rc.2", "description": "Create Keycloak themes using React", "repository": { "type": "git", From ae0b0592174e8e22bcaa2ae1233c65ebf4a56d36 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 14:09:55 +0100 Subject: [PATCH 33/83] Fix a couple of bug in donwnload-builtin-keycloak-theme --- src/bin/download-builtin-keycloak-theme.ts | 5 +++-- src/bin/tools/transformCodebase.ts | 11 ++++++----- 2 files changed, 9 insertions(+), 7 deletions(-) diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index d6e8d6ba..b5e190ef 100644 --- a/src/bin/download-builtin-keycloak-theme.ts +++ b/src/bin/download-builtin-keycloak-theme.ts @@ -182,9 +182,10 @@ 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 = [ ...["patternfly.min.css", "patternfly-additions.min.css", "patternfly-additions.min.css"].map(fileBasename => diff --git a/src/bin/tools/transformCodebase.ts b/src/bin/tools/transformCodebase.ts index fad6c983..57aa41f2 100644 --- 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); From 037cd150dedd4af09c014152061693bb9bab589e Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 14:10:10 +0100 Subject: [PATCH 34/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b0571e04..b3850713 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.2", + "version": "9.4.0-rc.3", "description": "Create Keycloak themes using React", "repository": { "type": "git", From 43eeaf3002b0371cf18b9beecd9df3d5e1cbdce5 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 14:41:07 +0100 Subject: [PATCH 35/83] Remove misleading comment in start-keycloak-container script --- src/bin/keycloakify/generateStartKeycloakTestingContainer.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts b/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts index e3fbda9d..045ce29a 100644 --- 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`, "", From 2540b06c94a18175d82d4b631525a8aac0a90ecf Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 23:36:52 +0100 Subject: [PATCH 36/83] Tweak the resources of the default theme that are kept --- src/bin/download-builtin-keycloak-theme.ts | 55 +++++++++++++--------- 1 file changed, 34 insertions(+), 21 deletions(-) diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index b5e190ef..a0ed7693 100644 --- a/src/bin/download-builtin-keycloak-theme.ts +++ b/src/bin/download-builtin-keycloak-theme.ts @@ -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; @@ -187,34 +214,20 @@ export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: st { 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 }; } }); From 7596786b187f3ae6cf33a309ba0bc1c4868f0671 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Thu, 8 Feb 2024 23:37:14 +0100 Subject: [PATCH 37/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b3850713..0901bee7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.3", + "version": "9.4.0-rc.4", "description": "Create Keycloak themes using React", "repository": { "type": "git", From 1f79a8f7dc356cb067d6f948d75b9f65587017ac Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Fri, 9 Feb 2024 17:52:03 +0100 Subject: [PATCH 38/83] Deprecate keycloakJsAdapter --- src/lib/keycloakJsAdapter.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/lib/keycloakJsAdapter.ts b/src/lib/keycloakJsAdapter.ts index 5a8cde53..9666bd3d 100644 --- 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 From 217439d67337673b00be2b06485224900f57d539 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Fri, 9 Feb 2024 17:52:26 +0100 Subject: [PATCH 39/83] Export polyfill of process.env.PUBLIC_URL --- src/PUBLIC_URL.ts | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 src/PUBLIC_URL.ts diff --git a/src/PUBLIC_URL.ts b/src/PUBLIC_URL.ts new file mode 100644 index 00000000..cfd6d701 --- /dev/null +++ b/src/PUBLIC_URL.ts @@ -0,0 +1,13 @@ +import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "keycloakify/bin/constants"; + +/** + * 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]; + + return kcContext === undefined || process.env.NODE_ENV === "development" + ? process.env.PUBLIC_URL + : `${kcContext.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}`; +})(); From 6d62b5a150eeb9c495e0b617acb64ec2aad37d6f Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Fri, 9 Feb 2024 17:56:28 +0100 Subject: [PATCH 40/83] Don't replace process.env.PUBLIC_URL --- .../replaceImportsInJsCode/webpack.ts | 14 -------- test/bin/replacers.spec.ts | 34 ------------------- 2 files changed, 48 deletions(-) diff --git a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts index 6adf4193..74a02f5d 100644 --- 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); diff --git a/test/bin/replacers.spec.ts b/test/bin/replacers.spec.ts index 2390ea3f..eee699a2 100644 --- 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", () => { From db0dc96cc7bc331bbf37544c5698f3a2bf42308b Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Fri, 9 Feb 2024 17:56:57 +0100 Subject: [PATCH 41/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 0901bee7..f94e59bb 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.4", + "version": "9.4.0-rc.5", "description": "Create Keycloak themes using React", "repository": { "type": "git", From bda76200d701219e7c19b5d9cc4f548f7fb930be Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sat, 10 Feb 2024 19:51:24 +0100 Subject: [PATCH 42/83] Base url that works everywhere in mocks --- src/account/kcContext/createGetKcContext.ts | 3 +- src/account/kcContext/kcContextMocks.ts | 8 ++-- src/bin/tools/pathJoin.ts | 6 --- src/lib/BASE_URL.ts | 41 +++++++++++++++++++++ src/login/kcContext/createGetKcContext.ts | 3 +- src/login/kcContext/kcContextMocks.ts | 8 ++-- 6 files changed, 49 insertions(+), 20 deletions(-) delete mode 100644 src/bin/tools/pathJoin.ts create mode 100644 src/lib/BASE_URL.ts diff --git a/src/account/kcContext/createGetKcContext.ts b/src/account/kcContext/createGetKcContext.ts index e1e37fbc..857b4831 100644 --- a/src/account/kcContext/createGetKcContext.ts +++ b/src/account/kcContext/createGetKcContext.ts @@ -2,7 +2,6 @@ import type { DeepPartial } from "keycloakify/tools/DeepPartial"; import { deepAssign } from "keycloakify/tools/deepAssign"; 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"; @@ -88,7 +87,7 @@ export function createGetKcContext (i === 0 ? part : part.replace(/^\/+/, ""))) - .map((part, i) => (i === path.length - 1 ? part : part.replace(/\/+$/, ""))) - .join(typeof process !== "undefined" && process.platform === "win32" ? "\\" : "/"); -} diff --git a/src/lib/BASE_URL.ts b/src/lib/BASE_URL.ts new file mode 100644 index 00000000..df86e13a --- /dev/null +++ b/src/lib/BASE_URL.ts @@ -0,0 +1,41 @@ +import { assert } from "tsafe/assert"; + +/** + * WARNING: Internal use only!! + * This is just a way to know what's the base url that works + * both in webpack and vite. + * THIS DOES NOT WORK IN KEYCLOAK! It's only for resolving mock assets. + */ +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}/`; + } + + return "/"; +})(); diff --git a/src/login/kcContext/createGetKcContext.ts b/src/login/kcContext/createGetKcContext.ts index 211ec856..799a8988 100644 --- a/src/login/kcContext/createGetKcContext.ts +++ b/src/login/kcContext/createGetKcContext.ts @@ -7,7 +7,6 @@ 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"; @@ -147,7 +146,7 @@ export function createGetKcContext [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" }, From 8535edcfd4dcb5b17c26145f6e85a5c055a65644 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sat, 10 Feb 2024 19:51:39 +0100 Subject: [PATCH 43/83] Relase candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index f94e59bb..01576ef1 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.5", + "version": "9.4.0-rc.6", "description": "Create Keycloak themes using React", "repository": { "type": "git", From ef5e4fccd3324367d87d6223a4dfc0a13344e70c Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sat, 10 Feb 2024 20:04:08 +0100 Subject: [PATCH 44/83] Replace the common asset path url in the ftl (upstream) to help pepole figure out what's going on --- src/account/kcContext/createGetKcContext.ts | 3 --- .../ftl_object_to_js_code_declaring_an_object.ftl | 8 ++++++++ src/bin/keycloakify/generateFtl/generateFtl.ts | 5 +++-- src/login/kcContext/createGetKcContext.ts | 3 --- 4 files changed, 11 insertions(+), 8 deletions(-) diff --git a/src/account/kcContext/createGetKcContext.ts b/src/account/kcContext/createGetKcContext.ts index 857b4831..457e461f 100644 --- a/src/account/kcContext/createGetKcContext.ts +++ b/src/account/kcContext/createGetKcContext.ts @@ -3,7 +3,6 @@ import { deepAssign } from "keycloakify/tools/deepAssign"; import type { ExtendKcContext } from "./getKcContextFromWindow"; import { getKcContextFromWindow } from "./getKcContextFromWindow"; import { symToStr } from "tsafe/symToStr"; -import { resources_common } from "keycloakify/bin/constants"; import { kcContextMocks, kcContextCommonMock } from "keycloakify/account/kcContext/kcContextMocks"; export function createGetKcContext(params?: { @@ -87,8 +86,6 @@ export function createGetKcContext": [ "<#if scripts??>", " <#list scripts as script>", diff --git a/src/login/kcContext/createGetKcContext.ts b/src/login/kcContext/createGetKcContext.ts index 799a8988..267b4e32 100644 --- a/src/login/kcContext/createGetKcContext.ts +++ b/src/login/kcContext/createGetKcContext.ts @@ -8,7 +8,6 @@ import { assert } from "tsafe/assert"; import type { ExtendKcContext } from "./getKcContextFromWindow"; import { getKcContextFromWindow } from "./getKcContextFromWindow"; import { symToStr } from "tsafe/symToStr"; -import { resources_common } from "keycloakify/bin/constants"; export function createGetKcContext(params?: { mockData?: readonly DeepPartial>[]; @@ -146,8 +145,6 @@ export function createGetKcContext Date: Sat, 10 Feb 2024 20:40:41 +0100 Subject: [PATCH 45/83] Throw if unrecognized bundler when getting BASE_URL for mocks --- src/lib/BASE_URL.ts | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/lib/BASE_URL.ts b/src/lib/BASE_URL.ts index df86e13a..a5e70311 100644 --- a/src/lib/BASE_URL.ts +++ b/src/lib/BASE_URL.ts @@ -2,9 +2,12 @@ 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. - * THIS DOES NOT WORK IN KEYCLOAK! It's only for resolving mock assets. + * 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: { @@ -37,5 +40,5 @@ export const BASE_URL = (() => { return BASE_URL === "" ? "/" : `${BASE_URL}/`; } - return "/"; + throw new Error("Bundler not supported"); })(); From 4d67f16e944f3f11395b7c7dec8f7e184d71444b Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sat, 10 Feb 2024 20:40:59 +0100 Subject: [PATCH 46/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 01576ef1..67b7950a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.6", + "version": "9.4.0-rc.7", "description": "Create Keycloak themes using React", "repository": { "type": "git", From 05e5e4efeca7c1e8035988da67c6c09f45670e4e Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 00:21:04 +0100 Subject: [PATCH 47/83] When is storybook, don't print mock related warning in console --- src/account/kcContext/createGetKcContext.ts | 9 ++++++++- src/lib/isStorybook.ts | 3 +++ src/login/kcContext/createGetKcContext.ts | 9 ++++++++- 3 files changed, 19 insertions(+), 2 deletions(-) create mode 100644 src/lib/isStorybook.ts diff --git a/src/account/kcContext/createGetKcContext.ts b/src/account/kcContext/createGetKcContext.ts index 457e461f..f45bf322 100644 --- a/src/account/kcContext/createGetKcContext.ts +++ b/src/account/kcContext/createGetKcContext.ts @@ -1,5 +1,6 @@ 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 { symToStr } from "tsafe/symToStr"; @@ -25,7 +26,13 @@ export function createGetKcContext pageId === mockPageId); diff --git a/src/lib/isStorybook.ts b/src/lib/isStorybook.ts new file mode 100644 index 00000000..2913597f --- /dev/null +++ b/src/lib/isStorybook.ts @@ -0,0 +1,3 @@ +import { BASE_URL } from "./BASE_URL"; + +export const isStorybook = BASE_URL.startsWith("."); diff --git a/src/login/kcContext/createGetKcContext.ts b/src/login/kcContext/createGetKcContext.ts index 267b4e32..fd218dbb 100644 --- a/src/login/kcContext/createGetKcContext.ts +++ b/src/login/kcContext/createGetKcContext.ts @@ -2,6 +2,7 @@ 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"; @@ -29,7 +30,13 @@ export function createGetKcContext pageId === mockPageId); From 26985f8d81ff6402e8e29f9be5a205b3eb76e80a Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 00:21:21 +0100 Subject: [PATCH 48/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 67b7950a..d388dea7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.7", + "version": "9.4.0-rc.8", "description": "Create Keycloak themes using React", "repository": { "type": "git", From b3c242595ec2a936a2ea2eb10e4ab411a6ca8971 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 10:36:50 +0100 Subject: [PATCH 49/83] Fix PUBLIC_URL typing --- src/PUBLIC_URL.ts | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/src/PUBLIC_URL.ts b/src/PUBLIC_URL.ts index cfd6d701..af0f0bb3 100644 --- a/src/PUBLIC_URL.ts +++ b/src/PUBLIC_URL.ts @@ -1,4 +1,5 @@ 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. @@ -7,7 +8,14 @@ import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "keycloaki export const PUBLIC_URL = (() => { const kcContext = (window as any)[nameOfTheGlobal]; - return kcContext === undefined || process.env.NODE_ENV === "development" - ? process.env.PUBLIC_URL - : `${kcContext.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}`; + 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}`; })(); From df3acb6932e86d127c2ee6bb97c2b7488fdab413 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 10:38:12 +0100 Subject: [PATCH 50/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index d388dea7..a31d8f48 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.8", + "version": "9.4.0-rc.9", "description": "Create Keycloak themes using React", "repository": { "type": "git", From 05f52c3d23bdc640a71db81a924f58223ac838f0 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 12:04:50 +0100 Subject: [PATCH 51/83] Remove unessesary log --- src/bin/copy-keycloak-resources-to-public.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/bin/copy-keycloak-resources-to-public.ts b/src/bin/copy-keycloak-resources-to-public.ts index b4e9db67..987a0d64 100644 --- a/src/bin/copy-keycloak-resources-to-public.ts +++ b/src/bin/copy-keycloak-resources-to-public.ts @@ -1,7 +1,7 @@ #!/usr/bin/env node import { downloadKeycloakStaticResources } from "./keycloakify/generateTheme/downloadKeycloakStaticResources"; -import { join as pathJoin, relative as pathRelative } from "path"; +import { join as pathJoin } from "path"; import { readBuildOptions } from "./keycloakify/buildOptions"; import { themeTypes, keycloak_resources, lastKeycloakVersionWithAccountV1 } from "./constants"; import * as fs from "fs"; @@ -41,6 +41,4 @@ import * as fs from "fs"; ); fs.writeFileSync(pathJoin(buildOptions.publicDirPath, keycloak_resources, ".gitignore"), Buffer.from("*", "utf8")); - - console.log(`${pathRelative(buildOptions.reactAppRootDirPath, reservedDirPath)} directory created.`); })(); From 9706338182fd7a3c559d352167101935ee2e6256 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 12:05:05 +0100 Subject: [PATCH 52/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index a31d8f48..b5e7b06f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.9", + "version": "9.4.0-rc.10", "description": "Create Keycloak themes using React", "repository": { "type": "git", From b5cfdb9d0aeccdee73bdc2ab4e86be2c0c0452dd Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 16:17:38 +0100 Subject: [PATCH 53/83] Store vite plugin output in cache dir path --- scripts/generate-json-schema.ts | 14 ----- src/bin/constants.ts | 2 +- src/bin/eject-keycloak-page.ts | 5 +- .../keycloakify/buildOptions/buildOptions.ts | 60 +++++++------------ .../buildOptions/getCacheDirPath.ts | 23 +++++++ .../getKeycloakifyBuildDirPath.ts | 33 ---------- .../buildOptions/getReactAppRootDirPath.ts | 23 +++++++ .../buildOptions/resolvedViteConfig.ts | 28 +++------ src/vite-plugin/vite-plugin.ts | 16 ++--- 9 files changed, 86 insertions(+), 118 deletions(-) delete mode 100644 scripts/generate-json-schema.ts create mode 100644 src/bin/keycloakify/buildOptions/getCacheDirPath.ts delete mode 100644 src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts create mode 100644 src/bin/keycloakify/buildOptions/getReactAppRootDirPath.ts diff --git a/scripts/generate-json-schema.ts b/scripts/generate-json-schema.ts deleted file mode 100644 index 81c2899d..00000000 --- a/scripts/generate-json-schema.ts +++ /dev/null @@ -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)); diff --git a/src/bin/constants.ts b/src/bin/constants.ts index 279e773a..4a8b4023 100644 --- 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; diff --git a/src/bin/eject-keycloak-page.ts b/src/bin/eject-keycloak-page.ts index 71d70483..19332bd1 100644 --- a/src/bin/eject-keycloak-page.ts +++ b/src/bin/eject-keycloak-page.ts @@ -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({ "values": [...themeTypes] diff --git a/src/bin/keycloakify/buildOptions/buildOptions.ts b/src/bin/keycloakify/buildOptions/buildOptions.ts index 6045721a..5b5f36d9 100644 --- a/src/bin/keycloakify/buildOptions/buildOptions.ts +++ b/src/bin/keycloakify/buildOptions/buildOptions.ts @@ -4,7 +4,9 @@ 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"; /** Consolidated build option gathered form CLI arguments and config in package.json */ export type BuildOptions = { @@ -33,29 +35,18 @@ export type BuildOptions = { 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 +64,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 +83,8 @@ export function readBuildOptions(params: { processArgv: string[] }): BuildOption return pathJoin(reactAppRootDirPath, resolvedViteConfig.buildDir); })(); + const argv = parseArgv(processArgv); + return { "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack", "isSilent": typeof argv["silent"] === "boolean" ? argv["silent"] : false, @@ -124,7 +111,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 +139,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) { diff --git a/src/bin/keycloakify/buildOptions/getCacheDirPath.ts b/src/bin/keycloakify/buildOptions/getCacheDirPath.ts new file mode 100644 index 00000000..4e553155 --- /dev/null +++ b/src/bin/keycloakify/buildOptions/getCacheDirPath.ts @@ -0,0 +1,23 @@ +import { join as pathJoin } from "path"; +import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath"; + +export function getCacheDirPath(params: { reactAppRootDirPath: string }) { + const { reactAppRootDirPath } = params; + + const cacheDirPath = pathJoin( + (() => { + if (process.env.XDG_CACHE_HOME !== undefined) { + return getAbsoluteAndInOsFormatPath({ + "pathIsh": process.env.XDG_CACHE_HOME, + "cwd": reactAppRootDirPath + }); + } + + // TODO: Recursively look up + return pathJoin(reactAppRootDirPath, "node_modules", ".cache"); + })(), + "keycloakify" + ); + + return { cacheDirPath }; +} diff --git a/src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts b/src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts deleted file mode 100644 index 5246fadb..00000000 --- a/src/bin/keycloakify/buildOptions/getKeycloakifyBuildDirPath.ts +++ /dev/null @@ -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 }; -} diff --git a/src/bin/keycloakify/buildOptions/getReactAppRootDirPath.ts b/src/bin/keycloakify/buildOptions/getReactAppRootDirPath.ts new file mode 100644 index 00000000..49b9e9d3 --- /dev/null +++ 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 }; +} diff --git a/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts b/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts index 6646b795..4d4fd3fe 100644 --- 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>(); } -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."); } diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index 6bec4d71..b2655202 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -1,11 +1,10 @@ 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"; @@ -40,19 +39,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); } fs.writeFileSync( - pathJoin(keycloakifyBuildDirPath, resolvedViteConfigJsonBasename), + pathJoin(cacheDirPath, resolvedViteConfigJsonBasename), Buffer.from( JSON.stringify( id({ From 839ba6a964409101aa169720ba801e2d7f958e13 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 18:28:58 +0100 Subject: [PATCH 54/83] Improve monorepo support --- src/bin/download-builtin-keycloak-theme.ts | 6 +- src/bin/downloadAndUnzip.ts | 199 ++++++++++++ .../keycloakify/buildOptions/buildOptions.ts | 7 +- .../buildOptions/getCacheDirPath.ts | 6 +- .../getNpmWorkspaceRootDirPath.ts | 27 ++ .../generateTheme/bringInAccountV1.ts | 1 + .../downloadKeycloakStaticResources.ts | 1 + .../generateTheme/generateTheme.ts | 1 + src/bin/tools/downloadAndUnzip.ts | 301 ------------------ src/bin/tools/fetchProxyOptions.ts | 73 +++++ src/bin/tools/fs.existsAsync.ts | 11 + 11 files changed, 326 insertions(+), 307 deletions(-) create mode 100644 src/bin/downloadAndUnzip.ts create mode 100644 src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts delete mode 100644 src/bin/tools/downloadAndUnzip.ts create mode 100644 src/bin/tools/fetchProxyOptions.ts create mode 100644 src/bin/tools/fs.existsAsync.ts diff --git a/src/bin/download-builtin-keycloak-theme.ts b/src/bin/download-builtin-keycloak-theme.ts index a0ed7693..3986132f 100644 --- 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(); @@ -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 }) => { diff --git a/src/bin/downloadAndUnzip.ts b/src/bin/downloadAndUnzip.ts new file mode 100644 index 00000000..0a738bbf --- /dev/null +++ b/src/bin/downloadAndUnzip.ts @@ -0,0 +1,199 @@ +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(); + +export async function downloadAndUnzip(params: { + url: string; + destDirPath: string; + specificDirsToExtract?: string[]; + preCacheTransform?: { + actionCacheId: string; + action: (params: { destDirPath: string }) => Promise; + }; + buildOptions: BuildOptionsLike; +}) { + const { url, destDirPath, specificDirsToExtract, preCacheTransform, buildOptions } = params; + + const zipFileBasename = generateFileNameFromURL({ + url, + "preCacheTransform": + preCacheTransform === undefined + ? undefined + : { + "actionCacheId": preCacheTransform.actionCacheId, + "actionFootprint": preCacheTransform.action.toString() + } + }); + + const zipFilePath = pathJoin(buildOptions.cacheDirPath, `${zipFileBasename}.zip`); + const extractDirPath = pathJoin(buildOptions.cacheDirPath, `tmp_unzip_${zipFileBasename}`); + + 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; +} diff --git a/src/bin/keycloakify/buildOptions/buildOptions.ts b/src/bin/keycloakify/buildOptions/buildOptions.ts index 5b5f36d9..a9efb540 100644 --- a/src/bin/keycloakify/buildOptions/buildOptions.ts +++ b/src/bin/keycloakify/buildOptions/buildOptions.ts @@ -7,6 +7,7 @@ import { readResolvedViteConfig } from "./resolvedViteConfig"; 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 = { @@ -30,6 +31,7 @@ export type BuildOptions = { urlPathname: string | undefined; assetsDirPath: string; doBuildRetrocompatAccountTheme: boolean; + npmWorkspaceRootDirPath: string; }; export function readBuildOptions(params: { processArgv: string[] }): BuildOptions { @@ -85,6 +87,8 @@ export function readBuildOptions(params: { processArgv: string[] }): BuildOption const argv = parseArgv(processArgv); + const { npmWorkspaceRootDirPath } = getNpmWorkspaceRootDirPath({ reactAppRootDirPath }); + return { "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack", "isSilent": typeof argv["silent"] === "boolean" ? argv["silent"] : false, @@ -175,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 }; } diff --git a/src/bin/keycloakify/buildOptions/getCacheDirPath.ts b/src/bin/keycloakify/buildOptions/getCacheDirPath.ts index 4e553155..9089e09a 100644 --- a/src/bin/keycloakify/buildOptions/getCacheDirPath.ts +++ b/src/bin/keycloakify/buildOptions/getCacheDirPath.ts @@ -1,9 +1,12 @@ 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) { @@ -13,8 +16,7 @@ export function getCacheDirPath(params: { reactAppRootDirPath: string }) { }); } - // TODO: Recursively look up - return pathJoin(reactAppRootDirPath, "node_modules", ".cache"); + return pathJoin(npmWorkspaceRootDirPath, "node_modules", ".cache"); })(), "keycloakify" ); diff --git a/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts b/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts new file mode 100644 index 00000000..502ced5c --- /dev/null +++ b/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts @@ -0,0 +1,27 @@ +import * as child_process from "child_process"; +import { join as pathJoin, resolve as pathResolve, sep as pathSep } from "path"; +import { assert } from "tsafe/assert"; + +export function getNpmWorkspaceRootDirPath(params: { reactAppRootDirPath: string }) { + const { reactAppRootDirPath } = params; + + 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); + + return { npmWorkspaceRootDirPath }; +} diff --git a/src/bin/keycloakify/generateTheme/bringInAccountV1.ts b/src/bin/keycloakify/generateTheme/bringInAccountV1.ts index 6caaeabc..5fba86d8 100644 --- 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; }; { diff --git a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts index 8cc0c3f0..811df236 100644 --- 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(); diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index 3ff03e79..3b1d026e 100644 --- a/src/bin/keycloakify/generateTheme/generateTheme.ts +++ b/src/bin/keycloakify/generateTheme/generateTheme.ts @@ -33,6 +33,7 @@ export type BuildOptionsLike = { urlPathname: string | undefined; doBuildRetrocompatAccountTheme: boolean; themeNames: string[]; + npmWorkspaceRootDirPath: string; }; assert(); diff --git a/src/bin/tools/downloadAndUnzip.ts b/src/bin/tools/downloadAndUnzip.ts deleted file mode 100644 index 2ea775f4..00000000 --- a/src/bin/tools/downloadAndUnzip.ts +++ /dev/null @@ -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(arg0: T | T[]) { - return Array.isArray(arg0) ? arg0 : typeof arg0 === "undefined" ? [] : [arg0]; -} - -function ensureSingleOrNone(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; - -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 { - return (async function callee(depth: number): Promise { - 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(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> { - 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; - }; - } & ( - | { - 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 }); - } -} diff --git a/src/bin/tools/fetchProxyOptions.ts b/src/bin/tools/fetchProxyOptions.ts new file mode 100644 index 00000000..a6e880fd --- /dev/null +++ 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(arg0: T | T[]) { + return Array.isArray(arg0) ? arg0 : typeof arg0 === "undefined" ? [] : [arg0]; +} + +function ensureSingleOrNone(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; + +/** + * 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; + +export async function getProxyFetchOptions(params: { npmWorkspaceRootDirPath: string }): Promise { + 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(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 }; +} diff --git a/src/bin/tools/fs.existsAsync.ts b/src/bin/tools/fs.existsAsync.ts new file mode 100644 index 00000000..359caabd --- /dev/null +++ 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; + } +} From 6d4a948dd8d229101f2b973c45f320e4bf04ebab Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 19:25:52 +0100 Subject: [PATCH 55/83] minor refactor --- src/bin/downloadAndUnzip.ts | 28 ++++++++++++++++------------ 1 file changed, 16 insertions(+), 12 deletions(-) diff --git a/src/bin/downloadAndUnzip.ts b/src/bin/downloadAndUnzip.ts index 0a738bbf..e11a4c1e 100644 --- a/src/bin/downloadAndUnzip.ts +++ b/src/bin/downloadAndUnzip.ts @@ -30,19 +30,23 @@ export async function downloadAndUnzip(params: { }) { const { url, destDirPath, specificDirsToExtract, preCacheTransform, buildOptions } = params; - const zipFileBasename = generateFileNameFromURL({ - url, - "preCacheTransform": - preCacheTransform === undefined - ? undefined - : { - "actionCacheId": preCacheTransform.actionCacheId, - "actionFootprint": preCacheTransform.action.toString() - } - }); + const { extractDirPath, zipFilePath } = (() => { + const zipFileBasenameWithoutExt = generateFileNameFromURL({ + url, + "preCacheTransform": + preCacheTransform === undefined + ? undefined + : { + "actionCacheId": preCacheTransform.actionCacheId, + "actionFootprint": preCacheTransform.action.toString() + } + }); - const zipFilePath = pathJoin(buildOptions.cacheDirPath, `${zipFileBasename}.zip`); - const extractDirPath = pathJoin(buildOptions.cacheDirPath, `tmp_unzip_${zipFileBasename}`); + 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)) { From ad70a4cffdc6abb4474e9ab2947fe0c91081037a Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 20:15:18 +0100 Subject: [PATCH 56/83] Make Vite run copy-keaycloak-resources-to-public --- src/bin/copy-keycloak-resources-to-public.ts | 82 +++++++++++++++++-- src/bin/eject-keycloak-page.ts | 4 +- src/bin/keycloakify/keycloakify.ts | 18 ++-- ...tRoot.ts => getThisCodebaseRootDirPath.ts} | 8 +- src/bin/tools/grant-exec-perms.ts | 8 +- src/bin/tools/readThisNpmProjectVersion.ts | 12 +++ src/vite-plugin/vite-plugin.ts | 7 +- 7 files changed, 108 insertions(+), 31 deletions(-) rename src/bin/tools/{getProjectRoot.ts => getThisCodebaseRootDirPath.ts} (50%) create mode 100644 src/bin/tools/readThisNpmProjectVersion.ts diff --git a/src/bin/copy-keycloak-resources-to-public.ts b/src/bin/copy-keycloak-resources-to-public.ts index 987a0d64..c74e571c 100644 --- a/src/bin/copy-keycloak-resources-to-public.ts +++ b/src/bin/copy-keycloak-resources-to-public.ts @@ -1,17 +1,43 @@ #!/usr/bin/env node -import { downloadKeycloakStaticResources } from "./keycloakify/generateTheme/downloadKeycloakStaticResources"; +import { downloadKeycloakStaticResources, type BuildOptionsLike } from "./keycloakify/generateTheme/downloadKeycloakStaticResources"; import { join as pathJoin } 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({ + "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 +50,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 [ @@ -41,4 +67,44 @@ import * as fs from "fs"; ); fs.writeFileSync(pathJoin(buildOptions.publicDirPath, keycloak_resources, ".gitignore"), Buffer.from("*", "utf8")); -})(); + + fs.writeFileSync(keycloakifyBuildinfoFilePath, Buffer.from(keycloakifyBuildinfoRaw, "utf8")); +} + +export function generateKeycloakifyBuildinfoRaw(params: { + keycloakifyVersion: string; + buildOptions: BuildOptionsLike & { + loginThemeResourcesFromKeycloakVersion: string; + }; +}) { + const { keycloakifyVersion, buildOptions } = params; + + const { cacheDirPath, npmWorkspaceRootDirPath, loginThemeResourcesFromKeycloakVersion, ...rest } = buildOptions; + + assert>(true); + + const keycloakifyBuildinfoRaw = JSON.stringify( + { + keycloakifyVersion, + "buildOptions": { + loginThemeResourcesFromKeycloakVersion, + cacheDirPath, + npmWorkspaceRootDirPath + } + }, + null, + 2 + ); + + return { keycloakifyBuildinfoRaw }; +} + +async function main() { + await copyKeycloakResourcesToPublic({ + "processArgv": process.argv.slice(2) + }); +} + +if (require.main === module) { + main(); +} diff --git a/src/bin/eject-keycloak-page.ts b/src/bin/eject-keycloak-page.ts index 19332bd1..f777f281 100644 --- 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"; @@ -58,7 +58,7 @@ import { getReactAppRootDirPath } from "./keycloakify/buildOptions/getReactAppRo 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`); })(); diff --git a/src/bin/keycloakify/keycloakify.ts b/src/bin/keycloakify/keycloakify.ts index f5209b16..9a03bd5a 100644 --- 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 }); } diff --git a/src/bin/tools/getProjectRoot.ts b/src/bin/tools/getThisCodebaseRootDirPath.ts similarity index 50% rename from src/bin/tools/getProjectRoot.ts rename to src/bin/tools/getThisCodebaseRootDirPath.ts index 4d4ea107..f880ffc9 100644 --- a/src/bin/tools/getProjectRoot.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)); } diff --git a/src/bin/tools/grant-exec-perms.ts b/src/bin/tools/grant-exec-perms.ts index 315f39bb..50abb0be 100644 --- 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(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); diff --git a/src/bin/tools/readThisNpmProjectVersion.ts b/src/bin/tools/readThisNpmProjectVersion.ts new file mode 100644 index 00000000..e99f97e8 --- /dev/null +++ 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; +} diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index b2655202..ca0e931f 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -8,6 +8,7 @@ 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"; export function keycloakify(): Plugin { let reactAppRootDirPath: string | undefined = undefined; @@ -17,7 +18,7 @@ export function keycloakify(): Plugin { return { "name": "keycloakify", "apply": "build", - "configResolved": resolvedConfig => { + "configResolved": async resolvedConfig => { reactAppRootDirPath = resolvedConfig.root; urlPathname = (() => { let out = resolvedConfig.env.BASE_URL; @@ -63,6 +64,10 @@ export function keycloakify(): Plugin { "utf8" ) ); + + await copyKeycloakResourcesToPublic({ + "processArgv": ["--project", reactAppRootDirPath] + }); }, "transform": (code, id) => { assert(reactAppRootDirPath !== undefined); From 43dcce84784689765c644f8c8f47431ed3337137 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 20:20:38 +0100 Subject: [PATCH 57/83] Add cache to getNpmWorkspaceRootDirPath --- .../getNpmWorkspaceRootDirPath.ts | 22 +++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts b/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts index 502ced5c..a51a7e8c 100644 --- a/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts +++ b/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts @@ -2,9 +2,26 @@ 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("..")])); @@ -23,5 +40,10 @@ export function getNpmWorkspaceRootDirPath(params: { reactAppRootDirPath: string return cwd; })(0); + cache = { + reactAppRootDirPath, + npmWorkspaceRootDirPath + }; + return { npmWorkspaceRootDirPath }; } From d568bafe0494d488ba535be76e9f5a6c9d983fce Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 20:20:52 +0100 Subject: [PATCH 58/83] Remove unessesary file --- src/vite-plugin/config.json | 232 ------------------------------------ 1 file changed, 232 deletions(-) delete mode 100644 src/vite-plugin/config.json diff --git a/src/vite-plugin/config.json b/src/vite-plugin/config.json deleted file mode 100644 index 3dad4b82..00000000 --- a/src/vite-plugin/config.json +++ /dev/null @@ -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 - } -} From 1671850714b22f13a9462ac4da09b5cb1acaf1dc Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 20:21:05 +0100 Subject: [PATCH 59/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b5e7b06f..789ee8b2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.10", + "version": "9.4.0-rc.11", "description": "Create Keycloak themes using React", "repository": { "type": "git", From e6661cb89899fce15f07ca7f95d9b3813fd1df04 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 23:17:39 +0100 Subject: [PATCH 60/83] Fix build --- scripts/generate-i18n-messages.ts | 13 ++++++++----- scripts/link-in-app.ts | 4 ++-- test/bin/setupSampleReactProject.ts | 11 +++++++++-- 3 files changed, 19 insertions(+), 9 deletions(-) diff --git a/scripts/generate-i18n-messages.ts b/scripts/generate-i18n-messages.ts index 823fb1e8..6da685ae 100644 --- 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,12 +75,12 @@ 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)}`, + `//This code was automatically generated by running ${pathRelative(thisCodebaseRootDirPath, __filename)}`, "//PLEASE DO NOT EDIT MANUALLY", "" ].join("\n"); diff --git a/scripts/link-in-app.ts b/scripts/link-in-app.ts index 76b14650..eacb3214 100644 --- 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( diff --git a/test/bin/setupSampleReactProject.ts b/test/bin/setupSampleReactProject.ts index 5ea6daf1..79e7516a 100644 --- 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 + } }); } From 8ab118dd066f97974bc38d63b0a9ef7fea4921b9 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 23:47:58 +0100 Subject: [PATCH 61/83] Remove path-browserify dependency --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 789ee8b2..68d941a6 100644 --- a/package.json +++ b/package.json @@ -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", From 4a8920749af9804bde8cf936c3208fa7bfe51e4d Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 23:48:09 +0100 Subject: [PATCH 62/83] release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 68d941a6..074b737a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.11", + "version": "9.4.0-rc.12", "description": "Create Keycloak themes using React", "repository": { "type": "git", From 7c0a631a9ac1a26d64e226c57372f76b4c1c4739 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 23:54:28 +0100 Subject: [PATCH 63/83] Fix crash in vite-plugin --- src/vite-plugin/vite-plugin.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index ca0e931f..eadab6a6 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -45,7 +45,7 @@ export function keycloakify(): Plugin { }); if (!fs.existsSync(cacheDirPath)) { - fs.mkdirSync(cacheDirPath); + fs.mkdirSync(cacheDirPath, { "recursive": true }); } fs.writeFileSync( From ad5a3680654528854228ef2af8a44a853fa24e3f Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 23:59:10 +0100 Subject: [PATCH 64/83] Run vite configResolved in dev mode as well --- src/vite-plugin/vite-plugin.ts | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index eadab6a6..3c2f8019 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -14,11 +14,13 @@ export function keycloakify(): Plugin { let reactAppRootDirPath: string | undefined = undefined; let urlPathname: string | undefined = undefined; let buildDirPath: string | undefined = undefined; + let command: "build" | "serve" | undefined = undefined; return { "name": "keycloakify", - "apply": "build", "configResolved": async resolvedConfig => { + command = resolvedConfig.command; + reactAppRootDirPath = resolvedConfig.root; urlPathname = (() => { let out = resolvedConfig.env.BASE_URL; @@ -70,6 +72,12 @@ export function keycloakify(): Plugin { }); }, "transform": (code, id) => { + assert(command !== undefined); + + if (command !== "build") { + return; + } + assert(reactAppRootDirPath !== undefined); let transformedCode: string | undefined = undefined; @@ -121,6 +129,12 @@ export function keycloakify(): Plugin { }; }, "buildEnd": async () => { + assert(command !== undefined); + + if (command !== "build") { + return; + } + assert(buildDirPath !== undefined); await rm(pathJoin(buildDirPath, keycloak_resources), { "recursive": true, "force": true }); From 2790487fc74df5319266ad521357d355c11ada0c Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Sun, 11 Feb 2024 23:59:23 +0100 Subject: [PATCH 65/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 074b737a..8d2d9045 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.12", + "version": "9.4.0-rc.13", "description": "Create Keycloak themes using React", "repository": { "type": "git", From 5b563d8e9b327528dd3fd9ce699c2be6d38c94d4 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 00:32:18 +0100 Subject: [PATCH 66/83] Improve privacy on the buildinfo file that might be served --- src/bin/copy-keycloak-resources-to-public.ts | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/bin/copy-keycloak-resources-to-public.ts b/src/bin/copy-keycloak-resources-to-public.ts index c74e571c..f877594f 100644 --- a/src/bin/copy-keycloak-resources-to-public.ts +++ b/src/bin/copy-keycloak-resources-to-public.ts @@ -1,7 +1,7 @@ #!/usr/bin/env node import { downloadKeycloakStaticResources, type BuildOptionsLike } from "./keycloakify/generateTheme/downloadKeycloakStaticResources"; -import { join as pathJoin } from "path"; +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"; @@ -19,6 +19,7 @@ export async function copyKeycloakResourcesToPublic(params: { processArgv: strin const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo"); const { keycloakifyBuildinfoRaw } = generateKeycloakifyBuildinfoRaw({ + destDirPath, "keycloakifyVersion": readThisNpmProjectVersion(), buildOptions }); @@ -72,12 +73,13 @@ export async function copyKeycloakResourcesToPublic(params: { processArgv: strin } export function generateKeycloakifyBuildinfoRaw(params: { + destDirPath: string; keycloakifyVersion: string; buildOptions: BuildOptionsLike & { loginThemeResourcesFromKeycloakVersion: string; }; }) { - const { keycloakifyVersion, buildOptions } = params; + const { destDirPath, keycloakifyVersion, buildOptions } = params; const { cacheDirPath, npmWorkspaceRootDirPath, loginThemeResourcesFromKeycloakVersion, ...rest } = buildOptions; @@ -88,8 +90,8 @@ export function generateKeycloakifyBuildinfoRaw(params: { keycloakifyVersion, "buildOptions": { loginThemeResourcesFromKeycloakVersion, - cacheDirPath, - npmWorkspaceRootDirPath + "cacheDirPath": pathRelative(destDirPath, cacheDirPath), + "npmWorkspaceRootDirPath": pathRelative(destDirPath, npmWorkspaceRootDirPath) } }, null, From b03340ed1027f811fe11a9612800ce67afa12d45 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 00:33:12 +0100 Subject: [PATCH 67/83] Do not dynamically import "en" to make vite happy --- scripts/generate-i18n-messages.ts | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/scripts/generate-i18n-messages.ts b/scripts/generate-i18n-messages.ts index 6da685ae..aa899487 100644 --- a/scripts/generate-i18n-messages.ts +++ b/scripts/generate-i18n-messages.ts @@ -81,8 +81,7 @@ async function main() { const generatedFileHeader = [ `//This code was automatically generated by running ${pathRelative(thisCodebaseRootDirPath, __filename)}`, - "//PLEASE DO NOT EDIT MANUALLY", - "" + "//PLEASE DO NOT EDIT MANUALLY" ].join("\n"); languages.forEach(language => { @@ -95,6 +94,7 @@ async function main() { Buffer.from( [ generatedFileHeader, + "", "/* spell-checker: disable */", `const messages= ${JSON.stringify(recordForPageType[language], null, 2)};`, "", @@ -113,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": {} };', " }", " })();", From b2f2c3e386ccd338cbc0a58b1719349bb7c58d18 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 01:34:34 +0100 Subject: [PATCH 68/83] Disalow releative basename in vite config --- src/vite-plugin/vite-plugin.ts | 34 +++++++++++++++++++++------------- 1 file changed, 21 insertions(+), 13 deletions(-) diff --git a/src/vite-plugin/vite-plugin.ts b/src/vite-plugin/vite-plugin.ts index 3c2f8019..df645967 100644 --- a/src/vite-plugin/vite-plugin.ts +++ b/src/vite-plugin/vite-plugin.ts @@ -1,6 +1,5 @@ import { join as pathJoin, relative as pathRelative, sep as pathSep } from "path"; 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"; @@ -9,15 +8,16 @@ 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; - return { - "name": "keycloakify", + const plugin = { + "name": "keycloakify" as const, "configResolved": async resolvedConfig => { command = resolvedConfig.command; @@ -25,6 +25,15 @@ export function keycloakify(): Plugin { urlPathname = (() => { let out = resolvedConfig.env.BASE_URL; + if (out.startsWith(".") && command === "build") { + 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; } @@ -91,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) { @@ -101,8 +109,6 @@ export function keycloakify(): Plugin { } } - const windowToken = isJavascriptFile ? "window" : "(window as any)"; - if (transformedCode === undefined) { transformedCode = code; } @@ -112,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("") ); @@ -128,7 +134,7 @@ export function keycloakify(): Plugin { "code": transformedCode }; }, - "buildEnd": async () => { + "closeBundle": async () => { assert(command !== undefined); if (command !== "build") { @@ -139,5 +145,7 @@ export function keycloakify(): Plugin { await rm(pathJoin(buildDirPath, keycloak_resources), { "recursive": true, "force": true }); } - }; + } satisfies Plugin; + + return plugin as any; } From 21cbc14a480b915db80b9c1050c9d6cade2b03c7 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 01:34:54 +0100 Subject: [PATCH 69/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 8d2d9045..4011e477 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.13", + "version": "9.4.0-rc.14", "description": "Create Keycloak themes using React", "repository": { "type": "git", From d466123b1ce14895d65e0d24c851b2ddde422e1c Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 01:41:08 +0100 Subject: [PATCH 70/83] Use Keycloak 23.0.6 --- src/bin/keycloakify/keycloakify.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/bin/keycloakify/keycloakify.ts b/src/bin/keycloakify/keycloakify.ts index 9a03bd5a..2e1e3548 100644 --- a/src/bin/keycloakify/keycloakify.ts +++ b/src/bin/keycloakify/keycloakify.ts @@ -59,7 +59,7 @@ export async function main() { ); } - const containerKeycloakVersion = "23.0.0"; + const containerKeycloakVersion = "23.0.6"; generateStartKeycloakTestingContainer({ "keycloakVersion": containerKeycloakVersion, From 4ee0823acb6b03d32557e4a61d44c6f4a87dc36c Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 01:47:21 +0100 Subject: [PATCH 71/83] Bump version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 4011e477..b9852d22 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.14", + "version": "9.4.0-rc.15", "description": "Create Keycloak themes using React", "repository": { "type": "git", From e3e6847c82cf6c5ebcad0ff9b3c77c9bc4118557 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 13:27:07 +0100 Subject: [PATCH 72/83] Prevent users from having to use any --- src/account/pages/PageProps.ts | 5 +++-- src/login/pages/PageProps.ts | 5 +++-- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/src/account/pages/PageProps.ts b/src/account/pages/PageProps.ts index 15ec16aa..620b6992 100644 --- 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 = { +export type PageProps = { Template: LazyOrNot<(props: TemplateProps) => JSX.Element | null>; - kcContext: KcContext; + kcContext: NarowedKcContext; i18n: I18nExtended; doUseDefaultCss: boolean; classes?: Partial>; diff --git a/src/login/pages/PageProps.ts b/src/login/pages/PageProps.ts index 6e513130..d2c80299 100644 --- 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 = { +export type PageProps = { Template: LazyOrNot<(props: TemplateProps) => JSX.Element | null>; - kcContext: KcContext; + kcContext: NarowedKcContext; i18n: I18nExtended; doUseDefaultCss: boolean; classes?: Partial>; From 5f257382fa700c83ff10b274a193620e78127d61 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 13:43:12 +0100 Subject: [PATCH 73/83] Prevent accumulation of assets in build dir --- src/bin/keycloakify/generateTheme/generateTheme.ts | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/bin/keycloakify/generateTheme/generateTheme.ts b/src/bin/keycloakify/generateTheme/generateTheme.ts index 3b1d026e..c39ada7c 100644 --- 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"; @@ -78,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. @@ -89,7 +95,7 @@ export async function generateTheme(params: { "resources", basenameOfTheKeycloakifyResourcesDir ), - "destDirPath": pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir) + destDirPath }); break apply_replacers_and_move_to_theme_resources; @@ -97,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. From 99bfd7379bd4b0b5d4dd69b2762ce4576f3be442 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 13:43:34 +0100 Subject: [PATCH 74/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b9852d22..fba918b3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.15", + "version": "9.4.0-rc.16", "description": "Create Keycloak themes using React", "repository": { "type": "git", From d80a5839797402c3c1fbf784665202929397ba70 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 23:42:31 +0100 Subject: [PATCH 75/83] Better test for isStorybook --- src/lib/isStorybook.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/lib/isStorybook.ts b/src/lib/isStorybook.ts index 2913597f..d484f6d8 100644 --- a/src/lib/isStorybook.ts +++ b/src/lib/isStorybook.ts @@ -1,3 +1 @@ -import { BASE_URL } from "./BASE_URL"; - -export const isStorybook = BASE_URL.startsWith("."); +export const isStorybook = Object.keys(window).find(key => key.startsWith("__STORYBOOK")) !== undefined; From 54b869def1a745c1e4ca6ab03010be6cd9434fd4 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 23:43:21 +0100 Subject: [PATCH 76/83] Release candidate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index fba918b3..95905656 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.16", + "version": "9.4.0-rc.17", "description": "Create Keycloak themes using React", "repository": { "type": "git", From d9c406800a068aebc664a2f604f44a2223410ca7 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Mon, 12 Feb 2024 23:57:21 +0100 Subject: [PATCH 77/83] Fix tests --- src/lib/isStorybook.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/isStorybook.ts b/src/lib/isStorybook.ts index d484f6d8..f684e7c8 100644 --- a/src/lib/isStorybook.ts +++ b/src/lib/isStorybook.ts @@ -1 +1 @@ -export const isStorybook = Object.keys(window).find(key => key.startsWith("__STORYBOOK")) !== undefined; +export const isStorybook = typeof window === "object" && Object.keys(window).find(key => key.startsWith("__STORYBOOK")) !== undefined; From a1c0bfda6c29e88214bc6ad29cc88c32a268fe12 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 13 Feb 2024 01:13:26 +0100 Subject: [PATCH 78/83] Bump version --- README.md | 4 ++++ package.json | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index f441dcf1..0e257d11 100644 --- a/README.md +++ b/README.md @@ -130,6 +130,10 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d # Changelog highlights +## 9.4 + +**Vite Support 🎉** + ## 9.0 Bring back support for account themes in Keycloak v23 and up! [See issue](https://github.com/keycloakify/keycloakify/issues/389). diff --git a/package.json b/package.json index 95905656..a0409d26 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0-rc.17", + "version": "9.4.0", "description": "Create Keycloak themes using React", "repository": { "type": "git", From b9abd74156088eb19380eeb6a81667f01973959e Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 13 Feb 2024 01:33:15 +0100 Subject: [PATCH 79/83] Create a .gitignore that matches all in the build_keycloak directory --- src/bin/keycloakify/keycloakify.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/bin/keycloakify/keycloakify.ts b/src/bin/keycloakify/keycloakify.ts index 2e1e3548..3022cdf9 100644 --- a/src/bin/keycloakify/keycloakify.ts +++ b/src/bin/keycloakify/keycloakify.ts @@ -67,6 +67,8 @@ export async function main() { buildOptions }); + fs.writeFileSync(pathJoin(buildOptions.keycloakifyBuildDirPath, ".gitignore"), Buffer.from("*", "utf8")); + logger.log( [ "", From 34f64184d9ed46d627d8e05d1670ce81dfd63c3b Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 13 Feb 2024 01:33:31 +0100 Subject: [PATCH 80/83] Bump version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index a0409d26..e611d293 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "keycloakify", - "version": "9.4.0", + "version": "9.4.1", "description": "Create Keycloak themes using React", "repository": { "type": "git", From 040284af71f5fae8d65fafc798dc29d6b9072fcb Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 13 Feb 2024 04:46:36 +0100 Subject: [PATCH 81/83] Reference Vite doc --- README.md | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 0e257d11..386998cd 100644 --- a/README.md +++ b/README.md @@ -132,7 +132,12 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d ## 9.4 -**Vite Support 🎉** +**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 From 7c42d9082a6825ab6d2405cc25fc141a94586118 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 13 Feb 2024 04:47:14 +0100 Subject: [PATCH 82/83] Remove broken badge --- README.md | 3 --- 1 file changed, 3 deletions(-) diff --git a/README.md b/README.md index 386998cd..cf015140 100644 --- a/README.md +++ b/README.md @@ -14,9 +14,6 @@ - - - From 563518cf46b3b857ad907143e161582b39ea0b28 Mon Sep 17 00:00:00 2001 From: Joseph Garrone Date: Tue, 13 Feb 2024 15:07:14 +0100 Subject: [PATCH 83/83] Remove poll --- README.md | 4 ---- 1 file changed, 4 deletions(-) diff --git a/README.md b/README.md index cf015140..8415975f 100644 --- a/README.md +++ b/README.md @@ -40,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.